Added deep traversing, reorganizd modules

17 files changed, 192 insertions, 77 deletions

diff --git a/src/clip.js b/src/clip.js
index c1e82cb..7341c8f 100644
--- a/src/clip.js
+++ b/src/clip.js
@@ -5,6 +5,7 @@ SVG.Clip = function() {
 // Inherit from SVG.Container
 SVG.Clip.prototype = new SVG.Container
 
+//
 SVG.extend(SVG.Element, {
   // Distribute clipPath to svg element
   clipWith: function(element) {
@@ -14,4 +15,13 @@ SVG.extend(SVG.Element, {
     return this.attr('clip-path', 'url(#' + this.clip.attr('id') + ')')
   }
   
+})
+
+//
+SVG.extend(SVG.Container, {
+  // Create clipping element
+  clip: function() {
+    return this.defs().put(new SVG.Clip)
+  }
+
 })
\ No newline at end of file
diff --git a/src/container.js b/src/container.js
index 46ebdb1..dbf2205 100644
--- a/src/container.js
+++ b/src/container.js
@@ -41,13 +41,17 @@ SVG.extend(SVG.Container, {
     return this.children().indexOf(element) >= 0
   }
   // Iterates over all children and invokes a given block
-, each: function(block) {
-    var index,
-        children = this.children()
-  
-    for (index = 0, length = children.length; index < length; index++)
-      if (children[index] instanceof SVG.Shape)
-        block.apply(children[index], [index, children])
+, each: function(block, deep) {
+    var i, il
+      , children = this.children()
+    
+    for (i = 0, il = children.length; i < il; i++) {
+      if (children[i] instanceof SVG.Shape)
+        block.apply(children[i], [i, children])
+
+      if (deep && (children[i] instanceof SVG.Container))
+        children[i].each(block, deep)
+    }
   
     return this
   }
@@ -69,67 +73,6 @@ SVG.extend(SVG.Container, {
 , level: function() {
     return this.removeElement(this.defs()).put(this.defs(), 0)
   }
-  // Create a group element
-, group: function() {
-    return this.put(new SVG.G)
-  }
-  // Create a rect element
-, rect: function(width, height) {
-    return this.put(new SVG.Rect().size(width, height))
-  }
-  // Create circle element, based on ellipse
-, circle: function(size) {
-    return this.ellipse(size, size)
-  }
-  // Create an ellipse
-, ellipse: function(width, height) {
-    return this.put(new SVG.Ellipse().size(width, height).move(0, 0))
-  }
-  // Create a line element
-, line: function(x1, y1, x2, y2) {
-    return this.put(new SVG.Line().plot(x1, y1, x2, y2))
-  }
-  // Create a wrapped polyline element
-, polyline: function(points, unbiased) {
-    return this.put(new SVG.Polyline(unbiased)).plot(points)
-  }
-  // Create a wrapped polygon element
-, polygon: function(points, unbiased) {
-    return this.put(new SVG.Polygon(unbiased)).plot(points)
-  }
-  // Create a wrapped path element
-, path: function(data, unbiased) {
-    return this.put(new SVG.Path(unbiased)).plot(data)
-  }
-  // Create image element, load image and set its size
-, image: function(source, width, height) {
-    width = width != null ? width : 100
-    return this.put(new SVG.Image().load(source).size(width, height != null ? height : width))
-  }
-  // Create text element
-, text: function(text) {
-    return this.put(new SVG.Text().text(text))
-  }
-  // Create nested svg document
-, nested: function() {
-    return this.put(new SVG.Nested)
-  }
-  // Create gradient element in defs
-, gradient: function(type, block) {
-    return this.defs().gradient(type, block)
-  }
-  // Create pattern element in defs
-, pattern: function(width, height, block) {
-    return this.defs().pattern(width, height, block)
-  }
-  // Create masking element
-, mask: function() {
-    return this.defs().put(new SVG.Mask)
-  }
-  // Create clipping element
-, clip: function() {
-    return this.defs().put(new SVG.Clip)
-  }
   // Get first child, skipping the defs node
 , first: function() {
     return this.children()[0] instanceof SVG.Defs ? this.children()[1] : this.children()[0]
diff --git a/src/element.js b/src/element.js
index 8d07762..3fa456f 100644
--- a/src/element.js
+++ b/src/element.js
@@ -140,6 +140,10 @@ SVG.extend(SVG.Element, {
       return this.style(v)
     
     } else {
+      /* process gradient or pattern fill */
+      if (typeof v.fill === 'function')
+        v = v.fill()
+
       /* treat x differently on text elements */
       if (a == 'x' && Array.isArray(this.lines))
         for (n = this.lines.length - 1; n >= 0; n--)
@@ -154,7 +158,7 @@ SVG.extend(SVG.Element, {
       /* ensure hex color */
       if (SVG.Color.test(v) || SVG.Color.isRgb(v))
         v = new SVG.Color(v).toHex()
-        
+
       /* set give attribute on node */
       n != null ?
         this.node.setAttributeNS(n, a, v) :
diff --git a/src/ellipse.js b/src/ellipse.js
index 598c250..2ff0c86 100644
--- a/src/ellipse.js
+++ b/src/ellipse.js
@@ -34,6 +34,19 @@ SVG.extend(SVG.Ellipse, {
   
 })
 
+//
+SVG.extend(SVG.Container, {
+  // Create circle element, based on ellipse
+  circle: function(size) {
+    return this.ellipse(size, size)
+  }
+  // Create an ellipse
+, ellipse: function(width, height) {
+    return this.put(new SVG.Ellipse().size(width, height).move(0, 0))
+  }
+  
+})
+
 // Usage:
 
 //     draw.ellipse(200, 100)
\ No newline at end of file
diff --git a/src/gradient.js b/src/gradient.js
index 6a2155e..f98a0b0 100644
--- a/src/gradient.js
+++ b/src/gradient.js
@@ -64,6 +64,15 @@ SVG.extend(SVG.Defs, {
   
 })
 
+//
+SVG.extend(SVG.Container, {
+  // Create gradient element in defs
+  gradient: function(type, block) {
+    return this.defs().gradient(type, block)
+  }
+  
+})
+
 
 SVG.Stop = function(stop) {
   this.constructor.call(this, SVG.create('stop'))
diff --git a/src/group.js b/src/group.js
index f960391..1184657 100644
--- a/src/group.js
+++ b/src/group.js
@@ -5,6 +5,7 @@ SVG.G = function() {
 // Inherit from SVG.Container
 SVG.G.prototype = new SVG.Container
 
+//
 SVG.extend(SVG.G, {
   // Move over x-axis
   x: function(x) {
@@ -19,4 +20,13 @@ SVG.extend(SVG.G, {
     return this.doc().defs()
   }
   
+})
+
+//
+SVG.extend(SVG.Container, {
+  // Create a group element
+  group: function() {
+    return this.put(new SVG.G)
+  }
+  
 })
\ No newline at end of file
diff --git a/src/image.js b/src/image.js
index 7546936..b01897d 100644
--- a/src/image.js
+++ b/src/image.js
@@ -5,6 +5,7 @@ SVG.Image = function() {
 // Inherit from SVG.Element
 SVG.Image.prototype = new SVG.Shape
 
+//
 SVG.extend(SVG.Image, {
   
   // (re)load image
@@ -12,4 +13,14 @@ SVG.extend(SVG.Image, {
     return (url ? this.attr('xlink:href', (this.src = url), SVG.xlink) : this)
   }
   
+})
+
+//
+SVG.extend(SVG.Container, {
+  // Create image element, load image and set its size
+  image: function(source, width, height) {
+    width = width != null ? width : 100
+    return this.put(new SVG.Image().load(source).size(width, height != null ? height : width))
+  }
+
 })
\ No newline at end of file
diff --git a/src/line.js b/src/line.js
index b32141c..2c9034e 100644
--- a/src/line.js
+++ b/src/line.js
@@ -54,3 +54,12 @@ SVG.extend(SVG.Line, {
   }
   
 })
+
+//
+SVG.extend(SVG.Container, {
+  // Create a line element
+  line: function(x1, y1, x2, y2) {
+    return this.put(new SVG.Line().plot(x1, y1, x2, y2))
+  }
+  
+})
diff --git a/src/mask.js b/src/mask.js
index 12fc13b..ddd7565 100644
--- a/src/mask.js
+++ b/src/mask.js
@@ -5,6 +5,7 @@ SVG.Mask = function() {
 // Inherit from SVG.Container
 SVG.Mask.prototype = new SVG.Container
 
+//
 SVG.extend(SVG.Element, {
   // Distribute mask to svg element
   maskWith: function(element) {
@@ -14,4 +15,13 @@ SVG.extend(SVG.Element, {
     return this.attr('mask', 'url(#' + this.mask.attr('id') + ')')
   }
   
+})
+
+//
+SVG.extend(SVG.Container, {
+  // Create masking element
+  mask: function() {
+    return this.defs().put(new SVG.Mask)
+  }
+  
 })
\ No newline at end of file
diff --git a/src/nested.js b/src/nested.js
index 537d610..d42abf9 100644
--- a/src/nested.js
+++ b/src/nested.js
@@ -5,4 +5,13 @@ SVG.Nested = function() {
 }
 
 // Inherit from SVG.Container
-SVG.Nested.prototype = new SVG.Container
\ No newline at end of file
+SVG.Nested.prototype = new SVG.Container
+
+//
+SVG.extend(SVG.Container, {
+  // Create nested svg document
+  nested: function() {
+    return this.put(new SVG.Nested)
+  }
+  
+})
\ No newline at end of file
diff --git a/src/path.js b/src/path.js
index b328d92..ef6ab03 100644
--- a/src/path.js
+++ b/src/path.js
@@ -13,4 +13,13 @@ SVG.extend(SVG.Path, {
     return this.attr('d', data || 'M0,0')
   }
   
+})
+
+//
+SVG.extend(SVG.Container, {
+  // Create a wrapped path element
+  path: function(data, unbiased) {
+    return this.put(new SVG.Path(unbiased)).plot(data)
+  }
+
 })
\ No newline at end of file
diff --git a/src/pattern.js b/src/pattern.js
index c5f51e0..dc57e77 100644
--- a/src/pattern.js
+++ b/src/pattern.js
@@ -16,10 +16,9 @@ SVG.extend(SVG.Pattern, {
 
 //
 SVG.extend(SVG.Defs, {
-  
-  /* define gradient */
+  // Define gradient
   pattern: function(width, height, block) {
-    var element = this.put(new SVG.Pattern())
+    var element = this.put(new SVG.Pattern)
     
     /* invoke passed block */
     block(element)
@@ -33,4 +32,13 @@ SVG.extend(SVG.Defs, {
     })
   }
   
-});
\ No newline at end of file
+})
+
+//
+SVG.extend(SVG.Container, {
+  // Create pattern element in defs
+  pattern: function(width, height, block) {
+    return this.defs().pattern(width, height, block)
+  }
+
+})
\ No newline at end of file
diff --git a/src/poly.js b/src/poly.js
index 36492dc..8dd4696 100644
--- a/src/poly.js
+++ b/src/poly.js
@@ -32,4 +32,16 @@ SVG.extend(SVG.Polyline, SVG.Polygon, {
     return this.attr('points', p || '0,0')
   }
   
-}) 
+})
+
+//
+SVG.extend(SVG.Container, {
+  // Create a wrapped polyline element
+  polyline: function(points, unbiased) {
+    return this.put(new SVG.Polyline(unbiased)).plot(points)
+  }
+  // Create a wrapped polygon element
+, polygon: function(points, unbiased) {
+    return this.put(new SVG.Polygon(unbiased)).plot(points)
+  }
+})
\ No newline at end of file
diff --git a/src/rect.js b/src/rect.js
index 1a3bf19..583556d 100644
--- a/src/rect.js
+++ b/src/rect.js
@@ -3,4 +3,13 @@ SVG.Rect = function() {
 }
 
 // Inherit from SVG.Shape
-SVG.Rect.prototype = new SVG.Shape
\ No newline at end of file
+SVG.Rect.prototype = new SVG.Shape
+
+//
+SVG.extend(SVG.Container, {
+  // Create a rect element
+  rect: function(width, height) {
+    return this.put(new SVG.Rect().size(width, height))
+  }
+
+})
\ No newline at end of file
diff --git a/src/set.js b/src/set.js
new file mode 100644
index 0000000..c518c37
--- /dev/null
+++ b/src/set.js
@@ -0,0 +1,37 @@
+SVG.Set = function() {
+  this.children = []
+}
+
+SVG.extend(SVG.Set, {
+  // Add element to set
+  add: function(element) {
+    this.children.push(element)
+
+    return this
+  }
+  // Remove element from set
+, remove: function(element) {
+    var i = this.children.indexOf(element)
+    
+    if (i > -1)
+      this.children.splice(i, 1)
+
+    return this
+  }
+  // Move all children
+, move: function(x, y) {
+    return this.x(x).y(y)
+  }
+
+})
+
+// Create method aliases
+;['attr'].forEach(function(method) {
+
+  SVG.Set.prototype[method] = function() {
+    for (var i = 0, il = this.children.length; i < il; i++)
+      this.children[i][method](arguments)
+
+  }
+
+})
\ No newline at end of file
diff --git a/src/text.js b/src/text.js
index afd8724..22ec5bc 100644
--- a/src/text.js
+++ b/src/text.js
@@ -19,6 +19,7 @@ SVG.Text = function() {
 // Inherit from SVG.Element
 SVG.Text.prototype = new SVG.Shape
 
+//
 SVG.extend(SVG.Text, {
   // Move over x-axis
   x: function(x, a) {
@@ -123,6 +124,15 @@ SVG.extend(SVG.Text, {
   
 })
 
+//
+SVG.extend(SVG.Container, {
+  // Create text element
+  text: function(text) {
+    return this.put(new SVG.Text().text(text))
+  }
+
+})
+
 // tspan class
 SVG.TSpan = function() {
   this.constructor.call(this, SVG.create('tspan'))
diff --git a/src/viewbox.js b/src/viewbox.js
index f06ab6d..ff84b93 100644
--- a/src/viewbox.js
+++ b/src/viewbox.js
@@ -34,10 +34,12 @@ SVG.ViewBox = function(element) {
   
 }
 
+//
 SVG.extend(SVG.ViewBox, {
   // Parse viewbox to string
   toString: function() {
     return this.x + ' ' + this.y + ' ' + this.width + ' ' + this.height
   }
   
-})
\ No newline at end of file
+})
+