h.setPrefixedStyle: now prefixes are only for transform property

bower.json

@@ -1,7 +1,7 @@
 {
   "name": "mojs",
   "description": "motion graphics toolbelt for the web",
-  "version": "0.147.2",
+  "version": "0.147.3",
   "license": "MIT",
   "homepage": "https://github.com/legomushroom/mojs",
   "authors": [

build/mo.js

@@ -1,7 +1,7 @@
 /*! 
 	:: mo · js :: motion graphics toolbelt for the web
 	Oleg Solomka @LegoMushroom 2015 MIT
-	0.147.2 
+	0.147.3 
 */
 
 (function(f){
@@ -1263,11 +1263,13 @@ Helpers = (function() {
     }
   };
 
-  Helpers.prototype.setPrefixedStyle = function(el, name, value) {
-    var prefixedName, prefixedStyle;
-    prefixedName = "" + this.prefix.css + name;
-    prefixedStyle = el.style[prefixedName] != null ? prefixedName : name;
-    return el.style[prefixedStyle] = value;
+  Helpers.prototype.setPrefixedStyle = function(el, name, value, isIt) {
+    if (name.match(/transform/gim)) {
+      el.style["" + name] = value;
+      return el.style["" + this.prefix.css + name] = value;
+    } else {
+      return el.style[name] = value;
+    }
   };
 
   Helpers.prototype.style = function(el, name, value) {
@@ -1703,7 +1705,7 @@ module.exports = h;
 
 },{}],7:[function(require,module,exports){
 window.mojs = {
-  revision: '0.147.2',
+  revision: '0.147.3',
   isDebug: true,
   helpers: require('./h'),
   Bit: require('./shapes/bit'),

docs/js/h.coffee.html

@@ -308,10 +308,11 @@
         </div>
 
 
-        <div class="code"><div class="wrapper">  <span class="hljs-attribute">setPrefixedStyle</span>:<span class="hljs-function"><span class="hljs-params">(el, name, value)</span>-&gt;</span>
-    prefixedName  = <span class="hljs-string">"<span class="hljs-subst">#{<span class="hljs-property">@prefix</span>.css}</span><span class="hljs-subst">#{name}</span>"</span>
-    prefixedStyle = <span class="hljs-keyword">if</span> el.style[prefixedName]? <span class="hljs-keyword">then</span> prefixedName <span class="hljs-keyword">else</span> name
-    el.style[prefixedStyle]  = value</div></div>
+        <div class="code"><div class="wrapper">  <span class="hljs-attribute">setPrefixedStyle</span>:<span class="hljs-function"><span class="hljs-params">(el, name, value, isIt)</span>-&gt;</span>
+    <span class="hljs-keyword">if</span> name.match <span class="hljs-regexp">/transform/gim</span>
+      el.style[<span class="hljs-string">"<span class="hljs-subst">#{name}</span>"</span>] = value
+      el.style[<span class="hljs-string">"<span class="hljs-subst">#{<span class="hljs-property">@prefix</span>.css}</span><span class="hljs-subst">#{name}</span>"</span>] = value
+    <span class="hljs-keyword">else</span> el.style[name] = value</div></div>
 
       </div>
 

docs/js/mojs.coffee.html

@@ -33,7 +33,7 @@
 
 
         <div class="code"><div class="wrapper"><span class="hljs-built_in">window</span>.mojs =
-  <span class="hljs-attribute">revision</span>:   <span class="hljs-string">'0.147.2'</span>, <span class="hljs-attribute">isDebug</span>: <span class="hljs-literal">true</span>
+  <span class="hljs-attribute">revision</span>:   <span class="hljs-string">'0.147.3'</span>, <span class="hljs-attribute">isDebug</span>: <span class="hljs-literal">true</span>
   helpers     : <span class="hljs-built_in">require</span> <span class="hljs-string">'./h'</span>
   Bit         : <span class="hljs-built_in">require</span> <span class="hljs-string">'./shapes/bit'</span>
   bitsMap     : <span class="hljs-built_in">require</span> <span class="hljs-string">'./shapes/bitsMap'</span>

docs/toc.js

@@ -222,14 +222,6 @@ window.files = [
   "lang": "coffeescript",
   "toc": []
 },
-{
-  "path": "js/vendor/resize.coffee.html",
-  "originalName": "resize.coffee",
-  "originalPath": "js/vendor/resize.coffee",
-  "name": "resize.coffee.html",
-  "lang": "coffeescript",
-  "toc": []
-},
 {
   "path": "js/tween/timeline.coffee.html",
   "originalName": "timeline.coffee",
@@ -254,6 +246,14 @@ window.files = [
   "lang": "coffeescript",
   "toc": []
 },
+{
+  "path": "js/vendor/resize.coffee.html",
+  "originalName": "resize.coffee",
+  "originalPath": "js/vendor/resize.coffee",
+  "name": "resize.coffee.html",
+  "lang": "coffeescript",
+  "toc": []
+},
 {
   "path": "index.html",
   "originalName": "readme.md",

js/h.coffee

@@ -152,10 +152,11 @@ class Helpers
   clamp:(value, min, max)->
     if value < min then min else if value > max then max else value
     # Math.min Math.max(value, min), max
-  setPrefixedStyle:(el, name, value)->
-    prefixedName  = "#{@prefix.css}#{name}"
-    prefixedStyle = if el.style[prefixedName]? then prefixedName else name
-    el.style[prefixedStyle]  = value
+  setPrefixedStyle:(el, name, value, isIt)->
+    if name.match /transform/gim
+      el.style["#{name}"] = value
+      el.style["#{@prefix.css}#{name}"] = value
+    else el.style[name] = value
   # ---
   # 
   # Sets styles on element with prefix(if needed) on el

js/mojs.coffee

@@ -1,6 +1,6 @@
 
 window.mojs =
-  revision:   '0.147.2', isDebug: true
+  revision:   '0.147.3', isDebug: true
   helpers     : require './h'
   Bit         : require './shapes/bit'
   bitsMap     : require './shapes/bitsMap'

lib/mojs.js

@@ -1,6 +1,6 @@
 (function() {
   window.mojs = {
-    revision: '0.147.2',
+    revision: '0.147.3',
     isDebug: true,
     helpers: require('./h'),
     Bit: require('./shapes/bit'),

package.json

@@ -1,7 +1,7 @@
 {
   "name": "mo-js",
   "description": "motion graphics toolbelt for the web",
-  "version": "0.147.2",
+  "version": "0.147.3",
   "license": "MIT",
   "private": false,
   "scripts": {

spec/h.coffee

@@ -389,9 +389,17 @@ describe 'Helpers ->', ->
         styleToSet = 'translateX(20px)'
         name = 'transform'; prefixedName = "#{h.prefix.css}transform"
         h.setPrefixedStyle(el, name, styleToSet)
-        style = if el.style[prefixedName]? then el.style[prefixedName]
-        else el.style[name]
-        expect(style).toBe styleToSet
+
+        expect(el.style[name] or el.style[prefixedName]).toBe styleToSet
+
+      it 'should set prefixed style #2', ->
+        el = document.createElement 'div'
+        styleToSet = 'translateX(20px)'
+        name = ' transform'; prefixedName = "#{h.prefix.css}transform"
+        h.setPrefixedStyle(el, name, styleToSet, true)
+
+        expect(el.style[name] or el.style[prefixedName]).toBe styleToSet
+
     describe 'parseUnit method', ->
       it 'should parse number to pixels', ->
         unit = h.parseUnit(100)

spec/h.js

@@ -528,15 +528,23 @@
         });
       });
       describe('setPrefixedStyle method', function() {
-        return it('should set prefixed style', function() {
-          var el, name, prefixedName, style, styleToSet;
+        it('should set prefixed style', function() {
+          var el, name, prefixedName, styleToSet;
           el = document.createElement('div');
           styleToSet = 'translateX(20px)';
           name = 'transform';
           prefixedName = "" + h.prefix.css + "transform";
           h.setPrefixedStyle(el, name, styleToSet);
-          style = el.style[prefixedName] != null ? el.style[prefixedName] : el.style[name];
-          return expect(style).toBe(styleToSet);
+          return expect(el.style[name] || el.style[prefixedName]).toBe(styleToSet);
+        });
+        return it('should set prefixed style #2', function() {
+          var el, name, prefixedName, styleToSet;
+          el = document.createElement('div');
+          styleToSet = 'translateX(20px)';
+          name = ' transform';
+          prefixedName = "" + h.prefix.css + "transform";
+          h.setPrefixedStyle(el, name, styleToSet, true);
+          return expect(el.style[name] || el.style[prefixedName]).toBe(styleToSet);
         });
       });
       describe('parseUnit method', function() {

spec/mo.spec.js

@@ -1261,11 +1261,13 @@ Helpers = (function() {
     }
   };
 
-  Helpers.prototype.setPrefixedStyle = function(el, name, value) {
-    var prefixedName, prefixedStyle;
-    prefixedName = "" + this.prefix.css + name;
-    prefixedStyle = el.style[prefixedName] != null ? prefixedName : name;
-    return el.style[prefixedStyle] = value;
+  Helpers.prototype.setPrefixedStyle = function(el, name, value, isIt) {
+    if (name.match(/transform/gim)) {
+      el.style["" + name] = value;
+      return el.style["" + this.prefix.css + name] = value;
+    } else {
+      return el.style[name] = value;
+    }
   };
 
   Helpers.prototype.style = function(el, name, value) {
@@ -1701,7 +1703,7 @@ module.exports = h;
 
 },{}],7:[function(require,module,exports){
 window.mojs = {
-  revision: '0.147.2',
+  revision: '0.147.3',
   isDebug: true,
   helpers: require('./h'),
   Bit: require('./shapes/bit'),