zcy
/
svgedit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added segment selection line for paths 

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@815 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Alexis Deveria 2009-10-13 14:52:51 +00:00
parent 5771e91e13
commit ad90154077
1 changed files with 58 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
editor/svgcanvas.js
View File

@ -1425,6 +1425,7 @@ function BatchCommand(text) {
this.addNodeToSelection = function(point) { this.addNodeToSelection = function(point) {
// Currently only one node can be selected at a time, should allow more later // Currently only one node can be selected at a time, should allow more later
// Should point be the index or the grip element? // Should point be the index or the grip element?
var is_closed = current_poly.getAttribute('d').toLowerCase().indexOf('z') != -1; var is_closed = current_poly.getAttribute('d').toLowerCase().indexOf('z') != -1;
if(is_closed && point == current_poly_pts.length/2 - 1) { if(is_closed && point == current_poly_pts.length/2 - 1) {
@ -1433,8 +1434,11 @@ function BatchCommand(text) {
current_poly_pt = point; current_poly_pt = point;
} }
$('#polypointgrip_container circle').attr('fill','#0F0'); $('#polypointgrip_container circle').attr('stroke','#00F');
var grip = $('#polypointgrip_' + point).attr('fill','blue'); var grip = $('#polypointgrip_' + point).attr('stroke','#0FF');
updateSegLine();
updateSegLine(true);
call("selected", [grip[0]]); call("selected", [grip[0]]);
} }
@ -1696,6 +1700,7 @@ function BatchCommand(text) {
// Select this point // Select this point
current_poly_pt_drag = parseInt(id.substr(14)); current_poly_pt_drag = parseInt(id.substr(14));
canvas.addNodeToSelection(current_poly_pt_drag); canvas.addNodeToSelection(current_poly_pt_drag);
updateSegLine();
} else if(id.indexOf("ctrlpointgrip_") == 0) { } else if(id.indexOf("ctrlpointgrip_") == 0) {
current_ctrl_pt_drag = id.split('_')[1]; current_ctrl_pt_drag = id.split('_')[1];
} }
@ -2034,6 +2039,8 @@ function BatchCommand(text) {
c_item['y' + ctrl_num] = y; c_item['y' + ctrl_num] = y;
replacePathSeg(6, index+1, [c_item.x,c_item.y, c_item.x1,c_item.y1, c_item.x2,c_item.y2]); replacePathSeg(6, index+1, [c_item.x,c_item.y, c_item.x1,c_item.y1, c_item.x2,c_item.y2]);
updateSegLine(true);
var grip = document.getElementById("ctrlpointgrip_" + current_ctrl_pt_drag); var grip = document.getElementById("ctrlpointgrip_" + current_ctrl_pt_drag);
if(grip) { if(grip) {
grip.setAttribute("cx", mouse_x); grip.setAttribute("cx", mouse_x);
@ -2183,7 +2190,7 @@ function BatchCommand(text) {
'id': "polypointgrip_" + index, 'id': "polypointgrip_" + index,
'display': "none", 'display': "none",
'r': 4, 'r': 4,
'fill': "#0F0", 'fill': "#0FF",
'stroke': "#00F", 'stroke': "#00F",
'stroke-width': 2, 'stroke-width': 2,
'cursor': 'move', 'cursor': 'move',
@ -2192,10 +2199,7 @@ function BatchCommand(text) {
pointGrip = pointGripContainer.appendChild(pointGrip); pointGrip = pointGripContainer.appendChild(pointGrip);
var grip = $('#polypointgrip_'+index); var grip = $('#polypointgrip_'+index);
// grip.mouseover( function() { this.setAttribute("stroke", "#F00"); } );
// grip.mouseout( function() {this.setAttribute("stroke", "#00F"); } );
grip.dblclick(function() { grip.dblclick(function() {
canvas.setSegType(); canvas.setSegType();
}); });
} }
@ -2208,27 +2212,40 @@ function BatchCommand(text) {
}); });
}; };
// Hack for Webktit to change the segment list from absolute values var updateSegLine = function(next_node) {
// back to relative values. Probably inefficient, so not currently used // create segment line
// var fixWebkitNodes = function() { var segLine = document.getElementById("segline");
// var list = current_poly.pathSegList; if(!segLine) {
// var pts = current_poly_pts; var pointGripContainer = $('#polypointgrip_container')[0];
// var num = list.numberOfItems; segLine = document.createElementNS(svgns, "path");
// for(var i = 0; i<num; i++) { assignAttributes(segLine, {
// var item = list.getItem(i); 'id': "segline",
// if(item.pathSegType == 4) { 'fill': "none",
// list.removeItem(i); 'stroke': "#0FF",
// var rel_x = pts[i*2] - pts[(i-1)*2]; 'stroke-width': 2,
// var rel_y = pts[i*2 + 1] - pts[(i-1)*2 + 1]; 'style':'pointer-events:none'
// var seg = current_poly.createSVGPathSegLinetoRel(rel_x, rel_y); });
// list.insertItemBefore(seg, i); segLine = pointGripContainer.appendChild(segLine);
// i--; }
// } if(!segLine.getAttribute('d')) {
// } var pt = getPolyPoint(current_poly_pt);
// for(var i = 0; i<num; i++) { segLine.setAttribute('d', 'M' + pt.join(',') + ' 0,0');
// var item = list.getItem(i); }
// } segLine.setAttribute('display','inline');
// }
if(!next_node) {
// Replace "M" val
replacePathSeg(2, 0, getPolyPoint(current_poly_pt, true), segLine);
} else {
var seg = current_poly.pathSegList.getItem(current_poly_pt+1);
var points = [seg.x, seg.y];
if(seg.x1 != null && seg.x2 != null) {
points.splice(2, 0, seg.x1, seg.y1, seg.x2, seg.y2);
}
points = $.map(points, function(n){return n*current_zoom;});
replacePathSeg(seg.pathSegType, 1, points, segLine);
}
}
var updatePoly = function(mouse_x, mouse_y, old_poly_pts) { var updatePoly = function(mouse_x, mouse_y, old_poly_pts) {
var x = mouse_x / current_zoom; var x = mouse_x / current_zoom;
@ -2333,8 +2350,6 @@ function BatchCommand(text) {
if(is_first && is_closed) { if(is_first && is_closed) {
var last_type = setSeg(last_index,1); var last_type = setSeg(last_index,1);
// x_diff *= -1;
// y_diff *= -1;
} }
// move the point grip // move the point grip
@ -2351,7 +2366,6 @@ function BatchCommand(text) {
call("selected", [grip]); call("selected", [grip]);
} }
// move the control grips + lines
if(is_first) cur_type = last_type; if(is_first) cur_type = last_type;
if(cur_type != 4) { if(cur_type != 4) {
@ -2374,7 +2388,10 @@ function BatchCommand(text) {
addControlPointGrip(x2,y2, mouse_x,mouse_y, id1, true); addControlPointGrip(x2,y2, mouse_x,mouse_y, id1, true);
} }
} }
updateSegLine();
if(next_type != 4) {
updateSegLine(true);
}
} }
var getPolyPoint = function(index, raw_val) { var getPolyPoint = function(index, raw_val) {
@ -2390,12 +2407,11 @@ function BatchCommand(text) {
} }
// This replaces the segment at the given index. Type is given as number. // This replaces the segment at the given index. Type is given as number.
var replacePathSeg = function(type, index, pts) { var replacePathSeg = function(type, index, pts, poly) {
var poly = current_poly, func = 'createSVGPathSeg' + pathFuncs[type]; if(!poly) poly = current_poly;
var func = 'createSVGPathSeg' + pathFuncs[type];
var seg = poly[func].apply(poly, pts); var seg = poly[func].apply(poly, pts);
poly.pathSegList.replaceItem(seg, index); poly.pathSegList.replaceItem(seg, index);
// Fyrd: here's where i think it needs to be used
// poly.setAttribute("d", convertToD(poly.pathSegList));
} }
var addControlPointGrip = function(x, y, source_x, source_y, id, raw_val) { var addControlPointGrip = function(x, y, source_x, source_y, id, raw_val) {
@ -2532,11 +2548,11 @@ function BatchCommand(text) {
// recalculate current_poly_pts // recalculate current_poly_pts
recalcPolyPoints(); recalcPolyPoints();
canvas.clearSelection(); canvas.clearSelection();
// save the poly's bbox // save the poly's bbox
selectedBBoxes[0] = canvas.getBBox(current_poly); selectedBBoxes[0] = canvas.getBBox(current_poly);
addAllPointGripsToPoly(); addAllPointGripsToPoly();
canvas.addNodeToSelection(0);
} // going into polyedit mode } // going into polyedit mode
else { else {
current_poly = t; current_poly = t;
@ -2848,6 +2864,7 @@ function BatchCommand(text) {
setPointContainerTransform(xform); setPointContainerTransform(xform);
} }
resetPointGrips(); resetPointGrips();
updateSegLine(true);
} // if rotated } // if rotated
@ -2860,6 +2877,7 @@ function BatchCommand(text) {
current_poly_pts[current_poly_pts.length-2] = getPolyPoint(0,true)[0]; current_poly_pts[current_poly_pts.length-2] = getPolyPoint(0,true)[0];
current_poly_pts[current_poly_pts.length-1] = getPolyPoint(0,true)[1]; current_poly_pts[current_poly_pts.length-1] = getPolyPoint(0,true)[1];
} }
updateSegLine();
// make these changes undo-able // make these changes undo-able
} // if (current_poly_pt_drag != -1) } // if (current_poly_pt_drag != -1)
@ -4073,6 +4091,7 @@ function BatchCommand(text) {
addAllPointGripsToPoly(); addAllPointGripsToPoly();
recalculateDimensions(current_poly, current_poly.getBBox()); recalculateDimensions(current_poly, current_poly.getBBox());
updateSegLine(true);
batchCmd.addSubCommand(new ChangeElementCommand(current_poly, {d: old_d})); batchCmd.addSubCommand(new ChangeElementCommand(current_poly, {d: old_d}));
addCommandToHistory(batchCmd); addCommandToHistory(batchCmd);