Making initial changes for svg.js v3.0

- removed `SVG.Array.split()` function (#604)
- removed workaround for browser bug with stroke-width (#560)
- removed polyfills
- removed `ungroup()` in favour of `flatten()`
- gradients now have their corresponding nodename as type and not only radial/linear (#606)
- `SVG.Path.pointAt()` correctly returns an `SVG.Point` now (#607)
- replaced static reference to `masker` in `SVG.Mask` with the `masker()` method
- replaced static reference to `clipper` in `SVG.ClipPath` with the `clipper()` method
- replaced static reference to `targets` in `SVG.Mask` and `SVG.ClipPath` with the `targets()` method (all three #563)

11 files changed, 72 insertions, 124 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 5313494..30f49a8 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,17 +11,27 @@ The document follows the conventions described in [“Keep a CHANGELOG”](http:
 ## UNRELEASED 3.0.0
 
 ### Added
-- added `'random'` option and `randomize()` method to `SVG.Color` -> __TODO!__
+- added `SVG.$()` and `SVG.$$()` which will query for one/all elements
+- added `random` option and `randomize()` method to `SVG.Color` -> __TODO!__
 - added `precision()` method to round numeric element attributes -> __TODO!__
 - added specs for `SVG.FX` -> __TODO!__
 
+### Removed
+- removed `SVG.Array.split()` function
+- removed workaround for browser bug with stroke-width
+- removed polyfills
+- removed `ungroup()` in favour of `flatten()`
+- removed `SVG.Set` -> __TODO!__
+
 ### Changed
+- gradients now have there corresponding node as type and not only radial/linear
+- `SVG.Path.pointAt()` correctly returns an `SVG.Point` now
 - made transform-methods relative as default (breaking change)
 - changed SVG() to use querySelector instead of getElementById (breaking change) -> __TODO!__
 - made `parents()` method on `SVG.Element` return an instance of SVG.Set (breaking change) -> __TODO!__
-- replaced static reference to `masker` in `SVG.Mask` with the `masker()` method (breaking change) -> __TODO!__
-- replaced static reference to `clipper` in `SVG.ClipPath` with the `clipper()` method (breaking change) -> __TODO!__
-- replaced static reference to `targets` in `SVG.Mask` and `SVG.ClipPath` with the `targets()` method (breaking change) -> __TODO!__
+- replaced static reference to `masker` in `SVG.Mask` with the `masker()` method
+- replaced static reference to `clipper` in `SVG.ClipPath` with the `clipper()` method
+- replaced static reference to `targets` in `SVG.Mask` and `SVG.ClipPath` with the `targets()` method
 - moved all regexes to `SVG.regex` (in color, element, pointarray, style, transform and viewbox) -> __TODO!__
 
 ### Fixed
diff --git a/src/array.js b/src/array.js
index 9947242..b532296 100644
--- a/src/array.js
+++ b/src/array.js
@@ -64,11 +64,7 @@ SVG.extend(SVG.Array, {
     // if already is an array, no need to parse it
     if (Array.isArray(array)) return array
 
-    return this.split(array)
-  }
-  // Strip unnecessary whitespace
-, split: function(string) {
-    return string.trim().split(SVG.regex.delimiter).map(parseFloat)
+    return array.trim().split(SVG.regex.delimiter).map(parseFloat)
   }
   // Reverse array
 , reverse: function() {
diff --git a/src/attr.js b/src/attr.js
index 134ac19..c88d34c 100644
--- a/src/attr.js
+++ b/src/attr.js
@@ -28,11 +28,6 @@ SVG.extend(SVG.Element, {
         parseFloat(v) : v
     
     } else {
-      // BUG FIX: some browsers will render a stroke if a color is given even though stroke width is 0
-      if (a == 'stroke-width')
-        this.attr('stroke', parseFloat(v) > 0 ? this._stroke : null)
-      else if (a == 'stroke')
-        this._stroke = v
 
       // convert image fill and stroke to patterns
       if (a == 'fill' || a == 'stroke') {
diff --git a/src/clip.js b/src/clip.js
index 2a92e44..70e2499 100644
--- a/src/clip.js
+++ b/src/clip.js
@@ -1,11 +1,6 @@
 SVG.ClipPath = SVG.invent({
   // Initialize node
-  create: function() {
-    this.constructor.call(this, SVG.create('clipPath'))
-
-    // keep references to clipped elements 
-    this.targets = []
-  }
+  create: 'clipPath'
 
   // Inherit from
 , inherit: SVG.Container
@@ -14,19 +9,22 @@ SVG.ClipPath = SVG.invent({
 , extend: {
     // Unclip all clipped elements and remove itself
     remove: function() {
-      // unclip all targets 
-      for (var i = this.targets.length - 1; i >= 0; i--)
-        if (this.targets[i])
-          this.targets[i].unclip()
-      this.targets = []
+      // unclip all targets
+      this.targets().each(function() {
+        this.unclip()
+      })
 
-      // remove clipPath from parent 
+      // remove clipPath from parent
       this.parent().removeElement(this)
-      
+
       return this
     }
+    
+  , targets: function() {
+      return SVG.select('svg [clip-path*="' +this.id() +'"]')
+    }
   }
-  
+
   // Add parent method
 , construct: {
     // Create clipping element
@@ -40,19 +38,18 @@ SVG.ClipPath = SVG.invent({
 SVG.extend(SVG.Element, {
   // Distribute clipPath to svg element
   clipWith: function(element) {
-    // use given clip or create a new one 
-    this.clipper = element instanceof SVG.ClipPath ? element : this.parent().clip().add(element)
+    // use given clip or create a new one
+    var clipper = element instanceof SVG.ClipPath ? element : this.parent().clip().add(element)
 
-    // store reverence on self in mask 
-    this.clipper.targets.push(this)
-    
-    // apply mask 
-    return this.attr('clip-path', 'url("#' + this.clipper.attr('id') + '")')
+    // apply mask
+    return this.attr('clip-path', 'url("#' + clipper.attr('id') + '")')
   }
   // Unclip element
 , unclip: function() {
-    delete this.clipper
     return this.attr('clip-path', null)
   }
-  
+, clipper: function() {
+    return this.reference('clip-path')
+  }
+
 })
\ No newline at end of file
diff --git a/src/element.js b/src/element.js
index d22e742..37b324c 100644
--- a/src/element.js
+++ b/src/element.js
@@ -2,8 +2,7 @@
 SVG.Element = SVG.invent({
   // Initialize node
   create: function(node) {
-    // make stroke value accessible dynamically
-    this._stroke = SVG.defaults.attrs.stroke
+    // last fired event on node
     this._event = null
 
     // initialize data object
@@ -13,9 +12,6 @@ SVG.Element = SVG.invent({
     if (this.node = node) {
       this.type = node.nodeName
       this.node.instance = this
-
-      // store current attribute value
-      this._stroke = node.getAttribute('stroke') || this._stroke
     }
   }
 
diff --git a/src/ungroup.js b/src/flatten.js
index 7f26915..2c62733 100644
--- a/src/ungroup.js
+++ b/src/flatten.js
@@ -1,6 +1,5 @@
 SVG.extend(SVG.Parent, {
-
-  ungroup: function(parent, depth) {
+  flatten: function(parent, depth) {
     if(depth === 0 || this instanceof SVG.Defs) return this
 
     parent = parent || (this instanceof SVG.Doc ? this : this.parent(SVG.Parent))
@@ -15,10 +14,5 @@ SVG.extend(SVG.Parent, {
     this.node.firstChild || this.remove()
 
     return this
-  },
-  
-  flatten: function(parent, depth) {
-    return this.ungroup(parent, depth)
   }
-
 })
\ No newline at end of file
diff --git a/src/gradient.js b/src/gradient.js
index 17145e6..a16c092 100644
--- a/src/gradient.js
+++ b/src/gradient.js
@@ -2,9 +2,6 @@ SVG.Gradient = SVG.invent({
   // Initialize node
   create: function(type) {
     this.constructor.call(this, SVG.create(type + 'Gradient'))
-    
-    // store type 
-    this.type = type
   }
 
   // Inherit from
@@ -55,13 +52,13 @@ SVG.Gradient = SVG.invent({
 SVG.extend(SVG.Gradient, SVG.FX, {
   // From position
   from: function(x, y) {
-    return (this._target || this).type == 'radial' ?
+    return (this._target || this).type == 'radialGradient' ?
       this.attr({ fx: new SVG.Number(x), fy: new SVG.Number(y) }) :
       this.attr({ x1: new SVG.Number(x), y1: new SVG.Number(y) })
   }
   // To position
 , to: function(x, y) {
-    return (this._target || this).type == 'radial' ?
+    return (this._target || this).type == 'radialGradient' ?
       this.attr({ cx: new SVG.Number(x), cy: new SVG.Number(y) }) :
       this.attr({ x2: new SVG.Number(x), y2: new SVG.Number(y) })
   }
diff --git a/src/mask.js b/src/mask.js
index 51e61e9..86951ad 100644
--- a/src/mask.js
+++ b/src/mask.js
@@ -1,11 +1,6 @@
 SVG.Mask = SVG.invent({
   // Initialize node
-  create: function() {
-    this.constructor.call(this, SVG.create('mask'))
-
-    // keep references to masked elements 
-    this.targets = []
-  }
+  create: 'mask'
 
   // Inherit from
 , inherit: SVG.Container
@@ -14,19 +9,22 @@ SVG.Mask = SVG.invent({
 , extend: {
     // Unmask all masked elements and remove itself
     remove: function() {
-      // unmask all targets 
-      for (var i = this.targets.length - 1; i >= 0; i--)
-        if (this.targets[i])
-          this.targets[i].unmask()
-      this.targets = []
+      // unmask all targets
+      this.targets().each(function() {
+        this.unmask()
+      })
 
-      // remove mask from parent 
+      // remove mask from parent
       this.parent().removeElement(this)
-      
+
       return this
     }
+
+  , targets: function() {
+      return SVG.select('svg [mask*="' +this.id() +'"]')
+    }
   }
-  
+
   // Add parent method
 , construct: {
     // Create masking element
@@ -40,19 +38,17 @@ SVG.Mask = SVG.invent({
 SVG.extend(SVG.Element, {
   // Distribute mask to svg element
   maskWith: function(element) {
-    // use given mask or create a new one 
-    this.masker = element instanceof SVG.Mask ? element : this.parent().mask().add(element)
-
-    // store reverence on self in mask 
-    this.masker.targets.push(this)
-    
-    // apply mask 
-    return this.attr('mask', 'url("#' + this.masker.attr('id') + '")')
+    // use given mask or create a new one
+    var masker = element instanceof SVG.Mask ? element : this.parent().mask().add(element)
+
+    // apply mask
+    return this.attr('mask', 'url("#' + masker.attr('id') + '")')
   }
   // Unmask element
 , unmask: function() {
-    delete this.masker
     return this.attr('mask', null)
   }
-  
+, masker: function() {
+    return this.reference('mask')
+  }
 })
diff --git a/src/polyfill.js b/src/polyfill.js
deleted file mode 100644
index 06ae0fd..0000000
--- a/src/polyfill.js
+++ /dev/null
@@ -1,42 +0,0 @@
-// Add CustomEvent to IE9 and IE10 
-if (typeof CustomEvent !== 'function') {
-  // Code from: https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent
-  var CustomEvent = function(event, options) {
-    options = options || { bubbles: false, cancelable: false, detail: undefined }
-    var e = document.createEvent('CustomEvent')
-    e.initCustomEvent(event, options.bubbles, options.cancelable, options.detail)
-    return e
-  }
-
-  CustomEvent.prototype = window.Event.prototype
-
-  window.CustomEvent = CustomEvent
-}
-
-// requestAnimationFrame / cancelAnimationFrame Polyfill with fallback based on Paul Irish
-(function(w) {
-  var lastTime = 0
-  var vendors = ['moz', 'webkit']
-  
-  for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
-    w.requestAnimationFrame = w[vendors[x] + 'RequestAnimationFrame']
-    w.cancelAnimationFrame  = w[vendors[x] + 'CancelAnimationFrame'] ||
-                              w[vendors[x] + 'CancelRequestAnimationFrame']
-  }
- 
-  w.requestAnimationFrame = w.requestAnimationFrame || 
-    function(callback) {
-      var currTime = new Date().getTime()
-      var timeToCall = Math.max(0, 16 - (currTime - lastTime))
-      
-      var id = w.setTimeout(function() {
-        callback(currTime + timeToCall)
-      }, timeToCall)
-      
-      lastTime = currTime + timeToCall
-      return id
-    }
- 
-  w.cancelAnimationFrame = w.cancelAnimationFrame || w.clearTimeout;
-
-}(window))
\ No newline at end of file
diff --git a/src/selector.js b/src/selector.js
index fe87e4e..90a8714 100644
--- a/src/selector.js
+++ b/src/selector.js
@@ -13,10 +13,19 @@ SVG.select = function(query, parent) {
   )
 }
 
+SVG.$$ = function(query, parent) {
+  return SVG.utils.map((parent || document).querySelectorAll(query), function(node) {
+    return SVG.adopt(node)
+  })
+}
+
+SVG.$ = function(query, parent) {
+  return SVG.adopt((parent || document).querySelector(query))
+}
+
 SVG.extend(SVG.Parent, {
   // Scoped select method
   select: function(query) {
     return SVG.select(query, this.node)
   }
-
-})
\ No newline at end of file
+})
diff --git a/src/sugar.js b/src/sugar.js
index e577ea7..d58c6c8 100644
--- a/src/sugar.js
+++ b/src/sugar.js
@@ -82,7 +82,7 @@ SVG.extend(SVG.Rect, SVG.Ellipse, SVG.Circle, SVG.Gradient, SVG.FX, {
   // Add x and y radius
   radius: function(x, y) {
     var type = (this._target || this).type;
-    return type == 'radial' || type == 'circle' ?
+    return type == 'radialGradient' || type == 'radialGradient' ?
       this.attr('r', new SVG.Number(x)) :
       this.rx(x).ry(y == null ? x : y)
   }
@@ -95,7 +95,7 @@ SVG.extend(SVG.Path, {
   }
   // Get point at length
 , pointAt: function(length) {
-    return this.node.getPointAtLength(length)
+    return new SVG.Point(this.node.getPointAtLength(length))
   }
 })