More work on properly sizing imported SVG.

Still ignores preserveAspectRatio, percentages, units on import <svg>.
Also ignores zoom level of SVG-edit.



git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1423 eee81c28-f429-11dd-99c0-75d572ba1ddd

clipart/moon.svg

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg width="205.5" xmlns="http://www.w3.org/2000/svg" height="255.87">
+<svg width="100" xmlns="http://www.w3.org/2000/svg" height="100" viewBox="0 0 205.5 255.87">
  <g display="inline">
   <title>Layer 1</title>
   <path id="svg_1" d="m10.671,231.42c89.543,56.086,188.11-10.029,193.33-94.559-1.7286-101.53-92.171-150.4-160.16-128.01,35.129,15.844,73.4,62.729,73.871,88.013-3.4428,7.5157-5.8714,16.373,1.5286,18.844-2,12.857-18.486,33.571-21.043,40.643-2.5571,7.0714,2.2143,9.8443,5.4429,10.357,0.2,6.0586-4.4429,8.3572-5.3572,12.156-7.9,3.13-8.4714,9.9872-7.3286,14.844-19.714,18.571-20.571,27.143-80.286,37.714z" stroke="#000" stroke-width="5" fill="#f6c700"/>

editor/svg-editor.js

@@ -1460,7 +1460,6 @@ function svg_edit_setup() {
 		svgCanvas.open();
 	};
 	var clickImport = function(){
-		svgCanvas.import();
 	};
 
 	var clickUndo = function(){

editor/svgcanvas.js

@@ -2164,6 +2164,8 @@ function BatchCommand(text) {
 							start_transform = child.getAttribute("transform");
 							
 							var childTlist = canvas.getTransformList(child);
+							// some children might not have a transform (<metadata>, <defs>, etc)
+							if (childTlist) {
 								var newxlate = svgroot.createSVGTransform();
 								newxlate.setTranslate(tx,ty);
 								childTlist.insertItemBefore(newxlate, 0);
@@ -2171,6 +2173,7 @@ function BatchCommand(text) {
 								start_transform = old_start_transform;
 							}
 						}
+					}
 					start_transform = old_start_transform;
 				}
 			}
@@ -2263,6 +2266,7 @@ function BatchCommand(text) {
 		}
 		// else, it's a non-group
 		else {
+			// FIXME: box might be null for some elements (<metadata> etc), need to handle this
 			var box = canvas.getBBox(selected),
 				oldcenter = {x: box.x+box.width/2, y: box.y+box.height/2},
 				newcenter = transformPoint(box.x+box.width/2, box.y+box.height/2,
@@ -2706,7 +2710,6 @@ function BatchCommand(text) {
 				}
 				tobj.text = "rotate(" + xform.angle + " " + tobj.cx*z + "," + tobj.cy*z + ")";
 				break;
-			// TODO: matrix, skewX, skewY
 		}
 		return tobj;
 	};
@@ -4484,7 +4487,7 @@ function BatchCommand(text) {
 					return;
 				}
 				
-				// TODO: Make sure current_path isn't null at this point
+				// Make sure current_path isn't null at this point
 				if(!current_path) return;
 				
 				current_path_oldd = getD();
@@ -5023,7 +5026,7 @@ function BatchCommand(text) {
 					current_path_pts.splice(pt*2 + 2, 0, abs_x, abs_y);
 					
 					// TODO: This should select the new path points but breaks
-					// when doing several times seleting many nodes
+					// when doing several times selecting many nodes
 					nums.push(pt + i);
 					nums.push(pt + i + 1);
 				}	
@@ -5525,9 +5528,6 @@ function BatchCommand(text) {
 	this.open = function() {
 		// Nothing by default, handled by optional widget/extension
 	};
-	this.import = function() {
-		// Nothing by default, handled by optional widget/extension
-	};
 
 	// Function: save
 	// Serializes the current drawing into SVG XML text and returns it to the 'saved' handler.
@@ -5693,8 +5693,9 @@ function BatchCommand(text) {
 	// Returns:
 	// This function returns false if the import was unsuccessful, true otherwise.
 
+	// TODO: import should happen in top-left of current zoomed viewport	
 	// TODO: create a new layer for the imported SVG
-	// TODO: properly size the new group
+	// TODO: properly re-identify all elements and references in the imported SVG
 	this.importSvgString = function(xmlString) {
 		try {
 			// convert string into XML document
@@ -5708,9 +5709,33 @@ function BatchCommand(text) {
 			var importedNode = svgdoc.importNode(newDoc.documentElement, true);
         
     	    if (current_layer) {
+    	    	// TODO: properly handle if width/height are not specified or if in percentages
+    	    	// TODO: properly handle if width/height are in units (px, etc)
+    	    	var innerw = importedNode.getAttribute("width"),
+    	    		innerh = importedNode.getAttribute("height"),
+    	    		innervb = importedNode.getAttribute("viewBox"),
+    	    		// if no explicit viewbox, create one out of the width and height
+    	    		vb = innervb ? innervb.split(" ") : [0,0,innerw,innerh];
+    	    	for (var j = 0; j < 4; ++j)
+    	    		vb[j] = Number(vb[j]);
+
+    	    	// TODO: properly handle preserveAspectRatio
+    	    	var canvasw = Number(svgcontent.getAttribute("width")),
+    	    		canvash = Number(svgcontent.getAttribute("height"));
+    	    	// imported content should be 1/3 of the canvas on its largest dimension
+    	    	if (innerh > innerw) {
+    	    		var ts = "scale(" + (canvash/3)/vb[3] + ")";
+    	    	}
+    	    	else {
+    	    		var ts = "scale(" + (canvash/3)/vb[2] + ")";
+    	    	}
+
     	    	// add all children of the imported <svg> to the <g> we create
     	    	var g = svgdoc.createElementNS(svgns, "g");
-    	    	while (importedNode.hasChildNodes()) { g.appendChild(importedNode.firstChild); }
+    	    	while (importedNode.hasChildNodes())
+    	    		g.appendChild(importedNode.firstChild);
+    	    	if (ts)
+    	    		g.setAttribute("transform", ts);
     	    	current_layer.appendChild(g);
     	    }
     	    
@@ -5752,42 +5777,10 @@ function BatchCommand(text) {
 			}
 			deepdive(importedNode);
 			
-//			var content = $(svgcontent);
-        	
-//			var attrs = {
-//				id: 'svgcontent',
-//				overflow: 'visible'
-//			};
-			
-			// determine proper size
-//			if (content.attr("viewBox")) {
-//				var vb = content.attr("viewBox").split(' ');
-//				attrs.width = vb[2];
-//				attrs.height = vb[3];
-//			}
-//			// handle content that doesn't have a viewBox
-//			else {
-//				$.each(['width', 'height'], function(i, dim) {
-//					// Set to 100 if not given
-//					var val = content.attr(dim) || 100;
-//
-//					if((val+'').substr(-1) === "%") {
-//						// Use user units if percentage given
-//						attrs[dim] = parseInt(val);
-//					} else {
-//						attrs[dim] = convertToNum(dim, val);
-//					}
-//				});
-//			}
-			
-//			content.attr(attrs);
 			batchCmd.addSubCommand(new InsertElementCommand(svgcontent));
-			// update root to the correct size
-//			var changes = content.attr(["width", "height"]);
-//			batchCmd.addSubCommand(new ChangeElementCommand(svgroot, changes));
 
-			// reset zoom
+			// reset zoom - TODO: why?
-			current_zoom = 1;
+//			current_zoom = 1;
 			
 			// identify layers
 //			identifyLayers();