From 2229ecdd45266cb5652feccb76d943fa444c9d6e Mon Sep 17 00:00:00 2001 From: Alexis Deveria Date: Thu, 4 Feb 2010 17:10:03 +0000 Subject: [PATCH] Improved arrow handling, fixed issue 463 git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1341 eee81c28-f429-11dd-99c0-75d572ba1ddd --- editor/svg-editor.js | 4 ++-- editor/svgcanvas.js | 1 + extensions/ext-arrows.js | 42 +++++++++++++++++++++++++---------- extensions/ext-connector.js | 44 ++++++++++++++++++++++++++++++------- 4 files changed, 69 insertions(+), 22 deletions(-) diff --git a/editor/svg-editor.js b/editor/svg-editor.js index eb29e1d4..5f15e848 100644 --- a/editor/svg-editor.js +++ b/editor/svg-editor.js @@ -306,7 +306,7 @@ function svg_edit_setup() { $(this).mouseup(func); if(opts.key) { - $(document).bind('keydown', {combi: opts.key+''}, func); + $(document).bind('keydown', {combi: opts.key+'', disableInInput:true}, func); } }); @@ -485,7 +485,7 @@ function svg_edit_setup() { if(btn.type == 'mode') { button.bind(name, func); if(btn.key) { - $(document).bind('keydown', {combi: btn.key}, func); + $(document).bind('keydown', {combi: btn.key, disableInInput: true}, func); if(btn.title) button.attr("title", btn.title + ' ['+btn.key+']'); } } diff --git a/editor/svgcanvas.js b/editor/svgcanvas.js index 3748b281..ea6484f5 100644 --- a/editor/svgcanvas.js +++ b/editor/svgcanvas.js @@ -990,6 +990,7 @@ function BatchCommand(text) { var ext = ext_func({ content: svgcontent, root: svgroot, + call: call, getNextId: getNextId, getElem: getElem, addSvgElementFromJson: addSvgElementFromJson, diff --git a/extensions/ext-arrows.js b/extensions/ext-arrows.js index 42b75312..4b935074 100644 --- a/extensions/ext-arrows.js +++ b/extensions/ext-arrows.js @@ -28,8 +28,30 @@ $(function() { $('#arrow_panel').toggle(on); if(on) { - var has_arrow = selElems[0].getAttribute("marker-end"); - $("#arrow_list").val(has_arrow?"arrow":"none"); + var el = selElems[0]; + var end = el.getAttribute("marker-end"); + var start = el.getAttribute("marker-start"); + var mid = el.getAttribute("marker-mid"); + var val; + + if(end && start) { + val = "both"; + } else if(end) { + val = "end"; + } else if(start) { + val = "start"; + } else if(mid) { + val = "mid"; + if(mid.indexOf("bk") != -1) { + val = "mid_bk"; + } + } + + if(!start && !mid && !end) { + val = "none"; + } + + $("#arrow_list").val(val); } } @@ -45,8 +67,8 @@ $(function() { var marker = getElem(id); var pathdata = { - se_arrow_fw: {d:"m0,0l10,5l-10,5l5,-5l-5,-5z", refx:10}, - se_arrow_bk: {d:"m10,0l-10,5l10,5l-5,-5l5,-5z", refx:0} + se_arrow_fw: {d:"m0,0l10,5l-10,5l5,-5l-5,-5z", refx:8}, + se_arrow_bk: {d:"m10,0l-10,5l10,5l-5,-5l5,-5z", refx:2} } var data = pathdata[id]; @@ -78,9 +100,8 @@ $(function() { marker.appendChild(arrow); S.findDefs().appendChild(marker); } - - marker.setAttribute('refX', data.refx); + marker.setAttribute('refX', data.refx); } function setArrow(type) { @@ -101,7 +122,7 @@ $(function() { id = bk_id; } else if(type == "both") { addMarker(bk_id, type); - selElems[0].setAttribute("marker-start", "url(#" + bk_id + ")"); + svgCanvas.changeSelectedAttribute("marker-start", "url(#" + bk_id + ")"); type = "end"; id = fw_id; } else if (type == "start") { @@ -109,11 +130,8 @@ $(function() { } addMarker(id, type); - selElems[0].setAttribute("marker-"+type, "url(#" + id + ")"); - - - - + svgCanvas.changeSelectedAttribute("marker-"+type, "url(#" + id + ")"); + S.call("changed", selElems); } // Init code diff --git a/extensions/ext-connector.js b/extensions/ext-connector.js index 8c096ada..151b0d57 100644 --- a/extensions/ext-connector.js +++ b/extensions/ext-connector.js @@ -124,7 +124,7 @@ $(function() { }); } } - + function updateConnectors() { // Updates connector lines based on selected elements // Is not used on mousemove, as it runs getStrokedBBox every time, @@ -139,13 +139,15 @@ $(function() { var elem = conn.elem; var pre = conn.is_start?'start':'end'; + var sw = line.getAttribute('stroke-width'); // Update bbox for this element var bb = svgCanvas.getStrokedBBox([elem]); bb.x = conn.start_x; bb.y = conn.start_y; $(line).data(pre+'_bb', bb); - + var add_offset = $(line).data(pre+'_off'); + var alt_pre = conn.is_start?'end':'start'; // Get center pt of connected element @@ -154,17 +156,26 @@ $(function() { var src_y = bb2.y + bb2.height/2; // Set point of element being moved - var pt = getBBintersect(src_x, src_y, bb); + var pt = getBBintersect(src_x, src_y, bb, add_offset?sw:0); setPoint(line, conn.is_start?0:'end', pt.x, pt.y, true); // Set point of connected element - var pt2 = getBBintersect(pt.x, pt.y, $(line).data(alt_pre + '_bb')); + var pt2 = getBBintersect(pt.x, pt.y, $(line).data(alt_pre + '_bb'), $(line).data(alt_pre + '_off')?sw:0); setPoint(line, conn.is_start?'end':0, pt2.x, pt2.y, true); } } } - function getBBintersect(x, y, bb) { + function getBBintersect(x, y, bb, offset) { + if(offset) { + offset -= 0; + bb = $.extend({}, bb); + bb.width += offset; + bb.height += offset; + bb.x -= offset/2; + bb.y -= offset/2; + } + var mid_x = bb.x + bb.width/2; var mid_y = bb.y + bb.height/2; var len_x = x - mid_x; @@ -179,6 +190,8 @@ $(function() { } else { ratio = (bb.height/2) / Math.abs(len_y); } + + return { x: mid_x + len_x * ratio, y: mid_y + len_y * ratio @@ -333,7 +346,7 @@ $(function() { while(slen--) { var elem = selElems[slen]; // Look for selected connector elements - if(elem && $(elem).is(conn_sel)) { + if(elem && $(elem).data('c_start')) { // Remove the "translate" transform given to move svgCanvas.removeFromSelection([elem]); svgCanvas.getTransformList(elem).clear(); @@ -349,6 +362,7 @@ $(function() { var elem = conn.elem; var pre = conn.is_start?'start':'end'; + var sw = line.getAttribute('stroke-width'); // Update bbox for this element var bb = $(line).data(pre+'_bb'); @@ -364,11 +378,11 @@ $(function() { var src_y = bb2.y + bb2.height/2; // Set point of element being moved - var pt = getBBintersect(src_x, src_y, bb); + var pt = getBBintersect(src_x, src_y, bb, $(line).data(pre+'_off')?sw:0); setPoint(line, conn.is_start?0:'end', pt.x, pt.y, true); // Set point of connected element - var pt2 = getBBintersect(pt.x, pt.y, $(line).data(alt_pre + '_bb')); + var pt2 = getBBintersect(pt.x, pt.y, $(line).data(alt_pre + '_bb'), $(line).data(alt_pre+'_off')?sw:0); setPoint(line, conn.is_start?'end':0, pt2.x, pt2.y, true); } @@ -473,6 +487,20 @@ $(function() { init(); } + // Has marker, so change offset + if(elem && ( + elem.getAttribute("marker-start") || + elem.getAttribute("marker-mid") || + elem.getAttribute("marker-end") + )) { + var start = elem.getAttribute("marker-start"); + var end = elem.getAttribute("marker-end"); + console.log('elem',elem); + cur_line = elem; + $(elem) + .data("start_off", !!start) + .data("end_off", !!end); + } updateConnectors(); }, // toolButtonStateUpdate: function(opts) {