Adding viewBox attribute. This fixes #30

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 1.1.1
+
+- Calling `remove` on a group with a shape that is not in the group will not remove another shape in the group.
+
 ## 1.1.0
 
 - Fixed a giant bug with re-rendering of children if they were removed/added to a group.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "rune.js",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "A JavaScript library for programming graphic design systems with SVG",
   "repository": {
     "type": "git",

src/mixins/parent.js

@@ -18,9 +18,19 @@ var Parent = {
   },
 
   removeChild: function(child) {
+
+    if(child.parent !== this) {
+      return;
+    }
+
+    // check if it is in this parent
     this.renderedChildren.splice(child.childId, 1);
     this.children.splice(child.childId, 1);
-    this.changedChildren = without(this.changedChildren, child.childId);
+
+    var childIndex = this.changedChildren.indexOf(child.childId);
+    if(childIndex !== -1) {
+      this.changedChildren.splice(childIndex, 1);
+    }
 
     // Lower id's of all children above by one
     for(var i = child.childId; i < this.children.length; i++) {

src/rune.js

@@ -53,10 +53,14 @@ var Rune = function(options) {
     this.height = params.height;
   }
 
+  if(attrs.width && attrs.height) {
+    attrs.viewBox = '0 0 ' + attrs.width + ' ' + attrs.height;
+  }
+
   var props = {
-      attributes: attrs
+    attributes: attrs
   }
-  
+
   this.tree = svg('svg', props);
   this.el = createElement(this.tree);
   this.stage = new Group();
@@ -256,7 +260,7 @@ Rune.prototype = {
     var props = {
        attributes: attrs
     }
-    
+
     var newTree = svg('svg', props, [this.stage.renderChildren({ debug: this.debug })]);
     var diffTree = diff(this.tree, newTree);
     this.el = patch(this.el, diffTree);

test/both/group.js

@@ -47,6 +47,16 @@ describe("Rune.Group", function() {
       expect(s).not.toBeChildOf(g);
     });
 
+    it("does not remove child that is not in the group", function() {
+      var g = new Rune.Group();
+      var s1 = new Rune.Ellipse();
+      var s2 = new Rune.Rectangle();
+      g.add(s1);
+      g.remove(s2);
+      expect(s1).toBeChildOf(g);
+      expect(s2).not.toBeChildOf(g);
+    });
+
   });
 
   describe("copy()", function() {

test/both/rendering.js

@@ -11,6 +11,7 @@ describe("Rendering", function() {
     expect(r.el.tagName).toEqual('svg');
     expect(r.el).toHaveAttr('width', "200");
     expect(r.el).toHaveAttr('height', "300");
+    expect(r.el).toHaveAttr('viewBox', "0 0 200 300");
   });
 
   describe("All shapes", function() {
@@ -369,9 +370,8 @@ describe("Rendering", function() {
     });
 
     it("should not render group if child was removed from group", function() {
-      var c = r.circle(10, 15, 100);
       var parent = r.group(10, 15);
-      parent.add(c);
+      var c = r.circle(10, 15, 100, parent);
       r.draw();
       parent.remove(c);
       r.draw();