Reworked sub-pixel offset fix

Author: wout

CHANGELOG.md

@@ -28,7 +28,7 @@
 - changed `track` reference to `track()` on `SVG.Text` -> __TODO!__
 - fixed a bug in clipping and masking where empty nodes persists after removal -> __TODO!__
 - added raw svg import functionality with the `svg()` method -> __TODO!__
-- moved sup-pixel offset fix to a separate plugin -> __TODO!__
+- reworked sup-pixel offset implementation to be more compact
 - added `native()` method to elements and matrix to get to the native api
 - added `untransform()` method to remove all transformations
 - fixed a bug in IE11 with `mouseenter` and `mouseleave` -> __TODO!__
@@ -37,6 +37,9 @@
 - changed `to()` method to `at()` method in `SVG.FX`
 - added reverse functionality for animations
 - documented the `situation` object in `SVG.FX`
+- renamed `SVG.SetFX` to `SVG.FX.Set`
+- added distinction between relative and absolute matrix transformations -> __TODO!__
+- added specs for `SVG.FX` -> __TODO!__
 
 # 1.0.0-rc.9 (17/06/2014)
 

README.md

@@ -67,11 +67,17 @@ Svg.js also works outside of the HTML DOM, inside an SVG document for example:
 </svg>
 ```
 
-### Sub pixel offset fix
-By default sub pixel offset won't be corrected. To enable it, call the `fixSubPixelOffset()` method:
+### Sub-pixel offset fix
+Call the `spof()` method to fix sub-pixel offset:
 
 ```javascript
-var draw = SVG('drawing').fixSubPixelOffset()
+var draw = SVG('drawing').spof()
+```
+
+To enable automatic sub-pixel offset correction when the window is resized:
+
+```javascript
+SVG.on(window, 'resize', function() { draw.spof() })
 ```
 
 ## Parent elements
@@ -3642,6 +3648,9 @@ SVG.extend(SVG.Rect, {
 })
 ```
 
+### Refactor your code
+Once your implementation is ready, revisit and rework it. We like to keep it [DRY](http://en.wikipedia.org/wiki/Don't_repeat_yourself).
+
 ### Test. Your. Code.
 It's not that hard to write at least one example per implementation, although we prefer more. Your code might seem to work by quickly testing it in your brwoser but more than often you can't forsee everything.
 

dist/svg.js

@@ -6,7 +6,7 @@
 * @copyright Wout Fierens <wout@impinc.co.uk>
 * @license MIT
 *
-* BUILT: Wed Jul 30 2014 11:04:18 GMT+0200 (CEST)
+* BUILT: Thu Jul 31 2014 20:23:11 GMT+0200 (CEST)
 */
 ;(function() {
 // The main wrapping element
@@ -2707,41 +2707,22 @@ SVG.Doc = SVG.invent({
   , parent: function() {
       return this.node.parentNode.nodeName == '#document' ? null : this.node.parentNode
     }
-  }
-  
-})
-
-// Fix for possible sub-pixel offset. See:
-// https://bugzilla.mozilla.org/show_bug.cgi?id=608812
-SVG.extend(SVG.Doc, {
-  // Callback
-  spof: function() {
-    if (this.doSpof) {
+    // Fix for possible sub-pixel offset. See:
+    // https://bugzilla.mozilla.org/show_bug.cgi?id=608812
+  , spof: function(spof) {
       var pos = this.node.getScreenCTM()
 
       if (pos)
         this
           .style('left', (-pos.e % 1) + 'px')
           .style('top',  (-pos.f % 1) + 'px')
-    }
-    
-    return this
-  }
 
-  // Sub-pixel offset enabler
-, fixSubPixelOffset: function() {
-    var self = this
-
-    // Enable spof
-    this.doSpof = true
-
-    // Make sure sub-pixel offset is fixed every time the window is resized
-    SVG.on(window, 'resize', function() { self.spof() })
-
-    return this.spof()
+      return this
+    }
   }
 
 })
+
 SVG.Shape = SVG.invent({
   // Initialize node
   create: function(element) {

dist/svg.min.js

@@ -57,7 +57,6 @@ var parts = [
 , 'src/gradient.js'
 , 'src/pattern.js'
 , 'src/doc.js'
-, 'src/spof.js'
 , 'src/shape.js'
 , 'src/symbol.js'
 , 'src/use.js'

gulpfile.js

@@ -53,6 +53,18 @@ SVG.Doc = SVG.invent({
   , parent: function() {
       return this.node.parentNode.nodeName == '#document' ? null : this.node.parentNode
     }
+    // Fix for possible sub-pixel offset. See:
+    // https://bugzilla.mozilla.org/show_bug.cgi?id=608812
+  , spof: function(spof) {
+      var pos = this.node.getScreenCTM()
+      
+      if (pos)
+        this
+          .style('left', (-pos.e % 1) + 'px')
+          .style('top',  (-pos.f % 1) + 'px')
+
+      return this
+    }
   }
 
 })