loading an image now updates canvas properties

editor/sanitize.js

@@ -58,7 +58,7 @@ var svgWhiteList_ = {
 	"foreignObject": ["class", "font-size", "height", "id", "opacity", "requiredFeatures", "style", "transform", "width", "x", "y"],
 	"g": ["class", "clip-path", "clip-rule", "id", "display", "fill", "fill-opacity", "fill-rule", "filter", "mask", "opacity", "requiredFeatures", "stroke", "stroke-dasharray", "stroke-dashoffset", "stroke-linecap", "stroke-linejoin", "stroke-miterlimit", "stroke-opacity", "stroke-width", "style", "systemLanguage", "transform", "font-family", "font-size", "font-style", "font-weight", "text-anchor"],
 	"image": ["class", "clip-path", "clip-rule", "filter", "height", "id", "mask", "opacity", "requiredFeatures", "style", "systemLanguage", "transform", "width", "x", "xlink:href", "xlink:title", "y"],
-	"line": ["class", "clip-path", "clip-rule", "fill", "fill-opacity", "fill-rule", "filter", "id", "marker-end", "marker-mid", "marker-start", "mask", "opacity", "requiredFeatures", "stroke", "stroke-dasharray", "stroke-dashoffset", "stroke-linecap", "stroke-linejoin", "stroke-miterlimit", "stroke-opacity", "stroke-width", "style", "systemLanguage", "transform", "x1", "x2", "y1", "y2"],
+	"line": ["shape-rendering", "class", "clip-path", "clip-rule", "fill", "fill-opacity", "fill-rule", "filter", "id", "marker-end", "marker-mid", "marker-start", "mask", "opacity", "requiredFeatures", "stroke", "stroke-dasharray", "stroke-dashoffset", "stroke-linecap", "stroke-linejoin", "stroke-miterlimit", "stroke-opacity", "stroke-width", "style", "systemLanguage", "transform", "x1", "x2", "y1", "y2"],
 	"linearGradient": ["class", "id", "gradientTransform", "gradientUnits", "requiredFeatures", "spreadMethod", "systemLanguage", "x1", "x2", "xlink:href", "y1", "y2"],
 	"marker": ["id", "class", "markerHeight", "markerUnits", "markerWidth", "orient", "preserveAspectRatio", "refX", "refY", "systemLanguage", "viewBox"],
 	"mask": ["class", "height", "id", "maskContentUnits", "maskUnits", "width", "x", "y"],
@@ -68,7 +68,7 @@ var svgWhiteList_ = {
 	"polygon": ["class", "clip-path", "clip-rule", "id", "fill", "fill-opacity", "fill-rule", "filter", "id", "class", "marker-end", "marker-mid", "marker-start", "mask", "opacity", "points", "requiredFeatures", "stroke", "stroke-dasharray", "stroke-dashoffset", "stroke-linecap", "stroke-linejoin", "stroke-miterlimit", "stroke-opacity", "stroke-width", "style", "systemLanguage", "transform"],
 	"polyline": ["class", "clip-path", "clip-rule", "id", "fill", "fill-opacity", "fill-rule", "filter", "marker-end", "marker-mid", "marker-start", "mask", "opacity", "points", "requiredFeatures", "stroke", "stroke-dasharray", "stroke-dashoffset", "stroke-linecap", "stroke-linejoin", "stroke-miterlimit", "stroke-opacity", "stroke-width", "style", "systemLanguage", "transform"],
 	"radialGradient": ["class", "cx", "cy", "fx", "fy", "gradientTransform", "gradientUnits", "id", "r", "requiredFeatures", "spreadMethod", "systemLanguage", "xlink:href"],
-	"rect": ["class", "clip-path", "clip-rule", "fill", "fill-opacity", "fill-rule", "filter", "height", "id", "mask", "opacity", "requiredFeatures", "rx", "ry", "stroke", "stroke-dasharray", "stroke-dashoffset", "stroke-linecap", "stroke-linejoin", "stroke-miterlimit", "stroke-opacity", "stroke-width", "style", "systemLanguage", "transform", "width", "x", "y"],
+	"rect": ["shape-rendering", "class", "clip-path", "clip-rule", "fill", "fill-opacity", "fill-rule", "filter", "height", "id", "mask", "opacity", "requiredFeatures", "rx", "ry", "stroke", "stroke-dasharray", "stroke-dashoffset", "stroke-linecap", "stroke-linejoin", "stroke-miterlimit", "stroke-opacity", "stroke-width", "style", "systemLanguage", "transform", "width", "x", "y"],
 	"stop": ["class", "id", "offset", "requiredFeatures", "stop-color", "stop-opacity", "style", "systemLanguage"],
 	"svg": ["class", "clip-path", "clip-rule", "filter", "id", "height", "mask", "preserveAspectRatio", "requiredFeatures", "style", "systemLanguage", "viewBox", "width", "x", "xmlns", "xmlns:se", "xmlns:xlink", "y"],
 	"switch": ["class", "id", "requiredFeatures", "systemLanguage"],

editor/svgcanvas.js

@@ -5920,11 +5920,9 @@ this.setSvgString = function(xmlString) {
 			}
 		});
 		
-		// For Firefox: Put all paint elems in defs
+		// Put all paint elems in defs
-		if(svgedit.browser.isGecko()) {
-			content.find('linearGradient, radialGradient, pattern').appendTo(findDefs());
-		}
 		
+		content.find('linearGradient, radialGradient, pattern').appendTo(findDefs());
 		
 		// Set ref element for <use> elements
 		
@@ -5984,13 +5982,27 @@ this.setSvgString = function(xmlString) {
 		
 		// Just in case negative numbers are given or 
 		// result from the percs calculation
-		if(attrs.width <= 0) attrs.width = 100;
+		if(attrs.width <= 0) attrs.width = 200;
-		if(attrs.height <= 0) attrs.height = 100;
+		if(attrs.height <= 0) attrs.height = 200;
 		
 		content.attr(attrs);
 		this.contentW = attrs['width'];
 		this.contentH = attrs['height'];
 		
+		$("#canvas_width").val(this.contentW)
+		$("#canvas_height").val(this.contentH)
+		var background = $("#canvas_background")
+		if (background.length) {
+			var opacity = background.attr("fill-opacity")
+			opacity = opacity ? parseInt(opacity)*100 : 100
+			fill = this.getPaint(background.attr("fill"), opacity, "canvas")
+			svgEditor.paintBox.canvas.setPaint(fill)
+		}
+		else {
+			fill = this.getPaint("none", 100, "canvas")
+			svgEditor.paintBox.canvas.setPaint(fill)
+		}
+
 		batchCmd.addSubCommand(new InsertElementCommand(svgcontent));
 		// update root to the correct size
 		var changes = content.attr(["width", "height"]);
@@ -6015,6 +6027,36 @@ this.setSvgString = function(xmlString) {
 	return true;
 };
 
+
+this.getPaint = function(color, opac, type) {
+	// update the editor's fill paint
+	var opts = null;
+	if (color.indexOf("url(#") === 0) {
+		var refElem = svgCanvas.getRefElem(color);
+		if(refElem) {
+			refElem = refElem.cloneNode(true);
+		} else {
+			refElem =  $("#" + type + "_color defs *")[0];
+		}
+
+		opts = { alpha: opac };
+		opts[refElem.tagName] = refElem;
+	} 
+	else if (color.indexOf("#") === 0) {
+		opts = {
+			alpha: opac,
+			solidColor: color.substr(1)
+		};
+	}
+	else {
+		opts = {
+			alpha: opac,
+			solidColor: 'none'
+		};
+	}
+	return new $.jGraduate.Paint(opts);
+};
+
 // Function: importSvgString
 // This function imports the input SVG XML as a <symbol> in the <defs>, then adds a
 // <use> to the current layer.