From ef4d16ee052e8a3eb4e490078f2decab88f20230 Mon Sep 17 00:00:00 2001 From: Jeff Schiller Date: Tue, 22 Sep 2009 02:42:31 +0000 Subject: [PATCH] Issue 73: Make New/Delete layer undo-able. Implement Rename layer. Ensure layers have unique names git-svn-id: http://svg-edit.googlecode.com/svn/trunk@671 eee81c28-f429-11dd-99c0-75d572ba1ddd --- editor/svg-editor.js | 34 +++++++++++++++++++++++++++++++--- editor/svgcanvas.js | 40 ++++++++++++++++++++++++++-------------- 2 files changed, 57 insertions(+), 17 deletions(-) diff --git a/editor/svg-editor.js b/editor/svg-editor.js index 2be7ddc1..4530d243 100644 --- a/editor/svg-editor.js +++ b/editor/svg-editor.js @@ -79,6 +79,9 @@ function svg_edit_setup() { // we tell it to skip focusing the text control if the // text element was previously in focus updateContextPanel(); + + // TODO: ensure that the current layer is selected + console.log(svgCanvas.getCurrentLayer()); }; var zoomChanged = function(window, bbox) { @@ -655,7 +658,6 @@ function svg_edit_setup() { var clickUndo = function(){ if (svgCanvas.getUndoStackSize() > 0) { svgCanvas.undo(); - console.log('yooya'); populateLayers(); } }; @@ -1083,7 +1085,15 @@ function svg_edit_setup() { }); $('#layer_new').click(function() { - svgCanvas.createLayer("New Layer"); + var curNames = new Array(svgCanvas.getNumLayers()); + for (var i = 0; i < curNames.length; ++i) { curNames[i] = svgCanvas.getLayer(i); } + + var newName = prompt("Please enter a unique layer name",""); + if (jQuery.inArray(newName, curNames) != -1) { + alert("There is already a layer named that!"); + return; + } + svgCanvas.createLayer(newName); updateContextPanel(); populateLayers(); $('#layerlist option:last').attr("selected", "selected"); @@ -1097,9 +1107,27 @@ function svg_edit_setup() { } }); + $('#layer_rename').click(function() { + var oldName = $('#layerlist option:selected').attr("value"); + var newName = prompt("Please enter the new layer name",""); + if (oldName == newName) { + alert("Layer already has that name"); + return; + } + + var curNames = new Array(svgCanvas.getNumLayers()); + for (var i = 0; i < curNames.length; ++i) { curNames[i] = svgCanvas.getLayer(i); } + if (jQuery.inArray(newName, curNames) != -1) { + alert("There is already a layer named that!"); + return; + } + + svgCanvas.renameLayer(oldName, newName); + populateLayers(); + }); + var populateLayers = function(){ var layerlen = svgCanvas.getNumLayers(); - console.log('layerlen=' + layerlen); $('#layerlist').empty(); for (var layer = 0; layer < layerlen; ++layer) { var name = svgCanvas.getLayer(layer); diff --git a/editor/svgcanvas.js b/editor/svgcanvas.js index 84bff35a..2c24fad2 100644 --- a/editor/svgcanvas.js +++ b/editor/svgcanvas.js @@ -1,10 +1,10 @@ /* Issue 73 (Layers) TODO: -- consider getting rid of the element and using @id like AI (easier to browse the DOM in FB) +- do pop-up window that asks for layer name and rename layer, ensure that is undo-able +- ensure that pointer-events work properly with layers named the same - create API for SvgCanvas that allows the client to: - change layer order -- ensure New/Delete are undo-able - create a mouseover region on the sidepanels that is resizable and affects all children within - default the side panel to closed - add a button that opens the side panel? @@ -81,6 +81,10 @@ function ChangeElementCommand(elem, attrs, text) { } } } + // if we are changing layer names, re-identify all layers + if (this.elem.tagName == "title" && this.elem.parentNode.parentNode == svgzoom) { + canvas.identifyLayers(); + } return true; }; @@ -110,6 +114,10 @@ function ChangeElementCommand(elem, attrs, text) { } } } + // if we are changing layer names, re-identify all layers + if (this.elem.tagName == "title" && this.elem.parentNode.parentNode == svgzoom) { + canvas.identifyLayers(); + } return true; }; @@ -749,6 +757,7 @@ function BatchCommand(text) { }; var call = function(event, arg) { + console.log(events[event]); if (events[event]) { return events[event](this,arg); } @@ -2617,6 +2626,9 @@ function BatchCommand(text) { return true; }; + // Layer API Functions + // TODO: change layer order + this.identifyLayers = function() { all_layers = []; var numchildren = svgzoom.childNodes.length; @@ -2636,19 +2648,19 @@ function BatchCommand(text) { } walkTree(current_layer, function(e){e.setAttribute("style","pointer-events:all");}); }; - // Layer API Functions - // TODO: change layer order this.createLayer = function(name) { var batchCmd = new BatchCommand("Create Layer"); current_layer = svgdoc.createElementNS(svgns, "g"); var layer_title = svgdoc.createElementNS(svgns, "title"); - layer_title.appendChild(svgdoc.createTextNode(name)); + layer_title.textContent = name; //appendChild(svgdoc.createTextNode(name)); current_layer.appendChild(layer_title); current_layer = svgzoom.appendChild(current_layer); all_layers.push([name,current_layer]); batchCmd.addSubCommand(new InsertElementCommand(current_layer)); addCommandToHistory(batchCmd); + canvas.clearSelection(); + call("changed", [current_layer]); }; this.deleteCurrentLayer = function() { @@ -2669,6 +2681,8 @@ function BatchCommand(text) { all_layers = new_layers; current_layer = all_layers[all_layers.length-1][1]; addCommandToHistory(batchCmd); + canvas.clearSelection(); + call("changed", [svgzoom]); return true; } return false; @@ -2711,6 +2725,7 @@ function BatchCommand(text) { var oldLayer = current_layer; // setCurrentLayer will return false if the name doesn't already exists if (!canvas.setCurrentLayer(newname)) { + var batchCmd = new BatchCommand("Rename Layer"); // find the index of the layer for (var i = 0; i < all_layers.length; ++i) { if (all_layers[i][1] == oldLayer) break; @@ -2724,9 +2739,12 @@ function BatchCommand(text) { // found the <title> element, now append all the if (child && child.tagName == "title") { // wipe out old name - // TODO: make this undo-able while (child.firstChild) { child.removeChild(child.firstChild); } - child.appendChild( svgdoc.createTextNode(newname) ); + child.textContent = newname; + + batchCmd.addSubCommand(new ChangeElementCommand(child, {"#text":oldname})); + addCommandToHistory(batchCmd); + call("changed", [oldLayer]); return true; } } @@ -2743,13 +2761,7 @@ function BatchCommand(text) { var child = g.childNodes.item(i); // found the <title> element, now append all the if (child && child.tagName == "title") { - var tlen = child.childNodes.length; - for (var j = 0; j < tlen; ++j) { - var textNode = child.childNodes.item(j); - if (textNode.nodeType == 3) { - name += textNode.nodeValue; - } - } + name = child.textContent; break; } }