From 1479bf7de4e245665ab5918caeb1c8e37d9a4c74 Mon Sep 17 00:00:00 2001 From: Jeff Schiller Date: Mon, 21 Sep 2009 02:05:58 +0000 Subject: [PATCH] More work on Layers UI, base internal work to get layers created. git-svn-id: http://svg-edit.googlecode.com/svn/trunk@667 eee81c28-f429-11dd-99c0-75d572ba1ddd --- editor/images/go-down.png | Bin 0 -> 683 bytes editor/images/go-up.png | Bin 0 -> 652 bytes editor/images/view-refresh.png | Bin 0 -> 912 bytes editor/svg-editor.html | 7 ++--- editor/svgcanvas.js | 53 ++++++++++++++++++++------------- 5 files changed, 35 insertions(+), 25 deletions(-) create mode 100644 editor/images/go-down.png create mode 100644 editor/images/go-up.png create mode 100644 editor/images/view-refresh.png diff --git a/editor/images/go-down.png b/editor/images/go-down.png new file mode 100644 index 0000000000000000000000000000000000000000..3dd7fccdf06321880f69d65631a363e4b813ba04 GIT binary patch literal 683 zcmV;c0#yBpP)i}4~9FCHr5K@{qtRq-ka(iJ?ZP=uTm zA)-=KTXM11RS2~$6nm&uv{cQSuKf$?CbP4jht?XK7~kVJ-#qia^UW|KLbc-EY953z z>WRV7dqi_}NvUZfgl}C)!*&F0M_|b+V97E80CykVr~%gk05Haon|Y41T|%KagO77# zXg_$ht|?xxSRKlv`0H+L2mld?91sx{?rsQB5|>q-9K_b`yI?say^?H5vawt?QN0%L zQr8VKjyDQ9NJT;|(TgXq`xKW7BF8I9f|vxjL{S!?dO5hlaQ@UaF9;B#f^;@jnqQnt zF(N{uTTQn`k0*~rlb-kaSCCvlqKp-L5!3TI5NItHN89$(7@Zg?Pfm^Zz3vh1d@XXv z%dw2{#h9WC`nbQFn~GCVFR$PcMeY21IKx0j@A8ZjM9Y6Ue=LTlryr z>(@2W+wdKbgN~t*f$yfVK)ah_*yWGG{JKoJQ9bX-)!YpMx+aPwk<4VDSzECWL8lc@ z`=3~j{FA#{Y~yeIt$3GuF4Da7HUP}#KVRBt{l5SJIDAFD4*5 zlTT<9K@`TnH@h?0jfHw>O#jh>1nt2m6SAzrkW<%*%=Q}tRboP9pC%r$9&(LA+0sq)ybQD9srhR zz3Fxu)^6aqJl)?FN%nOeOgb)4?+M_zJQ@)DvRBSb2FFH|!GH*69hXP{3*flC1BAti zbJNzAm&ca3iTKDR3xq|-Y2`eKx?tij|4I5$vH1yqf%5H^Fb8J54jK)5$VM-C5%i8b<|k&Kxh=#FG>Ox&>r z4?sb}hlkg>1-vahgJcyDBP0eg&{{(&pkA-x@zeQAv9vj35<}`!ZpEItce&w-qk8xH z6RRw9@QrP7!N5#{!3lE@ZdYYZTfgiFi6Lb!&3aDLCbZTHrTP~zgJ5t59%w*hOoWowDaEkzU!j%l38$)o7}}cCnx7z zVrKYAWwOsS=-Lqw-t?qu)r6QQ!notg696vQmg&~r9t3cLe1UW(yG7H)Ku^~yeO+g> z(bg0Jm{BNJFfw+(d}sQhCl&9uE%R)8S2n|p?*PPznUTt5*BiPR+1l3~ipPS`iO?Jk zARN#U4H*a;0yD)$9M29{3dM>Y4K?&WE>{g^G!Zl7)jelV^{i|AG#D_%trsJC8h7YDw+>Nu`!(E)&&KfE(t5U!_KF)uRXGsl%@ z#;0eK6ZhtiUhin`+P8I6C=m!d1ufk}o{_gOutKfI-_b^R{JP z`QzJ2^LHMWS&9G(o-t)@yh1Uq9cxfG6X$C)H~ghbOC7?WrZ-yyL0>0QOs`0x)U>uAAQg z>;&LGL0Gpf^PVr@oj>}%1`wDT7wv!4sq=s3q*Oh&WftpMhqGg=O68@F-$%x80Ep=T zKm-sG?*3PXAs8nI|0Dok)RR-0Y?z4d_HJBzCO6*s&6^5?o^0No>h2ra)My_p{u2^&LcltM%9%NL@3OcL;J5G-fbF(raxE|ez

Layers

-
New Layer Delete Layer + Rename Layer + Move Layer up + Move Layer Down
- -

By default, this panel will be collapsed. It will be expandable by some button/handle.

-
diff --git a/editor/svgcanvas.js b/editor/svgcanvas.js index a2c4d3f0..5bb5fdf7 100644 --- a/editor/svgcanvas.js +++ b/editor/svgcanvas.js @@ -557,12 +557,14 @@ function BatchCommand(text) { var shape = svgdoc.getElementById(data.attr.id); // if shape is a path but we need to create a rect/ellipse, then remove the path if (shape && data.element != shape.tagName) { - svgzoom.removeChild(shape); + current_layer.removeChild(shape); shape = null; } if (!shape) { shape = svgdoc.createElementNS(svgns, data.element); - svgzoom.appendChild(shape); + if (current_layer) { + current_layer.appendChild(shape); + } } assignAttributes(shape, data.attr, 100); cleanupElement(shape); @@ -592,7 +594,11 @@ function BatchCommand(text) { svgroot.appendChild(svgzoom); var comment = svgdoc.createComment(" created with SVG-edit - http://svg-edit.googlecode.com/ "); svgzoom.appendChild(comment); - + // associative array of layer names to elements + var all_layers = {}; + // pointer to the current layer + var current_layer = null; + var d_attr = null; var started = false; var obj_num = 1; @@ -674,7 +680,7 @@ function BatchCommand(text) { var resultList = null; try { - resultList = svgroot.getIntersectionList(rect, null); + resultList = current_layer.getIntersectionList(rect, null); } catch(e) { } if (resultList == null || typeof(resultList.item) != "function") { @@ -1378,11 +1384,10 @@ function BatchCommand(text) { started = true; current_resize_mode = "none"; var t = evt.target; - // if this element is in a group, go up until we reach the top-level group - // TODO: once we implement Layers, the top-level groups will be layers so - // we will want to stop just before then (parentNode.parentNode) + // if this element is in a group, go up until we reach the top-level group + // just below the layer groups // TODO: once we implement links, we also would have to check for elements - while (t.parentNode.tagName == "g") { + while (t.parentNode.parentNode.tagName == "g") { t = t.parentNode; } // WebKit returns
when the canvas is clicked, Firefox/Opera return @@ -2512,7 +2517,6 @@ function BatchCommand(text) { }; // this function returns false if the set was unsuccessful, true otherwise - // TODO: should this function keep throwing the exception? // TODO: after parsing in the new text, do we need to synchronize getId()? this.setSvgString = function(xmlString) { try { @@ -2524,11 +2528,6 @@ function BatchCommand(text) { var batchCmd = new BatchCommand("Change Source"); - // save our old selectorParentGroup - // not needed anymore, we can keep svgroot forever (and just replace svgzoom) - // TODO: reset zoom level on svgroot -// selectorManager.selectorParentGroup = svgroot.removeChild(selectorManager.selectorParentGroup); - // remove old svg document var oldzoom = svgroot.removeChild(svgzoom); batchCmd.addSubCommand(new RemoveElementCommand(oldzoom, svgroot)); @@ -2564,10 +2563,9 @@ function BatchCommand(text) { // reset zoom current_zoom = 1; + + // identify layers - // add back in parentSelectorGroup - // not needed anymore -// svgroot.appendChild(selectorManager.selectorParentGroup); selectorManager.update(); addCommandToHistory(batchCmd); @@ -2581,18 +2579,29 @@ function BatchCommand(text) { }; this.clear = function() { + current_poly_pts = []; + + // clear the svgzoom node var nodes = svgzoom.childNodes; var len = svgzoom.childNodes.length; var i = 0; - current_poly_pts = []; this.clearSelection(); for(var rep = 0; rep < len; rep++){ if (nodes[i].nodeType == 1) { // element node - nodes[i].parentNode.removeChild(nodes[i]); + svgzoom.removeChild(nodes[i]); } else { i++; } } + // create empty first layer + current_layer = svgdoc.createElementNS(svgns, "g"); + var layer_title = svgdoc.createElementNS(svgns, "title"); + layer_title.appendChild(svgdoc.createTextNode("Layer 1")); + current_layer.appendChild(layer_title); + current_layer = svgzoom.appendChild(current_layer); + all_layers = {}; + all_layers["Layer 1"] = current_layer; + // clear the undo stack resetUndoStack(); // reset the selector manager @@ -3410,7 +3419,7 @@ function BatchCommand(text) { }; this.getVisibleElements = function(includeBBox) { - var nodes = svgzoom.childNodes; + var nodes = current_layer.childNodes; var i = nodes.length; var contentElems = []; @@ -3643,7 +3652,9 @@ function BatchCommand(text) { this.moveSelectedElements(dx,dy); }; this.getZoom = function(){return current_zoom;}; -} + + this.clear(); +}; // Static class for various utility functions