animar - npm Package Compare versions

Comparing version 0.5.4 to 0.6.0

lib/animar.js

 'use strict';
 
-var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })(); /* @flow */
 /* global __DEV__ */
@@ -20,10 +20,33 @@
 
-function _typeof(obj) { return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj; }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-if (__DEV__) {
-  var Helpers = require('./helpers');
-  var getStartValue = Helpers.getStartValue;
-}
+/*:: type ElementMap = Map<HTMLElement, Element>;*/
+/*:: type AnimationOptions = {
+  delay: ?any,
+  easingFunction: ?any,
+  duration: ?any,
+  loop: ?any
+};*/
+/*:: type ResolvedAnimationOptions = {
+  delay: number,
+  easingFunction: Function,
+  duration: number,
+  loop: boolean
+};*/
+/*:: export type AttributesOptions = { [key: string]: number | Array<number> };*/
+/*:: export type ChainOptions = {
+  delay: number,
+  currentDuration: number,
+  totalDuration: number
+}*/
+/*:: type FullChainObject = {
+  start: StartFunction,
+  loop: LoopFunction,
+  add: AddFunction,
+  then: ThenFunction
+};*/
+/*:: type AddFunction = (element:HTMLElement, attributes:AttributesOptions, options:AnimationOptions) => FullChainObject;*/
+/*:: type StartFunction = () => void;*/
+/*:: type ThenFunction = (wait:number) => { add: AddFunction };*/
+/*:: type LoopFunction = () => { start: StartFunction };*/
 
@@ -37,3 +60,3 @@ var EMPTY_ANIMATION_OPTIONS = {
 
-module.exports = (function () {
+var Animar = (function () {
   function Animar() {
@@ -57,19 +80,9 @@ _classCallCheck(this, Animar);
     key: 'add',
-    value: function add(element, attributes, options) {
+    value: function add(element /*:HTMLElement*/, attributes /*:AttributesOptions*/, options /*:AnimationOptions*/) {
       var resolvedOptions = options == null ? EMPTY_ANIMATION_OPTIONS : options;
 
+      /* istanbul ignore else */
       if (__DEV__) {
-        if (element == null) {
-          throw 'Missing or null parameter: element';
-        }
-        if (!element instanceof HTMLElement) {
-          throw "Parameter 'element' should be of type HTMLElement";
-        }
-        if (typeof attributes === 'undefined') {
-          throw 'Missing or null parameter: attribtues';
-        }
-        if ((typeof attributes === 'undefined' ? 'undefined' : _typeof(attributes)) !== 'object') {
-          throw "Parameter 'attributes' should be of type Object";
-        }
-        // TODO: Validate attributes contents
+        var validateAddParameters = require('./helpers').validateAddParameters;
+        validateAddParameters(element, attributes, resolvedOptions);
       }
@@ -85,3 +98,3 @@
     key: 'mergeElementMaps',
-    value: function mergeElementMaps(src, target) {
+    value: function mergeElementMaps(src /*:ElementMap*/, target /*:ElementMap*/) {
       var result = new Map(src);
@@ -92,4 +105,5 @@
 
-        if (result.has(elementRef)) {
-          mergedElement = result.get(elementRef).merge(element);
+        var existingElement = result.get(elementRef);
+        if (existingElement != null) {
+          mergedElement = existingElement.merge(element);
         } else {
@@ -105,19 +119,35 @@ mergedElement = element;
     key: 'resolveStartValue',
-    value: function resolveStartValue(start, element, attribute, currentChain) {
-      if (currentChain.has(element) && currentChain.get(element).hasAttribute(attribute)) {
-        start = currentChain.get(element).getModelFromAttribute(attribute);
-      } else if (this.elementMap.has(element) && this.elementMap.get(element).hasAttribute(attribute)) {
-        start = this.elementMap.get(element).getModelFromAttribute(attribute);
-      } else {
-        if (__DEV__) {
-          // TODO: Add development warning
-          start = getStartValue(element, attribute);
+    value: function resolveStartValue(start /*:?number*/, element /*:HTMLElement*/, attribute /*:string*/, currentChain /*:ElementMap*/) {
+      // just return the start value if it was supplied
+      if (start != null) {
+        return start;
+      }
+
+      // TODO: Replace existence logic with hasAttribute once FlowType has fixed its bug
+      var currentChainElement = currentChain.get(element);
+      var animarMapElement = this.elementMap.get(element);
+
+      // check to see if start value can be inferred from current chain element map
+      if (currentChainElement != null && currentChainElement.hasAttribute(attribute)) {
+        start = currentChainElement.getModelFromAttribute(attribute);
+      }
+      // check to see if start value can be inferred from existing element map in Animar instance
+      else if (animarMapElement != null && animarMapElement.hasAttribute(attribute)) {
+          start = animarMapElement.getModelFromAttribute(attribute);
         }
-      }
+        // if in development mode calculate the start value by querying the DOM
+        else {
+            /* istanbul ignore else */
+            if (__DEV__) {
+              // TODO: Add development warning
+              var getStartValue = require('./helpers').getStartValue;
+              start = getStartValue(element, attribute);
+            }
+          }
       return start;
     }
   }, {
-    key: '_add',
-    value: function _add(element, attributes, options, chainOptions, currentChain) {
-      var resolvedOptions = {
+    key: 'resolveAnimationOptions',
+    value: function resolveAnimationOptions(options /*:AnimationOptions*/) {
+      return {
         delay: options.delay == null ? this.defaults.delay : options.delay,
@@ -128,43 +158,52 @@ easingFunction: options.easingFunction == null ? this.defaults.easingFunction : options.easingFunction,
       };
+    }
+  }, {
+    key: '_add',
+    value: function _add(element /*:HTMLElement*/, attributes /*:{ [key: string]: number | Array<number> }*/, options /*:AnimationOptions*/, chainOptions /*:ChainOptions*/, currentChain /*:ElementMap*/) {
+      var _this = this;
 
-      for (var attribute in attributes) {
-        if (attributes.hasOwnProperty(attribute)) {
-          var attributeValue = attributes[attribute];
-          var _start = undefined,
-              destination = undefined;
+      var resolvedOptions = this.resolveAnimationOptions(options);
+      Object.keys(attributes).forEach(function (attribute) {
+        var attributeValue = attributes[attribute];
+        var start = undefined,
+            destination = undefined;
 
-          if (typeof attributeValue === 'number') {
-            destination = attributeValue;
-          } else {
-            _start = attributeValue[0];
-            destination = attributeValue[1];
-          }
+        if (typeof attributeValue === 'number') {
+          destination = attributeValue;
+        } else {
+          start = attributeValue[0];
+          destination = attributeValue[1];
+        }
 
-          _start = this.resolveStartValue(_start, element, attribute, currentChain);
+        start = _this.resolveStartValue(start, element, attribute, currentChain);
 
-          if (_start == null) {
-            throw 'Animation start value is not provided and cannot be infered';
-          } else {
-            _start -= destination;
-            var newAnimation = new _animation2.default(0 - (resolvedOptions.delay + chainOptions.delay), _start, 0 - _start, resolvedOptions.duration, resolvedOptions.easingFunction, resolvedOptions.loop, resolvedOptions.delay + chainOptions.delay, 0);
+        if (start == null) {
+          throw 'Animation start value is not provided and cannot be inferred';
+        } else {
+          currentChain = _this.addAnimationToChain(start, destination, resolvedOptions, chainOptions, attribute, element, currentChain);
+        }
+      });
+      chainOptions.currentDuration = Math.max(chainOptions.currentDuration, resolvedOptions.delay + resolvedOptions.duration);
+      return this.fullChainObjectFactory(chainOptions, currentChain);
+    }
+  }, {
+    key: 'addAnimationToChain',
+    value: function addAnimationToChain(start /*:number*/, destination /*:number*/, resolvedOptions /*:ResolvedAnimationOptions*/, chainOptions /*:ChainOptions*/, attribute /*:string*/, element /*:HTMLElement*/, currentChain /*:ElementMap*/) {
+      start -= destination;
+      var newAnimation = new _animation2.default(0 - (resolvedOptions.delay + chainOptions.delay), start, 0 - start, resolvedOptions.duration, resolvedOptions.easingFunction, resolvedOptions.loop, resolvedOptions.delay + chainOptions.delay, 0);
 
-            var newAttribute = new _attribute2.default(attribute, destination);
-            newAttribute.addAnimation(newAnimation);
+      var newAttribute = new _attribute2.default(attribute, destination);
+      newAttribute.addAnimation(newAnimation);
 
-            var newElement = new _element2.default(element);
-            newElement.addAttribute(attribute, newAttribute);
+      var newElement = new _element2.default(element);
+      newElement.addAttribute(attribute, newAttribute);
 
-            var tempEMap = new Map();
-            tempEMap.set(element, newElement);
+      var tempEMap = new Map();
+      tempEMap.set(element, newElement);
 
-            currentChain = this.mergeElementMaps(currentChain, tempEMap);
-          }
-        }
-      }
-      chainOptions.currentDuration = Math.max(chainOptions.currentDuration, resolvedOptions.delay + resolvedOptions.duration);
-      return this.fullChainObjectFactory(chainOptions, currentChain);
+      return this.mergeElementMaps(currentChain, tempEMap);
     }
   }, {
     key: 'fullChainObjectFactory',
-    value: function fullChainObjectFactory(chainOptions, chain) {
+    value: function fullChainObjectFactory(chainOptions /*:ChainOptions*/, chain /*:ElementMap*/) {
       return {
@@ -179,4 +218,4 @@ start: this.startChainFunctionFactory(chain),
     key: 'thenChainFunctionFactory',
-    value: function thenChainFunctionFactory(chainOptions, chain) {
-      var _this = this;
+    value: function thenChainFunctionFactory(chainOptions /*:ChainOptions*/, chain /*:ElementMap*/) {
+      var _this2 = this;
 
@@ -186,7 +225,8 @@ return function () {
 
-        chainOptions.totalDuration += chainOptions.currentDuration + wait;
-        chainOptions.currentDuration = 0;
-        chainOptions.delay = chainOptions.totalDuration;
+        var newChainOptions = Object.create(chainOptions);
+        newChainOptions.totalDuration += chainOptions.currentDuration + wait;
+        newChainOptions.currentDuration = 0;
+        newChainOptions.delay = newChainOptions.totalDuration;
         return {
-          add: _this.addChainFunctionFactory(chainOptions, chain)
+          add: _this2.addChainFunctionFactory(newChainOptions, chain)
         };
@@ -197,8 +237,15 @@ };
     key: 'addChainFunctionFactory',
-    value: function addChainFunctionFactory(chainOptions, chain) {
-      var _this2 = this;
+    value: function addChainFunctionFactory(chainOptions /*:ChainOptions*/, chain /*:ElementMap*/) {
+      var _this3 = this;
 
       return function (element, attributes, options) {
-        var resolvedOptions = typeof options === 'undefined' ? EMPTY_ANIMATION_OPTIONS : options;
-        return _this2._add(element, attributes, resolvedOptions, chainOptions, chain);
+        var resolvedOptions = options == null ? EMPTY_ANIMATION_OPTIONS : options;
+
+        /* istanbul ignore else */
+        if (__DEV__) {
+          var validateAddParameters = require('./helpers').validateAddParameters;
+          validateAddParameters(element, attributes, resolvedOptions);
+        }
+
+        return _this3._add(element, attributes, resolvedOptions, chainOptions, chain);
       };
@@ -208,4 +255,4 @@ }
     key: 'loopChainFunctionFactory',
-    value: function loopChainFunctionFactory(chainOptions, chain) {
-      var _this3 = this;
+    value: function loopChainFunctionFactory(chainOptions /*:ChainOptions*/, chain /*:ElementMap*/) {
+      var _this4 = this;
 
@@ -216,18 +263,10 @@ return function () {
         var newElementMap = new Map();
-
         chain.forEach(function (element, elementRef) {
-          element.forEachAnimationInAttribute(function (animation) {
-            if (animation != null) {
-              animation.loop = true;
-              animation.wait = chainOptions.totalDuration - animation.delay - animation.totalIterations;
-              return animation;
-            }
-          });
+          element.loop(chainOptions);
           newElementMap.set(elementRef, element);
         });
-
         chain = newElementMap;
 
         return {
-          start: _this3.startChainFunctionFactory(chain)
+          start: _this4.startChainFunctionFactory(chain)
         };
@@ -238,9 +277,8 @@ };
     key: 'startChainFunctionFactory',
-    value: function startChainFunctionFactory(chain) {
-      var _this4 = this;
+    value: function startChainFunctionFactory(chain /*:ElementMap*/) {
+      var _this5 = this;
 
       return function () {
-        console.log(chain);
-        _this4.elementMap = _this4.mergeElementMaps(_this4.elementMap, chain);
-        _this4.requestTick();
+        _this5.elementMap = _this5.mergeElementMaps(_this5.elementMap, chain);
+        _this5.requestTick();
       };
@@ -277,7 +315,7 @@ }
     value: function step() {
-      var _this5 = this;
+      var _this6 = this;
 
       var somethingChanged = false;
       this.elementMap.forEach(function (element) {
-        if (element.step(_this5.timescale)) {
+        if (element.step(_this6.timescale)) {
           somethingChanged = true;
@@ -291,2 +329,4 @@ }
   return Animar;
-})();
+})();
+
+module.exports = Animar;

lib/animation.js

@@ -1,9 +0,16 @@
-"use strict";
+'use strict';
 
 var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-module.exports = (function () {
-  function Animation(currentIteration, startValue, changeInValue, totalIterations, easingFunction, loop, delay, wait) {
+/* @flow */
+/*:: import type { ChainOptions } from './animar';*/
+
+var Animation = (function () {
+  function Animation(currentIteration /*:number*/, startValue /*:number*/, changeInValue /*:number*/, totalIterations /*:number*/, easingFunction /*:Function*/, loop /*:boolean*/, delay /*:number*/, wait /*:number*/) {
     _classCallCheck(this, Animation);
@@ -16,3 +23,3 @@
     this.easingFunction = easingFunction;
-    this.loop = loop;
+    this.looping = loop;
     this.delay = delay;
@@ -23,7 +30,7 @@ this.wait = wait;
   _createClass(Animation, [{
-    key: "step",
-    value: function step(timescale) {
+    key: 'step',
+    value: function step(timescale /*:number*/) {
       if (this.currentIteration < this.totalIterations + this.wait) {
         this.currentIteration += timescale;
-      } else if (this.loop) {
+      } else if (this.looping) {
         this.currentIteration = 0 - this.delay;
@@ -35,5 +42,13 @@ } else {
     }
+  }, {
+    key: 'loop',
+    value: function loop(chainOptions /*:ChainOptions*/) {
+      this.looping = true;
+      this.wait = chainOptions.totalDuration - this.delay - this.totalIterations;
+    }
   }]);
 
   return Animation;
-})();
+})();
+
+exports.default = Animation;

lib/attribute.js

@@ -5,2 +5,6 @@ 'use strict';
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
 var _helpers = require('./helpers');
@@ -10,4 +14,8 @@
 
-module.exports = (function () {
-  function Attribute(name, model) {
+/* @flow */
+/*:: import type Animation from './animation';*/
+/*:: import type { ChainOptions } from './animar';*/
+
+var Attribute = (function () {
+  function Attribute(name /*:string*/, model /*:number*/) {
     _classCallCheck(this, Attribute);
@@ -22,3 +30,3 @@
     key: 'addAnimation',
-    value: function addAnimation(animation) {
+    value: function addAnimation(animation /*:Animation*/) {
       this.animations.push(animation);
@@ -28,3 +36,3 @@ }
     key: 'merge',
-    value: function merge(target) {
+    value: function merge(target /*:Attribute*/) {
       var newAttribute = new Attribute(target.name, target.model);
@@ -36,5 +44,5 @@ newAttribute.animations = this.animations.concat(target.animations);
     key: 'forEachAnimation',
-    value: function forEachAnimation(callback) {
+    value: function forEachAnimation(callback /*:(animation:?Animation) => ?Animation*/) {
       this.animations = this.animations.map(callback).filter(function (x) {
-        return typeof x !== 'undefined';
+        return x != null;
       });
@@ -44,3 +52,3 @@ }
     key: 'step',
-    value: function step(timescale) {
+    value: function step(timescale /*:number*/) {
       var somethingChanged = false;
@@ -54,3 +62,3 @@
       }).filter(function (x) {
-        return typeof x !== 'undefined';
+        return x != null;
       });
@@ -62,3 +70,3 @@
     key: 'render',
-    value: function render(domElement) {
+    value: function render(domElement /*:HTMLElement*/) {
       var transformValue = '';
@@ -70,6 +78,4 @@ var targetValue = String(this.model + (0, _helpers.calculateAnimationValue)(this.animations));
 
-      var unit = pxRegex.test(this.name) ? 'px' : degRegex.test(this.name) ? 'deg' : '';
+      targetValue += pxRegex.test(this.name) ? 'px' : degRegex.test(this.name) ? 'deg' : '';
 
-      targetValue += unit;
-
       if (_helpers.TRANSFORM_ATTRIBUTES.indexOf(this.name) !== -1) {
@@ -83,5 +89,16 @@ transformValue += this.name + '(' + targetValue + ') ';
     }
+  }, {
+    key: 'loop',
+    value: function loop(chainOptions /*:ChainOptions*/) {
+      this.animations.forEach(function (animation) {
+        if (animation != null) {
+          animation.loop(chainOptions);
+        }
+      });
+    }
   }]);
 
   return Attribute;
-})();
+})();
+
+exports.default = Attribute;

lib/element.js

@@ -5,2 +5,6 @@ 'use strict';
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
 var _helpers = require('./helpers');
@@ -10,4 +14,8 @@
 
-module.exports = (function () {
-  function Element(element) {
+/* @flow */
+/*:: import type Attribute from './attribute';*/
+/*:: import type { ChainOptions } from './animar';*/
+
+var Element = (function () {
+  function Element(element /*:HTMLElement*/) {
     _classCallCheck(this, Element);
@@ -37,3 +45,3 @@
     key: 'merge',
-    value: function merge(target) {
+    value: function merge(target /*:Element*/) {
       var mergedElement = new Element(this.domElement);
@@ -44,4 +52,6 @@ mergedElement.attributes = new Map(this.attributes);
 
-        if (mergedElement.attributes.has(attrName)) {
-          mergedAttribute = mergedElement.attributes.get(attrName).merge(attr);
+        // TODO: Replace existence logic with hasAttribute once FlowType has fixed its bug
+        var existingAttribute = mergedElement.attributes.get(attrName);
+        if (existingAttribute != null) {
+          mergedAttribute = existingAttribute.merge(attr);
         } else {
@@ -58,15 +68,8 @@ mergedAttribute = attr;
     key: 'addAttribute',
-    value: function addAttribute(attrName, attribute) {
+    value: function addAttribute(attrName /*:string*/, attribute /*:Attribute*/) {
       this.attributes.set(attrName, attribute);
     }
   }, {
-    key: 'forEachAnimationInAttribute',
-    value: function forEachAnimationInAttribute(callback) {
-      this.attributes.forEach(function (attribute) {
-        attribute.forEachAnimation(callback);
-      });
-    }
-  }, {
     key: 'hasAttribute',
-    value: function hasAttribute(attributeName) {
+    value: function hasAttribute(attributeName /*:string*/) {
       return this.attributes.has(attributeName);
@@ -76,8 +79,18 @@ }
     key: 'getModelFromAttribute',
-    value: function getModelFromAttribute(attributeName) {
-      return this.attributes.get(attributeName).model;
+    value: function getModelFromAttribute(attributeName /*:string*/) {
+      var result = null;
+
+      // TODO: Replace existence logic with hasAttribute once FlowType has fixed its bug
+      var attribute = this.attributes.get(attributeName);
+      if (attribute != null) {
+        result = attribute.model;
+      } else {
+        throw 'No such attribute ' + attributeName;
+      }
+
+      return result;
     }
   }, {
     key: 'step',
-    value: function step(timescale) {
+    value: function step(timescale /*:number*/) {
       var somethingChanged = false;
@@ -91,5 +104,14 @@ this.attributes.forEach(function (attribute) {
     }
+  }, {
+    key: 'loop',
+    value: function loop(chainOptions /*:ChainOptions*/) {
+      this.attributes.forEach(function (attribute) {
+        attribute.loop(chainOptions);
+      });
+    }
   }]);
 
   return Element;
-})();
+})();
+
+exports.default = Element;

lib/helpers.js

 'use strict';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getTransformMatrix = getTransformMatrix;
-exports.getTransform = getTransform;
-exports.getOpacity = getOpacity;
-exports.setTransform = setTransform;
-exports.applyStyle = applyStyle;
-exports.calculateAnimationValue = calculateAnimationValue;
-exports.getStartValue = getStartValue;
-
+/* @flow */
+/* global __DEV__ */
 /// <reference path="../typings/tsd.d.ts"/>
+/*:: import type Animation from './animation';*/
+/*:: import type {AttributesOptions} from './animar';*/
 
-var TRANSFORM_ATTRIBUTES = exports.TRANSFORM_ATTRIBUTES = ['translateX', 'translateY', 'translateZ', 'scale', 'scaleX', 'scaleY', 'rotate', 'rotateX', 'rotateY', 'rotateZ'];
+var TRANSFORM_ATTRIBUTES = ['translateX', 'translateY', 'translateZ', 'scale', 'scaleX', 'scaleY', 'rotate', 'rotateX', 'rotateY', 'rotateZ'];
 
-function getTransformMatrix(element) {
-  var computedStyle = window.getComputedStyle(element, null);
-  /* istanbul ignore next */
-  var transformString = computedStyle.getPropertyValue('-webkit-transform') || computedStyle.getPropertyValue('-moz-transform') || computedStyle.getPropertyValue('-ms-transform') || computedStyle.getPropertyValue('-o-transform') || computedStyle.getPropertyValue('transform') || 'none';
-  if (transformString === 'none') {
-    transformString = 'matrix(1, 0, 0, 1, 0, 0)';
-  }
-  var values = transformString.split('(')[1].split(')')[0].split(',');
-  var floatValues = values.map(function (x) {
-    return parseFloat(x, 10);
-  });
-  return floatValues;
-}
+if (__DEV__) {
+  var getTransformMatrix = function getTransformMatrix(element /*:HTMLElement*/) /*:Array<number>*/ {
+    var computedStyle = window.getComputedStyle(element, null);
+    /* istanbul ignore next */
+    var transformString = computedStyle.getPropertyValue('-webkit-transform') || computedStyle.getPropertyValue('-moz-transform') || computedStyle.getPropertyValue('-ms-transform') || computedStyle.getPropertyValue('-o-transform') || computedStyle.getPropertyValue('transform') || 'none';
+    if (transformString === 'none') {
+      transformString = 'matrix(1, 0, 0, 1, 0, 0)';
+    }
+    var values = transformString.split('(')[1].split(')')[0].split(',');
+    return values.map(function (x) {
+      return parseFloat(x, 10);
+    });
+  };
 
-function getTransform(element, attribute) {
-  var values = this.getTransformMatrix(element);
-  switch (attribute) {
-    case 'translateX':
-      return values[4];
-    case 'translateY':
-      return values[5];
-    case 'scaleX':
-      return Math.sqrt(Math.pow(values[0], 2) + Math.pow(values[1], 2));
-    case 'scaleY':
-      return Math.sqrt(Math.pow(values[2], 2) + Math.pow(values[3], 2));
-    case 'rotate':
-      return Math.round(Math.atan2(values[1], values[0]) * (180 / Math.PI));
-    default:
-      throw new Error('invalid/unspported transform attribute: ' + attribute);
-  }
-}
+  var getTransform = function getTransform(element /*:HTMLElement*/, attribute /*:string*/) /*:number*/ {
+    var values = this.getTransformMatrix(element);
+    switch (attribute) {
+      case 'translateX':
+        return values[4];
+      case 'translateY':
+        return values[5];
+      case 'scaleX':
+        return Math.sqrt(Math.pow(values[0], 2) + Math.pow(values[1], 2));
+      case 'scaleY':
+        return Math.sqrt(Math.pow(values[2], 2) + Math.pow(values[3], 2));
+      case 'rotate':
+        return Math.round(Math.atan2(values[1], values[0]) * (180 / Math.PI));
+      default:
+        throw new Error('invalid/unsupported transform attribute: ' + attribute);
+    }
+  };
 
-function getOpacity(element) {
-  var computedStyle = window.getComputedStyle(element, null);
-  return parseFloat(computedStyle.getPropertyValue('opacity'));
+  var getOpacity = function getOpacity(element /*:HTMLElement*/) /*:number*/ {
+    var computedStyle = window.getComputedStyle(element, null);
+    return parseFloat(computedStyle.getPropertyValue('opacity'));
+  };
+
+  var getStartValue = function getStartValue(element /*:HTMLElement*/, attribute /*:string*/) /*:number*/ {
+    var result = 0;
+
+    if (TRANSFORM_ATTRIBUTES.indexOf(attribute) !== -1) {
+      result = this.getTransform(element, attribute);
+    } else {
+      switch (attribute) {
+        case 'opacity':
+          result = this.getOpacity(element);
+          break;
+        default:
+          throw new Error('invalid/unsupported attribute: ' + attribute);
+      }
+    }
+
+    return result;
+  };
+
+  var validateAddParameters = function validateAddParameters(element /*:HTMLElement*/, attributes /*, options:AnimationOptions */ /*:AttributesOptions*/) {
+    if (element == null) {
+      throw 'Missing or null parameter: element';
+    }
+    if (!(element instanceof HTMLElement)) {
+      throw "Parameter 'element' should be of type HTMLElement";
+    }
+    if (attributes == null) {
+      throw 'Missing or null parameter: attributes';
+    }
+    if (Object.prototype.toString.call(attributes) !== '[object Object]') {
+      throw "Parameter 'attributes' should be of type Object";
+    }
+    // TODO: Validate attributes contents
+    // TODO: Validate option types
+  };
+
+  module.exports.getTransformMatrix = getTransformMatrix;
+  module.exports.getTransform = getTransform;
+  module.exports.getOpacity = getOpacity;
+  module.exports.getStartValue = getStartValue;
+  module.exports.validateAddParameters = validateAddParameters;
 }
 
-function setTransform(element, transformString) {
+var setTransform = function setTransform(element /*:HTMLElement*/, transformString /*:string*/) /*:HTMLElement*/ {
   element.style.transform = transformString;
   return element;
-}
+};
 
-function applyStyle(element, attributeName, attributeValue) {
+var applyStyle = function applyStyle(element /*:HTMLElement*/, attributeName /*:string*/, attributeValue /*:string*/) {
   switch (attributeName) {
@@ -74,37 +109,26 @@ case 'transform':
   }
-}
+};
 
-function calculateAnimationValue(animations) {
+var calculateAnimationValue = function calculateAnimationValue(animations /*:Array<?Animation>*/) /*:number*/ {
   var result = 0;
 
   animations.forEach(function (animation) {
-    var currentIteration = animation.currentIteration;
-    if (currentIteration < 0) {
-      currentIteration = 0;
+    if (animation != null) {
+      var currentIteration = animation.currentIteration;
+      if (currentIteration < 0) {
+        currentIteration = 0;
+      }
+      if (currentIteration >= animation.totalIterations) {
+        currentIteration = animation.totalIterations;
+      }
+      result += animation.easingFunction(currentIteration, animation.startValue, animation.changeInValue, animation.totalIterations);
     }
-    if (currentIteration >= animation.totalIterations) {
-      currentIteration = animation.totalIterations;
-    }
-    result += animation.easingFunction(currentIteration, animation.startValue, animation.changeInValue, animation.totalIterations);
   });
 
   return result;
-}
+};
 
-function getStartValue(element, attribute) {
-  var result = 0;
-
-  if (TRANSFORM_ATTRIBUTES.indexOf(attribute) !== -1) {
-    result = this.getTransform(element, attribute);
-  } else {
-    switch (attribute) {
-      case 'opacity':
-        result = this.getOpacity(element);
-        break;
-      default:
-        throw new Error('invalid/unsupported attribute: ' + attribute);
-    }
-  }
-
-  return result;
-}
+module.exports.setTransform = setTransform;
+module.exports.applyStyle = applyStyle;
+module.exports.calculateAnimationValue = calculateAnimationValue;
+module.exports.TRANSFORM_ATTRIBUTES = TRANSFORM_ATTRIBUTES;

package.json

 {
   "name": "animar",
-  "version": "0.5.4",
+  "version": "0.6.0",
   "description": "a modern, focused, flexible javascript animation library.",
@@ -28,13 +28,13 @@ "keywords": [
     "clean-coverage": "rimraf coverage",
+    "clean-lib": "rimraf lib",
     "build": "./scripts/build.sh",
     "prebuild": "npm run clean",
-    "lint": "eslint lib",
+    "lint": "eslint src/** test/**",
     "typecheck": "./node_modules/.bin/flow check",
-    "test": "./node_modules/babel-cli/bin/babel-node.js ./node_modules/.bin/isparta cover ./node_modules/.bin/_mocha",
+    "test": "NODE_ENV=test ./node_modules/.bin/babel-node ./node_modules/.bin/isparta cover test-scripts/node-test.js",
     "pretest": "npm run clean-coverage && npm run lint && npm run typecheck",
-    "prepublish": "./node_modules/.bin/babel ./src --out-dir ./lib"
+    "dev-test": "NODE_ENV=test ./node_modules/.bin/testem",
+    "ci-test": "NODE_ENV=test ./node_modules/.bin/testem ci",
+    "prepublish": "npm run clean-lib && ./node_modules/.bin/babel ./src --out-dir ./lib"
   },
-  "directories": {
-    "lib": "lib"
-  },
   "main": "lib/animar.js",
@@ -46,11 +46,13 @@ "devDependencies": {
     "babel-loader": "^6.2.0",
+    "babel-plugin-flow-comments": "^6.3.19",
+    "babel-plugin-rewire": "^1.0.0-beta-2",
     "babel-plugin-transform-class-properties": "^6.2.2",
     "babel-plugin-transform-es2015-modules-commonjs": "^6.2.0",
-    "babel-plugin-transform-flow-strip-types": "^6.1.18",
     "babel-preset-es2015": "^6.1.18",
     "chai": "^3.4.1",
     "compression-webpack-plugin": "^0.2.0",
+    "core-js": "^1.2.6",
     "eslint": "^1.10.1",
-    "eslint-plugin-flow-vars": "0.0.1",
-    "flow-bin": "^0.18.1",
+    "eslint-plugin-flow-vars": "^0.1.0",
+    "flow-bin": "^0.19.1",
     "isparta": "^4.0.0",
@@ -60,4 +62,7 @@ "jsdom": "^7.0.2",
     "mocha": "^2.3.4",
+    "rewire": "^2.5.1",
     "rimraf": "^2.3.1",
-    "sinon": "^1.15.4",
+    "saucie": "^1.3.1",
+    "sinon": "^2.0.0-pre",
+    "testem": "^0.9.11",
     "travis-weigh-in": "^1.0.2",
@@ -64,0 +69,0 @@ "tsd": "^0.6.3",

README.md

@@ -1,3 +0,9 @@
-[![Build Status](https://img.shields.io/travis/vincentriemer/animar/master.svg?style=flat)](https://travis-ci.org/vincentriemer/animar) [![Dependency Status](https://img.shields.io/david/vincentriemer/animar.svg?style=flat)](https://david-dm.org/vincentriemer/animar) [![devDependency Status](https://img.shields.io/david/dev/vincentriemer/animar.svg?style=flat)](https://david-dm.org/vincentriemer/animar#info=devDependencies) [![npm version](https://badge.fury.io/js/animar.svg)](https://badge.fury.io/js/animar) [![Test Coverage](https://img.shields.io/codeclimate/coverage/github/vincentriemer/animar.svg?style=flat)](https://codeclimate.com/github/vincentriemer/animar)
+[![Build Status](https://img.shields.io/travis/vincentriemer/animar/master.svg?style=flat)](https://travis-ci.org/vincentriemer/animar) [![npm version](https://badge.fury.io/js/animar.svg)](https://badge.fury.io/js/animar)
 
+[![bitHound Dependencies](https://www.bithound.io/github/vincentriemer/animar/badges/dependencies.svg)](https://www.bithound.io/github/vincentriemer/animar/master/dependencies/npm) [![bitHound Dev Dependencies](https://www.bithound.io/github/vincentriemer/animar/badges/devDependencies.svg)](https://www.bithound.io/github/vincentriemer/animar/master/dependencies/npm)
+
+[![bitHound Overall Score](https://www.bithound.io/github/vincentriemer/animar/badges/score.svg)](https://www.bithound.io/github/vincentriemer/animar) [![Test Coverage](https://img.shields.io/codeclimate/coverage/github/vincentriemer/animar.svg?style=flat)](https://codeclimate.com/github/vincentriemer/animar) [![Issue Count](https://codeclimate.com/github/vincentriemer/animar/badges/issue_count.svg)](https://codeclimate.com/github/vincentriemer/animar)
+
+[![Sauce Test Status](https://saucelabs.com/browser-matrix/vincentriemer.svg)](https://saucelabs.com/u/vincentriemer)
+
 # Animar
@@ -4,0 +10,0 @@

No alert changes

Improved metrics

Total package byte prevSize

29988

increased by4.57%

Number of lines in readme file

26

increased by30%

Worsened metrics

Dev dependency count

27

increased by22.73%

Number of package files

8

decreased by-27.27%

Lines of code

605

decreased by-11.94%

No dependency changes