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

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
master
Jeff Schiller 2011-01-16 16:28:26 +00:00
parent cc5a01d469
commit c21b9be33c
5 changed files with 77 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
editor/document.js
View File

@ -34,6 +34,25 @@ if (!svgedit.document) {
var svg_ns = "http://www.w3.org/2000/svg"; var svg_ns = "http://www.w3.org/2000/svg";
var se_ns = "http://svg-edit.googlecode.com"; 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. * 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.idPrefix = opt_idPrefix || "svg_";
this.releasedNums = []; this.releasedNums = [];
// z-ordered array of tuples containing layer names and <g> elements
// the first layer is the one at the bottom of the rendering
this.all_layers = [];
// Determine if the <svg> element has a nonce on it // Determine if the <svg> element has a nonce on it
this.nonce_ = this.svgElem_.getAttributeNS(se_ns, 'nonce') || ""; this.nonce_ = this.svgElem_.getAttributeNS(se_ns, 'nonce') || "";
}; };

3
editor/locale/locale.js
View File

@ -49,6 +49,7 @@ var svgEditor = (function($, Editor) {
Editor.readLang = function(langData) { Editor.readLang = function(langData) {
debugger;
var more = Editor.canvas.runExtensions("addlangData", lang_param, true); var more = Editor.canvas.runExtensions("addlangData", lang_param, true);
$.each(more, function(i, m) { $.each(more, function(i, m) {
if(m.data) { if(m.data) {
@ -67,6 +68,8 @@ var svgEditor = (function($, Editor) {
common = langData.common, common = langData.common,
ui = langData.ui; ui = langData.ui;
Editor.uiStrings['layers'] = layers;
setStrings('content', { setStrings('content', {
copyrightLabel: misc.powered_by, copyrightLabel: misc.powered_by,
curve_segments: properties.curve_segments, curve_segments: properties.curve_segments,

2
editor/svg-editor.css
View File

@ -257,7 +257,7 @@
padding: 0px; padding: 0px;
padding-left: 2px; padding-left: 2px;
padding-right: 2px; padding-right: 2px;
width: 123px; width: 125px;
height: 20px; height: 20px;
border-right: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF;
border-bottom: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF;

1
editor/svg-editor.js
View File

@ -3536,6 +3536,7 @@
$('#layer_new').click(function() { $('#layer_new').click(function() {
var i = svgCanvas.getNumLayers(); var i = svgCanvas.getNumLayers();
do { do {
debugger;
var uniqName = uiStrings.layers.layer + " " + ++i; var uniqName = uiStrings.layers.layer + " " + ++i;
} while(svgCanvas.hasLayer(uniqName)); } while(svgCanvas.hasLayer(uniqName));

99
editor/svgcanvas.js
View File

@ -539,12 +539,8 @@ var restoreRefElems = function(elem) {
})(); })();
// z-ordered array of tuples containing layer names and <g> 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 // Object to contain image data for raster images that were found encodable
encodableImages = {}, var encodableImages = {},
// String with image URL of last loadable image // String with image URL of last loadable image
last_good_img_url = curConfig.imgPath + 'logo.png', last_good_img_url = curConfig.imgPath + 'logo.png',
@ -6422,7 +6418,7 @@ var uniquifyElems = this.uniquifyElems = function(g) {
}); });
// check xlink:href now // check xlink:href now
var href = getHref(n); var href = svgedit.utilities.getHref(n);
// TODO: what if an <image> or <a> element refers to an element internally? // TODO: what if an <image> or <a> element refers to an element internally?
if(href && ref_elems.indexOf(n.nodeName) >= 0) if(href && ref_elems.indexOf(n.nodeName) >= 0)
{ {
@ -6969,7 +6965,7 @@ this.importSvgString = function(xmlString) {
// Function: identifyLayers // Function: identifyLayers
// Updates layer system // Updates layer system
var identifyLayers = canvas.identifyLayers = function() { var identifyLayers = canvas.identifyLayers = function() {
all_layers = []; current_doc.all_layers = [];
leaveContext(); leaveContext();
var numchildren = svgcontent.childNodes.length; var numchildren = svgcontent.childNodes.length;
// loop through all children of svgcontent // loop through all children of svgcontent
@ -6991,7 +6987,7 @@ var identifyLayers = canvas.identifyLayers = function() {
// store layer and name in global variable // store layer and name in global variable
if (name) { if (name) {
layernames.push(name); layernames.push(name);
all_layers.push( [name,child] ); current_doc.all_layers.push( [name,child] );
current_layer = child; current_layer = child;
svgedit.utilities.walkTree(child, function(e){e.setAttribute("style", "pointer-events:inherit");}); svgedit.utilities.walkTree(child, function(e){e.setAttribute("style", "pointer-events:inherit");});
current_layer.setAttribute("style", "pointer-events:none"); current_layer.setAttribute("style", "pointer-events:none");
@ -7022,7 +7018,7 @@ var identifyLayers = canvas.identifyLayers = function() {
current_layer.appendChild(orphans[j]); current_layer.appendChild(orphans[j]);
} }
current_layer = svgcontent.appendChild(current_layer); 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");}); svgedit.utilities.walkTree(current_layer, function(e){e.setAttribute("style","pointer-events:inherit");});
current_layer.setAttribute("style","pointer-events:all"); 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 // Deletes the current layer from the drawing and then clears the selection. This function
// then calls the 'changed' handler. This is an undoable action. // then calls the 'changed' handler. This is an undoable action.
this.deleteCurrentLayer = function() { 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"); var batchCmd = new BatchCommand("Delete Layer");
// actually delete from the DOM and store in our Undo History // actually delete from the DOM and store in our Undo History
var parent = current_layer.parentNode; var parent = current_layer.parentNode;
@ -7094,7 +7090,7 @@ this.deleteCurrentLayer = function() {
addCommandToHistory(batchCmd); addCommandToHistory(batchCmd);
clearSelection(); clearSelection();
identifyLayers(); 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]); call("changed", [svgcontent]);
return true; return true;
} }
@ -7104,8 +7100,8 @@ this.deleteCurrentLayer = function() {
// Function: hasLayer // Function: hasLayer
// Check if layer with given name already exists // Check if layer with given name already exists
this.hasLayer = function(name) { this.hasLayer = function(name) {
for(var i = 0; i < all_layers.length; i++) { for(var i = 0; i < current_doc.all_layers.length; i++) {
if(all_layers[i][0] == name) return true; if(current_doc.all_layers[i][0] == name) return true;
} }
return false; return false;
}; };
@ -7116,7 +7112,7 @@ this.hasLayer = function(name) {
// Returns: // Returns:
// The number of layers in the current drawing. // The number of layers in the current drawing.
this.getNumLayers = function() { this.getNumLayers = function() {
return all_layers.length; return current_doc.all_layers.length;
}; };
// Function: getLayer // Function: getLayer
@ -7129,7 +7125,7 @@ this.getNumLayers = function() {
// The name of the ith layer // The name of the ith layer
this.getLayer = function(i) { this.getLayer = function(i) {
if (i >= 0 && i < canvas.getNumLayers()) { if (i >= 0 && i < canvas.getNumLayers()) {
return all_layers[i][0]; return current_doc.all_layers[i][0];
} }
return ""; return "";
}; };
@ -7141,9 +7137,9 @@ this.getLayer = function(i) {
// Returns: // Returns:
// The name of the currently active layer. // The name of the currently active layer.
this.getCurrentLayer = function() { this.getCurrentLayer = function() {
for (var i = 0; i < all_layers.length; ++i) { for (var i = 0; i < current_doc.all_layers.length; ++i) {
if (all_layers[i][1] == current_layer) { if (current_doc.all_layers[i][1] == current_layer) {
return all_layers[i][0]; return current_doc.all_layers[i][0];
} }
} }
return ""; return "";
@ -7160,12 +7156,12 @@ this.getCurrentLayer = function() {
// true if the current layer was switched, otherwise false // true if the current layer was switched, otherwise false
this.setCurrentLayer = function(name) { this.setCurrentLayer = function(name) {
name = svgedit.utilities.toXml(name); name = svgedit.utilities.toXml(name);
for (var i = 0; i < all_layers.length; ++i) { for (var i = 0; i < current_doc.all_layers.length; ++i) {
if (name == all_layers[i][0]) { if (name == current_doc.all_layers[i][0]) {
if (current_layer != all_layers[i][1]) { if (current_layer != current_doc.all_layers[i][1]) {
clearSelection(); clearSelection();
current_layer.setAttribute("style", "pointer-events:none"); 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"); current_layer.setAttribute("style", "pointer-events:all");
} }
return true; return true;
@ -7191,11 +7187,11 @@ this.renameCurrentLayer = function(newname) {
if (!canvas.setCurrentLayer(newname)) { if (!canvas.setCurrentLayer(newname)) {
var batchCmd = new BatchCommand("Rename Layer"); var batchCmd = new BatchCommand("Rename Layer");
// find the index of the layer // find the index of the layer
for (var i = 0; i < all_layers.length; ++i) { for (var i = 0; i < current_doc.all_layers.length; ++i) {
if (all_layers[i][1] == oldLayer) break; if (current_doc.all_layers[i][1] == oldLayer) break;
} }
var oldname = all_layers[i][0]; var oldname = current_doc.all_layers[i][0];
all_layers[i][0] = svgedit.utilities.toXml(newname); current_doc.all_layers[i][0] = svgedit.utilities.toXml(newname);
// now change the underlying title element contents // now change the underlying title element contents
var len = oldLayer.childNodes.length; var len = oldLayer.childNodes.length;
@ -7231,31 +7227,31 @@ this.renameCurrentLayer = function(newname) {
// Returns: // Returns:
// true if the current layer position was changed, false otherwise. // true if the current layer position was changed, false otherwise.
this.setCurrentLayerPosition = function(newpos) { this.setCurrentLayerPosition = function(newpos) {
if (current_layer && newpos >= 0 && newpos < all_layers.length) { if (current_layer && newpos >= 0 && newpos < current_doc.all_layers.length) {
for (var oldpos = 0; oldpos < all_layers.length; ++oldpos) { for (var oldpos = 0; oldpos < current_doc.all_layers.length; ++oldpos) {
if (all_layers[oldpos][1] == current_layer) break; if (current_doc.all_layers[oldpos][1] == current_layer) break;
} }
// some unknown error condition (current_layer not in all_layers) // 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 (oldpos != newpos) {
// if our new position is below us, we need to insert before the node after newpos // if our new position is below us, we need to insert before the node after newpos
var refLayer = null; var refLayer = null;
var oldNextSibling = current_layer.nextSibling; var oldNextSibling = current_layer.nextSibling;
if (newpos > oldpos ) { if (newpos > oldpos ) {
if (newpos < all_layers.length-1) { if (newpos < current_doc.all_layers.length-1) {
refLayer = all_layers[newpos+1][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 // if our new position is above us, we need to insert before the node at newpos
else { else {
refLayer = all_layers[newpos][1]; refLayer = current_doc.all_layers[newpos][1];
} }
svgcontent.insertBefore(current_layer, refLayer); svgcontent.insertBefore(current_layer, refLayer);
addCommandToHistory(new MoveElementCommand(current_layer, oldNextSibling, svgcontent)); addCommandToHistory(new MoveElementCommand(current_layer, oldNextSibling, svgcontent));
identifyLayers(); identifyLayers();
canvas.setCurrentLayer(all_layers[newpos][0]); canvas.setCurrentLayer(current_doc.all_layers[newpos][0]);
return true; return true;
} }
@ -7276,9 +7272,9 @@ this.setCurrentLayerPosition = function(newpos) {
this.getLayerVisibility = function(layername) { this.getLayerVisibility = function(layername) {
// find the layer // find the layer
var layer = null; var layer = null;
for (var i = 0; i < all_layers.length; ++i) { for (var i = 0; i < current_doc.all_layers.length; ++i) {
if (all_layers[i][0] == layername) { if (current_doc.all_layers[i][0] == layername) {
layer = all_layers[i][1]; layer = current_doc.all_layers[i][1];
break; break;
} }
} }
@ -7299,9 +7295,9 @@ this.getLayerVisibility = function(layername) {
this.setLayerVisibility = function(layername, bVisible) { this.setLayerVisibility = function(layername, bVisible) {
// find the layer // find the layer
var layer = null; var layer = null;
for (var i = 0; i < all_layers.length; ++i) { for (var i = 0; i < current_doc.all_layers.length; ++i) {
if (all_layers[i][0] == layername) { if (current_doc.all_layers[i][0] == layername) {
layer = all_layers[i][1]; layer = current_doc.all_layers[i][1];
break; break;
} }
} }
@ -7333,9 +7329,9 @@ this.setLayerVisibility = function(layername, bVisible) {
this.moveSelectedToLayer = function(layername) { this.moveSelectedToLayer = function(layername) {
// find the layer // find the layer
var layer = null; var layer = null;
for (var i = 0; i < all_layers.length; ++i) { for (var i = 0; i < current_doc.all_layers.length; ++i) {
if (all_layers[i][0] == layername) { if (current_doc.all_layers[i][0] == layername) {
layer = all_layers[i][1]; layer = current_doc.all_layers[i][1];
break; break;
} }
} }
@ -7401,7 +7397,7 @@ this.mergeLayer = function(skipHistory) {
this.mergeAllLayers = function() { this.mergeAllLayers = function() {
var batchCmd = new BatchCommand("Merge all Layers"); 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) { while($(svgcontent).children('g').length > 1) {
batchCmd.addSubCommand(canvas.mergeLayer(true)); 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 // 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 // if layername is not a valid layer
this.getLayerOpacity = function(layername) { this.getLayerOpacity = function(layername) {
for (var i = 0; i < all_layers.length; ++i) { for (var i = 0; i < current_doc.all_layers.length; ++i) {
if (all_layers[i][0] == layername) { if (current_doc.all_layers[i][0] == layername) {
var g = all_layers[i][1]; var g = current_doc.all_layers[i][1];
var opacity = g.getAttribute("opacity"); var opacity = g.getAttribute("opacity");
if (!opacity) { if (!opacity) {
opacity = "1.0"; opacity = "1.0";
@ -7448,9 +7444,9 @@ this.getLayerOpacity = function(layername) {
// opacity - a float value in the range 0.0-1.0 // opacity - a float value in the range 0.0-1.0
this.setLayerOpacity = function(layername, opacity) { this.setLayerOpacity = function(layername, opacity) {
if (opacity < 0.0 || opacity > 1.0) return; if (opacity < 0.0 || opacity > 1.0) return;
for (var i = 0; i < all_layers.length; ++i) { for (var i = 0; i < current_doc.all_layers.length; ++i) {
if (all_layers[i][0] == layername) { if (current_doc.all_layers[i][0] == layername) {
var g = all_layers[i][1]; var g = current_doc.all_layers[i][1];
g.setAttribute("opacity", opacity); g.setAttribute("opacity", opacity);
break; break;
} }
@ -7526,7 +7522,8 @@ this.clear = function() {
} }
} }
// create empty first layer // create empty first layer
all_layers = []; current_doc.all_layers = [];
canvas.createLayer("Layer 1"); canvas.createLayer("Layer 1");
// clear the undo stack // clear the undo stack