Export and import SVGs with multiline text

src/svg/SvgExport.js

@@ -253,9 +253,20 @@ new function() {
     }
 
     function exportText(item) {
-        var node = SvgElement.create('text', getTransform(item._matrix, true),
+        // Scratch-specific: do not use x/y attributes for text elements
+        // because they break <tspan> mutliline formatting (below)
+        var node = SvgElement.create('text', getTransform(item._matrix, false),
                 formatter);
-        node.textContent = item._content;
+        for (var i = 0; i < item._lines.length; i++) {
+            // Scratch-specific: Use <tspan> for multiline text,
+            // right now only supports left justified (x=0)
+            var tspanNode = SvgElement.create('tspan', {
+                x: '0',
+                dy: i === 0 ? '0' : item._style.getLeading() + 'px'
+            }, formatter);
+            tspanNode.textContent = item._lines[i];
+            node.appendChild(tspanNode);
+        }
         return node;
     }
 

src/svg/SvgImport.js

@@ -300,10 +300,27 @@ new function() {
             // TODO: Support for these is missing in Paper.js right now
             // rotate: character rotation
             // lengthAdjust:
-            var text = new PointText(getPoint(node).add(
+
-                    getPoint(node, 'dx', 'dy')));
+            // Scratch-specific: Do not use x/y attributes because they break multiline usage.
-            text.setContent(node.textContent.trim() || '');
+            if (node.childElementCount === 0) {
-            return text;
+                var text = new PointText();
+                text.setContent(node.textContent.trim() || '');
+                // Scratch-specific: Scratch2 SVGs are offset by 1 leading vertically.
+                // Scratch3 SVGs use <tspan> method for all text (below)
+                text.translate(0, text._style.getLeading());
+                return text;
+            } else {
+                // Scratch3 SVGs always use <tspan>'s for multiline string support.
+                // Does not support x/y attribute or tspan positioning beyond left justified.
+                var lines = [];
+                for (var i = 0; i < node.children.length; i++) {
+                    var child = node.children[i];
+                    lines.push(child.textContent);
+                }
+                var text = new PointText();
+                text.setContent(lines.join('\n') || '');
+                return text;
+            }
         }
     };