fix the export/import function and enhance it

2 files changed, 133 insertions, 45 deletions

diff --git a/dist/svg.js b/dist/svg.js
index e1dfbef..5e1d68d 100644
--- a/dist/svg.js
+++ b/dist/svg.js
@@ -6,7 +6,7 @@
 * @copyright Wout Fierens <wout@mick-wout.com>
 * @license MIT
 *
-* BUILT: Wed Nov 07 2018 15:06:40 GMT+0100 (GMT+01:00)
+* BUILT: Wed Nov 07 2018 16:59:53 GMT+0100 (GMT+01:00)
 */;
 var SVG = (function () {
   'use strict';
@@ -1433,14 +1433,14 @@ var SVG = (function () {
     _inherits(Dom, _EventTarget);
 
     function Dom(node) {
-      var _this;
+      var _this2;
 
       _classCallCheck(this, Dom);
 
-      _this = _possibleConstructorReturn(this, _getPrototypeOf(Dom).call(this, node));
-      _this.node = node;
-      _this.type = node.nodeName;
-      return _this;
+      _this2 = _possibleConstructorReturn(this, _getPrototypeOf(Dom).call(this, node));
+      _this2.node = node;
+      _this2.type = node.nodeName;
+      return _this2;
     } // Add given element at a position
 
 
@@ -1624,13 +1624,13 @@ var SVG = (function () {
       value: function removeElement(element) {
         this.node.removeChild(element.node);
         return this;
-      } // Replace element
+      } // Replace this with element
 
     }, {
       key: "replace",
       value: function replace(element) {
-        // FIXME: after() might not be available here
-        this.after(element).remove();
+        element = makeInstance(element);
+        this.node.parentNode.replaceChild(element.node, this.node);
         return element;
       } // Return id on string conversion
 
@@ -1642,26 +1642,66 @@ var SVG = (function () {
 
     }, {
       key: "svg",
-      value: function svg(_svg) {
-        var well, len; // act as a setter if svg is given
+      value: function svg(svgOrFn, outerHTML) {
+        var well, len, fragment;
 
-        if (_svg) {
-          // create temporary holder
-          well = document.createElementNS(ns, 'svg'); // dump raw svg
+        if (svgOrFn === false) {
+          outerHTML = false;
+          svgOrFn = null;
+        } // act as getter if no svg string is given
 
-          well.innerHTML = _svg; // transplant nodes
 
-          for (len = well.children.length; len--;) {
-            this.node.appendChild(well.firstElementChild);
-          } // otherwise act as a getter
+        if (svgOrFn == null || typeof svgOrFn === 'function') {
+          // The default for exports is, that the outerNode is included
+          outerHTML = outerHTML == null ? true : outerHTML; // write svgjs data to the dom
 
-        } else {
-          // write svgjs data to the dom
           this.writeDataToDom();
-          return this.node.outerHTML;
-        }
+          var current = this; // An export modifier was passed
 
-        return this;
+          if (svgOrFn != null) {
+            current = adopt(current.node.cloneNode(true)); // If the user wants outerHTML we need to process this node, too
+
+            if (outerHTML) {
+              var result = svgOrFn(current);
+              current = result || current; // The user does not want this node? Well, then he gets nothing
+
+              if (result === false) return '';
+            } // Deep loop through all children and apply modifier
+
+
+            current.each(function () {
+              var result = svgOrFn(this);
+
+              var _this = result || this; // If modifier returns false, discard node
+
+
+              if (result === false) {
+                this.remove(); // If modifier returns new node, use it
+              } else if (result && this !== _this) {
+                this.replace(_this);
+              }
+            }, true);
+          } // Return outer or inner content
+
+
+          return outerHTML ? current.node.outerHTML : current.node.innerHTML;
+        } // Act as setter if we got a string
+        // The default for import is, that the current node is not replaced
+
+
+        outerHTML = outerHTML == null ? false : outerHTML; // Create temporary holder
+
+        well = document.createElementNS(ns, 'svg');
+        fragment = document.createDocumentFragment(); // Dump raw svg
+
+        well.innerHTML = svgOrFn; // Transplant nodes into the fragment
+
+        for (len = well.children.length; len--;) {
+          fragment.appendChild(well.firstElementChild);
+        } // Add the whole fragment at once
+
+
+        return outerHTML ? this.replace(fragment) : this.add(fragment);
       } // write svgjs data to the dom
 
     }, {
diff --git a/src/elements/Dom.js b/src/elements/Dom.js
index eab3f0d..16aefd8 100644
--- a/src/elements/Dom.js
+++ b/src/elements/Dom.js
@@ -188,11 +188,10 @@ export default class Dom extends EventTarget {
     return this
   }
 
-  // Replace element
+  // Replace this with element
   replace (element) {
-    // FIXME: after() might not be available here
-    this.after(element).remove()
-
+    element = makeInstance(element)
+    this.node.parentNode.replaceChild(element.node, this.node)
     return element
   }
 
@@ -202,30 +201,79 @@ export default class Dom extends EventTarget {
   }
 
   // Import raw svg
-  svg (svg) {
-    var well, len
-
-    // act as a setter if svg is given
-    if (svg) {
-      // create temporary holder
-      well = document.createElementNS(ns, 'svg')
-      // dump raw svg
-      well.innerHTML = svg
-
-      // transplant nodes
-      for (len = well.children.length; len--;) {
-        this.node.appendChild(well.firstElementChild)
-      }
+  svg (svgOrFn, outerHTML) {
+    var well, len, fragment
+
+    if (svgOrFn === false) {
+      outerHTML = false
+      svgOrFn = null
+    }
+
+    // act as getter if no svg string is given
+    if (svgOrFn == null || typeof svgOrFn === 'function') {
+      // The default for exports is, that the outerNode is included
+      outerHTML = outerHTML == null ? true : outerHTML
 
-    // otherwise act as a getter
-    } else {
       // write svgjs data to the dom
       this.writeDataToDom()
+      let current = this
+
+      // An export modifier was passed
+      if (svgOrFn != null) {
+        current = adopt(current.node.cloneNode(true))
+
+        // If the user wants outerHTML we need to process this node, too
+        if (outerHTML) {
+          let result = svgOrFn(current)
+          current = result || current
+
+          // The user does not want this node? Well, then he gets nothing
+          if (result === false) return ''
+        }
+
+        // Deep loop through all children and apply modifier
+        current.each(function () {
+          let result = svgOrFn(this)
+          let _this = result || this
+
+          // If modifier returns false, discard node
+          if (result === false) {
+            this.remove()
+
+          // If modifier returns new node, use it
+          } else if (result && this !== _this) {
+            this.replace(_this)
+          }
+        }, true)
+      }
 
-      return this.node.outerHTML
+      // Return outer or inner content
+      return outerHTML
+        ? current.node.outerHTML
+        : current.node.innerHTML
     }
 
-    return this
+    // Act as setter if we got a string
+
+    // The default for import is, that the current node is not replaced
+    outerHTML = outerHTML == null ? false : outerHTML
+
+    // Create temporary holder
+    well = document.createElementNS(ns, 'svg')
+    fragment = document.createDocumentFragment()
+
+    // Dump raw svg
+    well.innerHTML = svgOrFn
+
+    // Transplant nodes into the fragment
+    for (len = well.children.length; len--;) {
+      fragment.appendChild(well.firstElementChild)
+    }
+
+    // Add the whole fragment at once
+    return outerHTML
+      ? this.replace(fragment)
+      : this.add(fragment)
   }
 
   // write svgjs data to the dom