From c21b9be33c4cc7353346ef7507a64959c42cc35d Mon Sep 17 00:00:00 2001 From: Jeff Schiller Date: Sun, 16 Jan 2011 16:28:26 +0000 Subject: [PATCH] Fix width of layer button panel for Firefox OSX. Fix setting of uiStrings in editor for New Label. Move all_layers into svgedit.document.Document git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1919 eee81c28-f429-11dd-99c0-75d572ba1ddd --- editor/document.js | 23 +++++++++ editor/locale/locale.js | 3 ++ editor/svg-editor.css | 2 +- editor/svg-editor.js | 1 + editor/svgcanvas.js | 101 +++++++++++++++++++--------------------- 5 files changed, 77 insertions(+), 53 deletions(-) diff --git a/editor/document.js b/editor/document.js index d01989bd..4a52b4a2 100644 --- a/editor/document.js +++ b/editor/document.js @@ -34,6 +34,25 @@ if (!svgedit.document) { var svg_ns = "http://www.w3.org/2000/svg"; var se_ns = "http://svg-edit.googlecode.com"; +/** + * This class encapsulates the concept of a layer in the document. + * @param name {String} Layer name + * @param child {SVGGElement} Layer SVG group. + */ +svgedit.document.Layer = function(name, group) { + this.name_ = name; + this.group_ = group; +}; + +svgedit.document.Layer.prototype.getName = function() { + return this.name_; +}; + +svgedit.document.Layer.prototype.getGroup = function() { + return this.group_; +}; + + /** * This class encapsulates the concept of a SVG-edit document. * @@ -54,6 +73,10 @@ svgedit.document.Document = function(svgElem, opt_idPrefix) { this.idPrefix = opt_idPrefix || "svg_"; this.releasedNums = []; + // z-ordered array of tuples containing layer names and elements + // the first layer is the one at the bottom of the rendering + this.all_layers = []; + // Determine if the element has a nonce on it this.nonce_ = this.svgElem_.getAttributeNS(se_ns, 'nonce') || ""; }; diff --git a/editor/locale/locale.js b/editor/locale/locale.js index a8333582..45249f9c 100644 --- a/editor/locale/locale.js +++ b/editor/locale/locale.js @@ -49,6 +49,7 @@ var svgEditor = (function($, Editor) { Editor.readLang = function(langData) { +debugger; var more = Editor.canvas.runExtensions("addlangData", lang_param, true); $.each(more, function(i, m) { if(m.data) { @@ -67,6 +68,8 @@ var svgEditor = (function($, Editor) { common = langData.common, ui = langData.ui; + Editor.uiStrings['layers'] = layers; + setStrings('content', { copyrightLabel: misc.powered_by, curve_segments: properties.curve_segments, diff --git a/editor/svg-editor.css b/editor/svg-editor.css index 34bccda2..bf864203 100644 --- a/editor/svg-editor.css +++ b/editor/svg-editor.css @@ -257,7 +257,7 @@ padding: 0px; padding-left: 2px; padding-right: 2px; - width: 123px; + width: 125px; height: 20px; border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; diff --git a/editor/svg-editor.js b/editor/svg-editor.js index 2a4fed2a..89ab5213 100644 --- a/editor/svg-editor.js +++ b/editor/svg-editor.js @@ -3536,6 +3536,7 @@ $('#layer_new').click(function() { var i = svgCanvas.getNumLayers(); do { + debugger; var uniqName = uiStrings.layers.layer + " " + ++i; } while(svgCanvas.hasLayer(uniqName)); diff --git a/editor/svgcanvas.js b/editor/svgcanvas.js index 5dc08b08..4455a789 100644 --- a/editor/svgcanvas.js +++ b/editor/svgcanvas.js @@ -539,12 +539,8 @@ var restoreRefElems = function(elem) { })(); -// z-ordered array of tuples containing layer names and elements -// the first layer is the one at the bottom of the rendering -var all_layers = [], - - // Object to contain image data for raster images that were found encodable - encodableImages = {}, +// Object to contain image data for raster images that were found encodable +var encodableImages = {}, // String with image URL of last loadable image last_good_img_url = curConfig.imgPath + 'logo.png', @@ -6422,7 +6418,7 @@ var uniquifyElems = this.uniquifyElems = function(g) { }); // check xlink:href now - var href = getHref(n); + var href = svgedit.utilities.getHref(n); // TODO: what if an or element refers to an element internally? if(href && ref_elems.indexOf(n.nodeName) >= 0) { @@ -6969,7 +6965,7 @@ this.importSvgString = function(xmlString) { // Function: identifyLayers // Updates layer system var identifyLayers = canvas.identifyLayers = function() { - all_layers = []; + current_doc.all_layers = []; leaveContext(); var numchildren = svgcontent.childNodes.length; // loop through all children of svgcontent @@ -6991,7 +6987,7 @@ var identifyLayers = canvas.identifyLayers = function() { // store layer and name in global variable if (name) { layernames.push(name); - all_layers.push( [name,child] ); + current_doc.all_layers.push( [name,child] ); current_layer = child; svgedit.utilities.walkTree(child, function(e){e.setAttribute("style", "pointer-events:inherit");}); current_layer.setAttribute("style", "pointer-events:none"); @@ -7022,7 +7018,7 @@ var identifyLayers = canvas.identifyLayers = function() { current_layer.appendChild(orphans[j]); } current_layer = svgcontent.appendChild(current_layer); - all_layers.push( [newname, current_layer] ); + current_doc.all_layers.push( [newname, current_layer] ); } svgedit.utilities.walkTree(current_layer, function(e){e.setAttribute("style","pointer-events:inherit");}); current_layer.setAttribute("style","pointer-events:all"); @@ -7084,7 +7080,7 @@ this.cloneLayer = function(name) { // Deletes the current layer from the drawing and then clears the selection. This function // then calls the 'changed' handler. This is an undoable action. this.deleteCurrentLayer = function() { - if (current_layer && all_layers.length > 1) { + if (current_layer && current_doc.all_layers.length > 1) { var batchCmd = new BatchCommand("Delete Layer"); // actually delete from the DOM and store in our Undo History var parent = current_layer.parentNode; @@ -7094,7 +7090,7 @@ this.deleteCurrentLayer = function() { addCommandToHistory(batchCmd); clearSelection(); identifyLayers(); - canvas.setCurrentLayer(all_layers[all_layers.length-1][0]); + canvas.setCurrentLayer(current_doc.all_layers[current_doc.all_layers.length-1][0]); call("changed", [svgcontent]); return true; } @@ -7104,8 +7100,8 @@ this.deleteCurrentLayer = function() { // Function: hasLayer // Check if layer with given name already exists this.hasLayer = function(name) { - for(var i = 0; i < all_layers.length; i++) { - if(all_layers[i][0] == name) return true; + for(var i = 0; i < current_doc.all_layers.length; i++) { + if(current_doc.all_layers[i][0] == name) return true; } return false; }; @@ -7116,7 +7112,7 @@ this.hasLayer = function(name) { // Returns: // The number of layers in the current drawing. this.getNumLayers = function() { - return all_layers.length; + return current_doc.all_layers.length; }; // Function: getLayer @@ -7129,7 +7125,7 @@ this.getNumLayers = function() { // The name of the ith layer this.getLayer = function(i) { if (i >= 0 && i < canvas.getNumLayers()) { - return all_layers[i][0]; + return current_doc.all_layers[i][0]; } return ""; }; @@ -7141,9 +7137,9 @@ this.getLayer = function(i) { // Returns: // The name of the currently active layer. this.getCurrentLayer = function() { - for (var i = 0; i < all_layers.length; ++i) { - if (all_layers[i][1] == current_layer) { - return all_layers[i][0]; + for (var i = 0; i < current_doc.all_layers.length; ++i) { + if (current_doc.all_layers[i][1] == current_layer) { + return current_doc.all_layers[i][0]; } } return ""; @@ -7160,12 +7156,12 @@ this.getCurrentLayer = function() { // true if the current layer was switched, otherwise false this.setCurrentLayer = function(name) { name = svgedit.utilities.toXml(name); - for (var i = 0; i < all_layers.length; ++i) { - if (name == all_layers[i][0]) { - if (current_layer != all_layers[i][1]) { + for (var i = 0; i < current_doc.all_layers.length; ++i) { + if (name == current_doc.all_layers[i][0]) { + if (current_layer != current_doc.all_layers[i][1]) { clearSelection(); current_layer.setAttribute("style", "pointer-events:none"); - current_layer = all_layers[i][1]; + current_layer = current_doc.all_layers[i][1]; current_layer.setAttribute("style", "pointer-events:all"); } return true; @@ -7191,11 +7187,11 @@ this.renameCurrentLayer = function(newname) { 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; + for (var i = 0; i < current_doc.all_layers.length; ++i) { + if (current_doc.all_layers[i][1] == oldLayer) break; } - var oldname = all_layers[i][0]; - all_layers[i][0] = svgedit.utilities.toXml(newname); + var oldname = current_doc.all_layers[i][0]; + current_doc.all_layers[i][0] = svgedit.utilities.toXml(newname); // now change the underlying title element contents var len = oldLayer.childNodes.length; @@ -7231,31 +7227,31 @@ this.renameCurrentLayer = function(newname) { // Returns: // true if the current layer position was changed, false otherwise. this.setCurrentLayerPosition = function(newpos) { - if (current_layer && newpos >= 0 && newpos < all_layers.length) { - for (var oldpos = 0; oldpos < all_layers.length; ++oldpos) { - if (all_layers[oldpos][1] == current_layer) break; + if (current_layer && newpos >= 0 && newpos < current_doc.all_layers.length) { + for (var oldpos = 0; oldpos < current_doc.all_layers.length; ++oldpos) { + if (current_doc.all_layers[oldpos][1] == current_layer) break; } // some unknown error condition (current_layer not in all_layers) - if (oldpos == all_layers.length) { return false; } + if (oldpos == current_doc.all_layers.length) { return false; } if (oldpos != newpos) { // if our new position is below us, we need to insert before the node after newpos var refLayer = null; var oldNextSibling = current_layer.nextSibling; if (newpos > oldpos ) { - if (newpos < all_layers.length-1) { - refLayer = all_layers[newpos+1][1]; + if (newpos < current_doc.all_layers.length-1) { + refLayer = current_doc.all_layers[newpos+1][1]; } } // if our new position is above us, we need to insert before the node at newpos else { - refLayer = all_layers[newpos][1]; + refLayer = current_doc.all_layers[newpos][1]; } svgcontent.insertBefore(current_layer, refLayer); addCommandToHistory(new MoveElementCommand(current_layer, oldNextSibling, svgcontent)); identifyLayers(); - canvas.setCurrentLayer(all_layers[newpos][0]); + canvas.setCurrentLayer(current_doc.all_layers[newpos][0]); return true; } @@ -7276,9 +7272,9 @@ this.setCurrentLayerPosition = function(newpos) { this.getLayerVisibility = function(layername) { // find the layer var layer = null; - for (var i = 0; i < all_layers.length; ++i) { - if (all_layers[i][0] == layername) { - layer = all_layers[i][1]; + for (var i = 0; i < current_doc.all_layers.length; ++i) { + if (current_doc.all_layers[i][0] == layername) { + layer = current_doc.all_layers[i][1]; break; } } @@ -7299,9 +7295,9 @@ this.getLayerVisibility = function(layername) { this.setLayerVisibility = function(layername, bVisible) { // find the layer var layer = null; - for (var i = 0; i < all_layers.length; ++i) { - if (all_layers[i][0] == layername) { - layer = all_layers[i][1]; + for (var i = 0; i < current_doc.all_layers.length; ++i) { + if (current_doc.all_layers[i][0] == layername) { + layer = current_doc.all_layers[i][1]; break; } } @@ -7333,9 +7329,9 @@ this.setLayerVisibility = function(layername, bVisible) { this.moveSelectedToLayer = function(layername) { // find the layer var layer = null; - for (var i = 0; i < all_layers.length; ++i) { - if (all_layers[i][0] == layername) { - layer = all_layers[i][1]; + for (var i = 0; i < current_doc.all_layers.length; ++i) { + if (current_doc.all_layers[i][0] == layername) { + layer = current_doc.all_layers[i][1]; break; } } @@ -7401,7 +7397,7 @@ this.mergeLayer = function(skipHistory) { this.mergeAllLayers = function() { var batchCmd = new BatchCommand("Merge all Layers"); - current_layer = all_layers[all_layers.length-1][1]; + current_layer = current_doc.all_layers[current_doc.all_layers.length-1][1]; while($(svgcontent).children('g').length > 1) { batchCmd.addSubCommand(canvas.mergeLayer(true)); } @@ -7422,9 +7418,9 @@ this.mergeAllLayers = function() { // The opacity value of the given layer. This will be a value between 0.0 and 1.0, or null // if layername is not a valid layer this.getLayerOpacity = function(layername) { - for (var i = 0; i < all_layers.length; ++i) { - if (all_layers[i][0] == layername) { - var g = all_layers[i][1]; + for (var i = 0; i < current_doc.all_layers.length; ++i) { + if (current_doc.all_layers[i][0] == layername) { + var g = current_doc.all_layers[i][1]; var opacity = g.getAttribute("opacity"); if (!opacity) { opacity = "1.0"; @@ -7448,9 +7444,9 @@ this.getLayerOpacity = function(layername) { // opacity - a float value in the range 0.0-1.0 this.setLayerOpacity = function(layername, opacity) { if (opacity < 0.0 || opacity > 1.0) return; - for (var i = 0; i < all_layers.length; ++i) { - if (all_layers[i][0] == layername) { - var g = all_layers[i][1]; + for (var i = 0; i < current_doc.all_layers.length; ++i) { + if (current_doc.all_layers[i][0] == layername) { + var g = current_doc.all_layers[i][1]; g.setAttribute("opacity", opacity); break; } @@ -7526,7 +7522,8 @@ this.clear = function() { } } // create empty first layer - all_layers = []; + current_doc.all_layers = []; + canvas.createLayer("Layer 1"); // clear the undo stack