add svg support

kbrsh · Mar 18, 2017 · b827abd · b827abd
1 parent a3603b7
commit b827abd
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 11 deletions.
diff --git a/dist/moon.js b/dist/moon.js
@@ -356,7 +356,7 @@
         // Create textnode
         el = document.createTextNode(vnode.val);
       } else {
-        el = document.createElement(vnode.type);
+        el = vnode.meta.isSVG ? document.createElementNS('http://www.w3.org/2000/svg', vnode.type) : document.createElement(vnode.type);
         // Optimization: VNode only has one child that is text, and create it here
         if (vnode.children.length === 1 && vnode.children[0].type === "#text") {
           el.textContent = vnode.children[0].val;
@@ -416,18 +416,21 @@
       // Get object of all properties being compared
       var allProps = merge(nodeProps, vnodeProps);
 
+      // If node is svg, update with SVG namespace
+      var isSVG = node instanceof SVGElement;
+
       for (var propName in allProps) {
         // If not in VNode or is a Directive, remove it
         if (!vnodeProps[propName] || directives[propName]) {
           // If it is a directive, run the directive
           if (directives[propName]) {
             directives[propName](node, allProps[propName], vnode);
           }
-          node.removeAttribute(propName);
+          isSVG ? node.removeAttributeNS(null, propName) : node.removeAttribute(propName);
           delete node.__moon__props__[propName];
         } else if (!nodeProps[propName] || nodeProps[propName] !== vnodeProps[propName]) {
           // It has changed or is not in the node in the first place
-          node.setAttribute(propName, vnodeProps[propName]);
+          isSVG ? node.setAttributeNS(null, propName, vnodeProps[propName]) : node.setAttribute(propName, vnodeProps[propName]);
           node.__moon__props__[propName] = vnodeProps[propName];
         }
       }
@@ -457,8 +460,6 @@
         nodeName = node.__moon__nodeName__ || node.nodeName.toLowerCase();
       }
 
-      var isSVG = node instanceof SVGElement || vnode.meta.isSVG;
-
       if (!node && vnode) {
         // No Node, create a node
         var newNode = createNodeFromVNode(vnode, instance);