From 85663cdaf0935dbb8e1347e4c5441ee033abaea8 Mon Sep 17 00:00:00 2001 From: Rob Eisenberg Date: Fri, 1 May 2015 01:32:50 -0400 Subject: [PATCH] chore(all): prepare release 0.2.0 --- bower.json | 4 +- config.js | 66 ++++--- dist/amd/animator.js | 387 ++++++++++++++++++-------------------- dist/amd/index.js | 15 +- dist/commonjs/animator.js | 387 ++++++++++++++++++-------------------- dist/commonjs/index.js | 15 +- dist/es6/index.js | 2 +- dist/system/animator.js | 385 ++++++++++++++++++------------------- dist/system/index.js | 4 +- doc/CHANGELOG.md | 13 ++ package.json | 9 +- 11 files changed, 632 insertions(+), 655 deletions(-) diff --git a/bower.json b/bower.json index 82f46b2..5bd6e03 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "aurelia-animator-css", - "version": "0.1.0", + "version": "0.2.0", "description": "An implementation of the abstract Animator interface from templating which enables css-based animations.", "keywords": [ "aurelia", @@ -18,6 +18,6 @@ "url": "https://github.com/aurelia/animator-css" }, "dependencies": { - "aurelia-templating": "^0.10.3" + "aurelia-templating": "^0.11.0" } } diff --git a/config.js b/config.js index 2f1a030..91c3a36 100644 --- a/config.js +++ b/config.js @@ -1,4 +1,11 @@ System.config({ + "transpiler": "babel", + "babelOptions": { + "optional": [ + "runtime", + "es7.decorators" + ] + }, "paths": { "*": "*.js", "aurelia-animator-css/*": "dist\\system/*.js", @@ -9,37 +16,46 @@ System.config({ System.config({ "map": { - "aurelia-templating": "github:aurelia/templating@0.10.3", - "github:aurelia/binding@0.5.0": { - "aurelia-dependency-injection": "github:aurelia/dependency-injection@0.6.0", - "aurelia-metadata": "github:aurelia/metadata@0.4.0", - "aurelia-task-queue": "github:aurelia/task-queue@0.3.0", - "core-js": "github:zloirock/core-js@0.8.2" + "aurelia-templating": "github:aurelia/templating@0.11.0", + "babel": "npm:babel-core@5.2.2", + "babel-runtime": "npm:babel-runtime@5.2.2", + "core-js": "npm:core-js@0.9.5", + "github:aurelia/binding@0.6.0": { + "aurelia-dependency-injection": "github:aurelia/dependency-injection@0.7.0", + "aurelia-metadata": "github:aurelia/metadata@0.5.0", + "aurelia-task-queue": "github:aurelia/task-queue@0.4.0", + "core-js": "npm:core-js@0.9.5" }, - "github:aurelia/dependency-injection@0.6.0": { - "aurelia-logging": "github:aurelia/logging@0.3.0", - "aurelia-metadata": "github:aurelia/metadata@0.4.0", - "core-js": "github:zloirock/core-js@0.8.2" + "github:aurelia/dependency-injection@0.7.0": { + "aurelia-logging": "github:aurelia/logging@0.4.0", + "aurelia-metadata": "github:aurelia/metadata@0.5.0", + "core-js": "npm:core-js@0.9.5" }, - "github:aurelia/loader@0.5.0": { + "github:aurelia/loader@0.6.0": { "aurelia-html-template-element": "github:aurelia/html-template-element@0.2.0", - "aurelia-path": "github:aurelia/path@0.5.0", - "core-js": "github:zloirock/core-js@0.8.2", - "webcomponentsjs": "github:webcomponents/webcomponentsjs@0.5.5" + "aurelia-path": "github:aurelia/path@0.6.0", + "core-js": "npm:core-js@0.9.5", + "webcomponentsjs": "github:webcomponents/webcomponentsjs@0.6.1" }, - "github:aurelia/metadata@0.4.0": { - "core-js": "github:zloirock/core-js@0.8.2" + "github:aurelia/metadata@0.5.0": { + "core-js": "npm:core-js@0.9.5" }, - "github:aurelia/templating@0.10.3": { - "aurelia-binding": "github:aurelia/binding@0.5.0", - "aurelia-dependency-injection": "github:aurelia/dependency-injection@0.6.0", + "github:aurelia/templating@0.11.0": { + "aurelia-binding": "github:aurelia/binding@0.6.0", + "aurelia-dependency-injection": "github:aurelia/dependency-injection@0.7.0", "aurelia-html-template-element": "github:aurelia/html-template-element@0.2.0", - "aurelia-loader": "github:aurelia/loader@0.5.0", - "aurelia-logging": "github:aurelia/logging@0.3.0", - "aurelia-metadata": "github:aurelia/metadata@0.4.0", - "aurelia-path": "github:aurelia/path@0.5.0", - "aurelia-task-queue": "github:aurelia/task-queue@0.3.0", - "core-js": "github:zloirock/core-js@0.8.2" + "aurelia-loader": "github:aurelia/loader@0.6.0", + "aurelia-logging": "github:aurelia/logging@0.4.0", + "aurelia-metadata": "github:aurelia/metadata@0.5.0", + "aurelia-path": "github:aurelia/path@0.6.0", + "aurelia-task-queue": "github:aurelia/task-queue@0.4.0", + "core-js": "npm:core-js@0.9.5" + }, + "github:jspm/nodelibs-process@0.1.1": { + "process": "npm:process@0.10.1" + }, + "npm:core-js@0.9.5": { + "process": "github:jspm/nodelibs-process@0.1.1" } } }); diff --git a/dist/amd/animator.js b/dist/amd/animator.js index f0474d6..a7a7298 100644 --- a/dist/amd/animator.js +++ b/dist/amd/animator.js @@ -3,11 +3,7 @@ define(['exports'], function (exports) { var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }; - 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 - }); + exports.__esModule = true; var CssAnimator = (function () { function CssAnimator() { @@ -16,270 +12,259 @@ define(['exports'], function (exports) { this.animationStack = []; } - _createClass(CssAnimator, [{ - key: 'addMultipleEventListener', - value: function addMultipleEventListener(el, s, fn) { - var evts = s.split(' '), - i, - ii; + CssAnimator.prototype.addMultipleEventListener = function addMultipleEventListener(el, s, fn) { + var evts = s.split(' '), + i, + ii; - for (i = 0, ii = evts.length; i < ii; ++i) { - el.addEventListener(evts[i], fn, false); - } - } - }, { - key: 'addAnimationToStack', - value: function addAnimationToStack(animId) { - if (this.animationStack.indexOf(animId) < 0) { - this.animationStack.push(animId); - } + for (i = 0, ii = evts.length; i < ii; ++i) { + el.addEventListener(evts[i], fn, false); } - }, { - key: 'removeAnimationFromStack', - value: function removeAnimationFromStack(animId) { - var idx = this.animationStack.indexOf(animId); - if (idx > -1) { - this.animationStack.splice(idx, 1); - } + }; + + CssAnimator.prototype.addAnimationToStack = function addAnimationToStack(animId) { + if (this.animationStack.indexOf(animId) < 0) { + this.animationStack.push(animId); } - }, { - key: 'getElementAnimationDelay', - value: function getElementAnimationDelay(element) { - var styl = window.getComputedStyle(element); - var prop, delay; - - if (styl.getPropertyValue('animation-delay')) { - prop = 'animation-delay'; - } else if (styl.getPropertyValue('-webkit-animation-delay')) { - prop = '-webkit-animation-delay'; - } else if (styl.getPropertyValue('-moz-animation-delay')) { - prop = '-moz-animation-delay'; - } else { - return 0; - } - delay = styl.getPropertyValue(prop); - delay = Number(delay.replace(/[^\d\.]/g, '')); + }; - return delay * 1000; + CssAnimator.prototype.removeAnimationFromStack = function removeAnimationFromStack(animId) { + var idx = this.animationStack.indexOf(animId); + if (idx > -1) { + this.animationStack.splice(idx, 1); } - }, { - key: 'move', - value: function move() { - return Promise.resolve(false); + }; + + CssAnimator.prototype.getElementAnimationDelay = function getElementAnimationDelay(element) { + var styl = window.getComputedStyle(element); + var prop, delay; + + if (styl.getPropertyValue('animation-delay')) { + prop = 'animation-delay'; + } else if (styl.getPropertyValue('-webkit-animation-delay')) { + prop = '-webkit-animation-delay'; + } else if (styl.getPropertyValue('-moz-animation-delay')) { + prop = '-moz-animation-delay'; + } else { + return 0; } - }, { - key: 'enter', - value: function enter(element) { - var _this = this; + delay = styl.getPropertyValue(prop); + delay = Number(delay.replace(/[^\d\.]/g, '')); + + return delay * 1000; + }; - return new Promise(function (resolve, reject) { - var animId = element.toString() + Math.random(), - classList = element.classList; + CssAnimator.prototype.move = function move() { + return Promise.resolve(false); + }; - classList.add('au-enter'); + CssAnimator.prototype.enter = function enter(element) { + var _this = this; - var animStart; - _this.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + return new Promise(function (resolve, reject) { + var animId = element.toString() + Math.random(), + classList = element.classList; - _this.addAnimationToStack(animId); + classList.add('au-enter'); - var animEnd; - _this.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + var animStart; + _this.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - classList.remove('au-enter-active'); - classList.remove('au-enter'); + _this.addAnimationToStack(animId); - _this.removeAnimationFromStack(animId); + var animEnd; + _this.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + classList.remove('au-enter-active'); + classList.remove('au-enter'); - resolve(true); - }, false); + _this.removeAnimationFromStack(animId); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + + resolve(true); }, false); - var parent = element.parentElement, - delay = 0; + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - if (parent.classList.contains('au-stagger')) { - var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); - delay = _this.getElementAnimationDelay(parent) * elemPos; + var parent = element.parentElement, + delay = 0; - setTimeout(function () { - classList.add('au-enter-active'); - }, delay); - } else { - classList.add('au-enter-active'); - } + if (parent.classList.contains('au-stagger')) { + var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); + delay = _this.getElementAnimationDelay(parent) * elemPos; setTimeout(function () { - if (_this.animationStack.indexOf(animId) < 0) { - classList.remove('au-enter-active'); - classList.remove('au-enter'); - - resolve(false); - } - }, _this.getElementAnimationDelay(element) + 400 + delay); - }); - } - }, { - key: 'leave', - value: function leave(element) { - var _this2 = this; + classList.add('au-enter-active'); + }, delay); + } else { + classList.add('au-enter-active'); + } - return new Promise(function (resolve, reject) { - var animId = element.toString() + Math.random(), - classList = element.classList; + setTimeout(function () { + if (_this.animationStack.indexOf(animId) < 0) { + classList.remove('au-enter-active'); + classList.remove('au-enter'); - classList.add('au-leave'); + resolve(false); + } + }, _this.getElementAnimationDelay(element) + 400 + delay); + }); + }; + + CssAnimator.prototype.leave = function leave(element) { + var _this2 = this; - var animStart; - _this2.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + return new Promise(function (resolve, reject) { + var animId = element.toString() + Math.random(), + classList = element.classList; - _this2.addAnimationToStack(animId); + classList.add('au-leave'); - var animEnd; - _this2.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + var animStart; + _this2.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - classList.remove('au-leave-active'); - classList.remove('au-leave'); + _this2.addAnimationToStack(animId); - _this2.removeAnimationFromStack(animId); + var animEnd; + _this2.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + classList.remove('au-leave-active'); + classList.remove('au-leave'); - resolve(true); - }, false); + _this2.removeAnimationFromStack(animId); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + + resolve(true); }, false); - var parent = element.parentElement, - delay = 0; + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - if (parent.classList.contains('au-stagger')) { - var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); - delay = _this2.getElementAnimationDelay(parent) * elemPos; + var parent = element.parentElement, + delay = 0; - setTimeout(function () { - classList.add('au-leave-active'); - }, delay); - } else { - classList.add('au-leave-active'); - } + if (parent.classList.contains('au-stagger')) { + var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); + delay = _this2.getElementAnimationDelay(parent) * elemPos; setTimeout(function () { - if (_this2.animationStack.indexOf(animId) < 0) { - classList.remove('au-leave-active'); - classList.remove('au-leave'); - - resolve(false); - } - }, _this2.getElementAnimationDelay(element) + 400 + delay); - }); - } - }, { - key: 'removeClass', - value: function removeClass(element, className) { - var _this3 = this; + classList.add('au-leave-active'); + }, delay); + } else { + classList.add('au-leave-active'); + } - return new Promise(function (resolve, reject) { - var classList = element.classList; + setTimeout(function () { + if (_this2.animationStack.indexOf(animId) < 0) { + classList.remove('au-leave-active'); + classList.remove('au-leave'); - if (!classList.contains(className)) { resolve(false); - return; } + }, _this2.getElementAnimationDelay(element) + 400 + delay); + }); + }; - var animId = element.toString() + className + Math.random(); + CssAnimator.prototype.removeClass = function removeClass(element, className) { + var _this3 = this; - classList.remove(className); + return new Promise(function (resolve, reject) { + var classList = element.classList; - var animStart; - _this3.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + if (!classList.contains(className)) { + resolve(false); + return; + } + + var animId = element.toString() + className + Math.random(); + + classList.remove(className); - _this3.addAnimationToStack(animId); + var animStart; + _this3.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - var animEnd; - _this3.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + _this3.addAnimationToStack(animId); - classList.remove(className + '-remove'); + var animEnd; + _this3.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - _this3.removeAnimationFromStack(animId); + classList.remove(className + '-remove'); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + _this3.removeAnimationFromStack(animId); - resolve(true); - }, false); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + resolve(true); }, false); - classList.add(className + '-remove'); + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - setTimeout(function () { - if (_this3.animationStack.indexOf(animId) < 0) { - classList.remove(className + '-remove'); - classList.remove(className); - - resolve(false); - } - }, _this3.getElementAnimationDelay(element) + 400); - }); - } - }, { - key: 'addClass', - value: function addClass(element, className) { - var _this4 = this; + classList.add(className + '-remove'); - return new Promise(function (resolve, reject) { - var animId = element.toString() + className + Math.random(), - classList = element.classList; + setTimeout(function () { + if (_this3.animationStack.indexOf(animId) < 0) { + classList.remove(className + '-remove'); + classList.remove(className); - var animStart; - _this4.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + resolve(false); + } + }, _this3.getElementAnimationDelay(element) + 400); + }); + }; + + CssAnimator.prototype.addClass = function addClass(element, className) { + var _this4 = this; - _this4.addAnimationToStack(animId); + return new Promise(function (resolve, reject) { + var animId = element.toString() + className + Math.random(), + classList = element.classList; - var animEnd; - _this4.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + var animStart; + _this4.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - classList.add(className); + _this4.addAnimationToStack(animId); - classList.remove(className + '-add'); + var animEnd; + _this4.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - _this4.removeAnimationFromStack(animId); + classList.add(className); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + classList.remove(className + '-add'); - resolve(true); - }, false); + _this4.removeAnimationFromStack(animId); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + + resolve(true); }, false); - classList.add(className + '-add'); + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - setTimeout(function () { - if (_this4.animationStack.indexOf(animId) < 0) { - classList.remove(className + '-add'); - classList.add(className); - - resolve(false); - } - }, _this4.getElementAnimationDelay(element) + 400); - }); - } - }]); + classList.add(className + '-add'); + + setTimeout(function () { + if (_this4.animationStack.indexOf(animId) < 0) { + classList.remove(className + '-add'); + classList.add(className); + + resolve(false); + } + }, _this4.getElementAnimationDelay(element) + 400); + }); + }; return CssAnimator; })(); diff --git a/dist/amd/index.js b/dist/amd/index.js index 1171a0d..6e0b9e6 100644 --- a/dist/amd/index.js +++ b/dist/amd/index.js @@ -1,18 +1,11 @@ define(['exports', 'aurelia-templating', './animator'], function (exports, _aureliaTemplating, _animator) { 'use strict'; - Object.defineProperty(exports, '__esModule', { - value: true - }); - exports.install = install; - Object.defineProperty(exports, 'CssAnimator', { - enumerable: true, - get: function get() { - return _animator.CssAnimator; - } - }); + exports.__esModule = true; + exports.configure = configure; + exports.CssAnimator = _animator.CssAnimator; - function install(aurelia) { + function configure(aurelia) { _aureliaTemplating.Animator.configureDefault(aurelia.container, new _animator.CssAnimator()); } }); \ No newline at end of file diff --git a/dist/commonjs/animator.js b/dist/commonjs/animator.js index fc7811e..d75a7e6 100644 --- a/dist/commonjs/animator.js +++ b/dist/commonjs/animator.js @@ -2,11 +2,7 @@ var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }; -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 -}); +exports.__esModule = true; var CssAnimator = (function () { function CssAnimator() { @@ -15,270 +11,259 @@ var CssAnimator = (function () { this.animationStack = []; } - _createClass(CssAnimator, [{ - key: 'addMultipleEventListener', - value: function addMultipleEventListener(el, s, fn) { - var evts = s.split(' '), - i, - ii; + CssAnimator.prototype.addMultipleEventListener = function addMultipleEventListener(el, s, fn) { + var evts = s.split(' '), + i, + ii; - for (i = 0, ii = evts.length; i < ii; ++i) { - el.addEventListener(evts[i], fn, false); - } - } - }, { - key: 'addAnimationToStack', - value: function addAnimationToStack(animId) { - if (this.animationStack.indexOf(animId) < 0) { - this.animationStack.push(animId); - } + for (i = 0, ii = evts.length; i < ii; ++i) { + el.addEventListener(evts[i], fn, false); } - }, { - key: 'removeAnimationFromStack', - value: function removeAnimationFromStack(animId) { - var idx = this.animationStack.indexOf(animId); - if (idx > -1) { - this.animationStack.splice(idx, 1); - } + }; + + CssAnimator.prototype.addAnimationToStack = function addAnimationToStack(animId) { + if (this.animationStack.indexOf(animId) < 0) { + this.animationStack.push(animId); } - }, { - key: 'getElementAnimationDelay', - value: function getElementAnimationDelay(element) { - var styl = window.getComputedStyle(element); - var prop, delay; - - if (styl.getPropertyValue('animation-delay')) { - prop = 'animation-delay'; - } else if (styl.getPropertyValue('-webkit-animation-delay')) { - prop = '-webkit-animation-delay'; - } else if (styl.getPropertyValue('-moz-animation-delay')) { - prop = '-moz-animation-delay'; - } else { - return 0; - } - delay = styl.getPropertyValue(prop); - delay = Number(delay.replace(/[^\d\.]/g, '')); + }; - return delay * 1000; + CssAnimator.prototype.removeAnimationFromStack = function removeAnimationFromStack(animId) { + var idx = this.animationStack.indexOf(animId); + if (idx > -1) { + this.animationStack.splice(idx, 1); } - }, { - key: 'move', - value: function move() { - return Promise.resolve(false); + }; + + CssAnimator.prototype.getElementAnimationDelay = function getElementAnimationDelay(element) { + var styl = window.getComputedStyle(element); + var prop, delay; + + if (styl.getPropertyValue('animation-delay')) { + prop = 'animation-delay'; + } else if (styl.getPropertyValue('-webkit-animation-delay')) { + prop = '-webkit-animation-delay'; + } else if (styl.getPropertyValue('-moz-animation-delay')) { + prop = '-moz-animation-delay'; + } else { + return 0; } - }, { - key: 'enter', - value: function enter(element) { - var _this = this; + delay = styl.getPropertyValue(prop); + delay = Number(delay.replace(/[^\d\.]/g, '')); + + return delay * 1000; + }; - return new Promise(function (resolve, reject) { - var animId = element.toString() + Math.random(), - classList = element.classList; + CssAnimator.prototype.move = function move() { + return Promise.resolve(false); + }; - classList.add('au-enter'); + CssAnimator.prototype.enter = function enter(element) { + var _this = this; - var animStart; - _this.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + return new Promise(function (resolve, reject) { + var animId = element.toString() + Math.random(), + classList = element.classList; - _this.addAnimationToStack(animId); + classList.add('au-enter'); - var animEnd; - _this.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + var animStart; + _this.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - classList.remove('au-enter-active'); - classList.remove('au-enter'); + _this.addAnimationToStack(animId); - _this.removeAnimationFromStack(animId); + var animEnd; + _this.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + classList.remove('au-enter-active'); + classList.remove('au-enter'); - resolve(true); - }, false); + _this.removeAnimationFromStack(animId); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + + resolve(true); }, false); - var parent = element.parentElement, - delay = 0; + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - if (parent.classList.contains('au-stagger')) { - var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); - delay = _this.getElementAnimationDelay(parent) * elemPos; + var parent = element.parentElement, + delay = 0; - setTimeout(function () { - classList.add('au-enter-active'); - }, delay); - } else { - classList.add('au-enter-active'); - } + if (parent.classList.contains('au-stagger')) { + var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); + delay = _this.getElementAnimationDelay(parent) * elemPos; setTimeout(function () { - if (_this.animationStack.indexOf(animId) < 0) { - classList.remove('au-enter-active'); - classList.remove('au-enter'); - - resolve(false); - } - }, _this.getElementAnimationDelay(element) + 400 + delay); - }); - } - }, { - key: 'leave', - value: function leave(element) { - var _this2 = this; + classList.add('au-enter-active'); + }, delay); + } else { + classList.add('au-enter-active'); + } - return new Promise(function (resolve, reject) { - var animId = element.toString() + Math.random(), - classList = element.classList; + setTimeout(function () { + if (_this.animationStack.indexOf(animId) < 0) { + classList.remove('au-enter-active'); + classList.remove('au-enter'); - classList.add('au-leave'); + resolve(false); + } + }, _this.getElementAnimationDelay(element) + 400 + delay); + }); + }; + + CssAnimator.prototype.leave = function leave(element) { + var _this2 = this; - var animStart; - _this2.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + return new Promise(function (resolve, reject) { + var animId = element.toString() + Math.random(), + classList = element.classList; - _this2.addAnimationToStack(animId); + classList.add('au-leave'); - var animEnd; - _this2.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + var animStart; + _this2.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - classList.remove('au-leave-active'); - classList.remove('au-leave'); + _this2.addAnimationToStack(animId); - _this2.removeAnimationFromStack(animId); + var animEnd; + _this2.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + classList.remove('au-leave-active'); + classList.remove('au-leave'); - resolve(true); - }, false); + _this2.removeAnimationFromStack(animId); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + + resolve(true); }, false); - var parent = element.parentElement, - delay = 0; + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - if (parent.classList.contains('au-stagger')) { - var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); - delay = _this2.getElementAnimationDelay(parent) * elemPos; + var parent = element.parentElement, + delay = 0; - setTimeout(function () { - classList.add('au-leave-active'); - }, delay); - } else { - classList.add('au-leave-active'); - } + if (parent.classList.contains('au-stagger')) { + var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); + delay = _this2.getElementAnimationDelay(parent) * elemPos; setTimeout(function () { - if (_this2.animationStack.indexOf(animId) < 0) { - classList.remove('au-leave-active'); - classList.remove('au-leave'); - - resolve(false); - } - }, _this2.getElementAnimationDelay(element) + 400 + delay); - }); - } - }, { - key: 'removeClass', - value: function removeClass(element, className) { - var _this3 = this; + classList.add('au-leave-active'); + }, delay); + } else { + classList.add('au-leave-active'); + } - return new Promise(function (resolve, reject) { - var classList = element.classList; + setTimeout(function () { + if (_this2.animationStack.indexOf(animId) < 0) { + classList.remove('au-leave-active'); + classList.remove('au-leave'); - if (!classList.contains(className)) { resolve(false); - return; } + }, _this2.getElementAnimationDelay(element) + 400 + delay); + }); + }; - var animId = element.toString() + className + Math.random(); + CssAnimator.prototype.removeClass = function removeClass(element, className) { + var _this3 = this; - classList.remove(className); + return new Promise(function (resolve, reject) { + var classList = element.classList; - var animStart; - _this3.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + if (!classList.contains(className)) { + resolve(false); + return; + } + + var animId = element.toString() + className + Math.random(); + + classList.remove(className); - _this3.addAnimationToStack(animId); + var animStart; + _this3.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - var animEnd; - _this3.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + _this3.addAnimationToStack(animId); - classList.remove(className + '-remove'); + var animEnd; + _this3.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - _this3.removeAnimationFromStack(animId); + classList.remove(className + '-remove'); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + _this3.removeAnimationFromStack(animId); - resolve(true); - }, false); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + resolve(true); }, false); - classList.add(className + '-remove'); + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - setTimeout(function () { - if (_this3.animationStack.indexOf(animId) < 0) { - classList.remove(className + '-remove'); - classList.remove(className); - - resolve(false); - } - }, _this3.getElementAnimationDelay(element) + 400); - }); - } - }, { - key: 'addClass', - value: function addClass(element, className) { - var _this4 = this; + classList.add(className + '-remove'); - return new Promise(function (resolve, reject) { - var animId = element.toString() + className + Math.random(), - classList = element.classList; + setTimeout(function () { + if (_this3.animationStack.indexOf(animId) < 0) { + classList.remove(className + '-remove'); + classList.remove(className); - var animStart; - _this4.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + resolve(false); + } + }, _this3.getElementAnimationDelay(element) + 400); + }); + }; + + CssAnimator.prototype.addClass = function addClass(element, className) { + var _this4 = this; - _this4.addAnimationToStack(animId); + return new Promise(function (resolve, reject) { + var animId = element.toString() + className + Math.random(), + classList = element.classList; - var animEnd; - _this4.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + var animStart; + _this4.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - classList.add(className); + _this4.addAnimationToStack(animId); - classList.remove(className + '-add'); + var animEnd; + _this4.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - _this4.removeAnimationFromStack(animId); + classList.add(className); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + classList.remove(className + '-add'); - resolve(true); - }, false); + _this4.removeAnimationFromStack(animId); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + + resolve(true); }, false); - classList.add(className + '-add'); + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - setTimeout(function () { - if (_this4.animationStack.indexOf(animId) < 0) { - classList.remove(className + '-add'); - classList.add(className); - - resolve(false); - } - }, _this4.getElementAnimationDelay(element) + 400); - }); - } - }]); + classList.add(className + '-add'); + + setTimeout(function () { + if (_this4.animationStack.indexOf(animId) < 0) { + classList.remove(className + '-add'); + classList.add(className); + + resolve(false); + } + }, _this4.getElementAnimationDelay(element) + 400); + }); + }; return CssAnimator; })(); diff --git a/dist/commonjs/index.js b/dist/commonjs/index.js index 892a173..e7b10ea 100644 --- a/dist/commonjs/index.js +++ b/dist/commonjs/index.js @@ -1,21 +1,14 @@ 'use strict'; -Object.defineProperty(exports, '__esModule', { - value: true -}); -exports.install = install; +exports.__esModule = true; +exports.configure = configure; var _Animator = require('aurelia-templating'); var _CssAnimator = require('./animator'); -Object.defineProperty(exports, 'CssAnimator', { - enumerable: true, - get: function get() { - return _CssAnimator.CssAnimator; - } -}); +exports.CssAnimator = _CssAnimator.CssAnimator; -function install(aurelia) { +function configure(aurelia) { _Animator.Animator.configureDefault(aurelia.container, new _CssAnimator.CssAnimator()); } \ No newline at end of file diff --git a/dist/es6/index.js b/dist/es6/index.js index bc5adb7..38966d7 100644 --- a/dist/es6/index.js +++ b/dist/es6/index.js @@ -3,6 +3,6 @@ import {CssAnimator} from './animator'; export {CssAnimator} from './animator'; -export function install(aurelia){ +export function configure(aurelia){ Animator.configureDefault(aurelia.container, new CssAnimator()); } diff --git a/dist/system/animator.js b/dist/system/animator.js index 4084ff1..d42d28e 100644 --- a/dist/system/animator.js +++ b/dist/system/animator.js @@ -1,5 +1,5 @@ System.register([], function (_export) { - var _classCallCheck, _createClass, CssAnimator; + var _classCallCheck, CssAnimator; return { setters: [], @@ -8,8 +8,6 @@ System.register([], function (_export) { _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }; - _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; }; })(); - CssAnimator = (function () { function CssAnimator() { _classCallCheck(this, CssAnimator); @@ -17,270 +15,259 @@ System.register([], function (_export) { this.animationStack = []; } - _createClass(CssAnimator, [{ - key: 'addMultipleEventListener', - value: function addMultipleEventListener(el, s, fn) { - var evts = s.split(' '), - i, - ii; + CssAnimator.prototype.addMultipleEventListener = function addMultipleEventListener(el, s, fn) { + var evts = s.split(' '), + i, + ii; - for (i = 0, ii = evts.length; i < ii; ++i) { - el.addEventListener(evts[i], fn, false); - } - } - }, { - key: 'addAnimationToStack', - value: function addAnimationToStack(animId) { - if (this.animationStack.indexOf(animId) < 0) { - this.animationStack.push(animId); - } + for (i = 0, ii = evts.length; i < ii; ++i) { + el.addEventListener(evts[i], fn, false); } - }, { - key: 'removeAnimationFromStack', - value: function removeAnimationFromStack(animId) { - var idx = this.animationStack.indexOf(animId); - if (idx > -1) { - this.animationStack.splice(idx, 1); - } + }; + + CssAnimator.prototype.addAnimationToStack = function addAnimationToStack(animId) { + if (this.animationStack.indexOf(animId) < 0) { + this.animationStack.push(animId); } - }, { - key: 'getElementAnimationDelay', - value: function getElementAnimationDelay(element) { - var styl = window.getComputedStyle(element); - var prop, delay; - - if (styl.getPropertyValue('animation-delay')) { - prop = 'animation-delay'; - } else if (styl.getPropertyValue('-webkit-animation-delay')) { - prop = '-webkit-animation-delay'; - } else if (styl.getPropertyValue('-moz-animation-delay')) { - prop = '-moz-animation-delay'; - } else { - return 0; - } - delay = styl.getPropertyValue(prop); - delay = Number(delay.replace(/[^\d\.]/g, '')); + }; - return delay * 1000; + CssAnimator.prototype.removeAnimationFromStack = function removeAnimationFromStack(animId) { + var idx = this.animationStack.indexOf(animId); + if (idx > -1) { + this.animationStack.splice(idx, 1); } - }, { - key: 'move', - value: function move() { - return Promise.resolve(false); + }; + + CssAnimator.prototype.getElementAnimationDelay = function getElementAnimationDelay(element) { + var styl = window.getComputedStyle(element); + var prop, delay; + + if (styl.getPropertyValue('animation-delay')) { + prop = 'animation-delay'; + } else if (styl.getPropertyValue('-webkit-animation-delay')) { + prop = '-webkit-animation-delay'; + } else if (styl.getPropertyValue('-moz-animation-delay')) { + prop = '-moz-animation-delay'; + } else { + return 0; } - }, { - key: 'enter', - value: function enter(element) { - var _this = this; + delay = styl.getPropertyValue(prop); + delay = Number(delay.replace(/[^\d\.]/g, '')); + + return delay * 1000; + }; - return new Promise(function (resolve, reject) { - var animId = element.toString() + Math.random(), - classList = element.classList; + CssAnimator.prototype.move = function move() { + return Promise.resolve(false); + }; - classList.add('au-enter'); + CssAnimator.prototype.enter = function enter(element) { + var _this = this; - var animStart; - _this.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + return new Promise(function (resolve, reject) { + var animId = element.toString() + Math.random(), + classList = element.classList; - _this.addAnimationToStack(animId); + classList.add('au-enter'); - var animEnd; - _this.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + var animStart; + _this.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - classList.remove('au-enter-active'); - classList.remove('au-enter'); + _this.addAnimationToStack(animId); - _this.removeAnimationFromStack(animId); + var animEnd; + _this.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + classList.remove('au-enter-active'); + classList.remove('au-enter'); - resolve(true); - }, false); + _this.removeAnimationFromStack(animId); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + + resolve(true); }, false); - var parent = element.parentElement, - delay = 0; + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - if (parent.classList.contains('au-stagger')) { - var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); - delay = _this.getElementAnimationDelay(parent) * elemPos; + var parent = element.parentElement, + delay = 0; - setTimeout(function () { - classList.add('au-enter-active'); - }, delay); - } else { - classList.add('au-enter-active'); - } + if (parent.classList.contains('au-stagger')) { + var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); + delay = _this.getElementAnimationDelay(parent) * elemPos; setTimeout(function () { - if (_this.animationStack.indexOf(animId) < 0) { - classList.remove('au-enter-active'); - classList.remove('au-enter'); - - resolve(false); - } - }, _this.getElementAnimationDelay(element) + 400 + delay); - }); - } - }, { - key: 'leave', - value: function leave(element) { - var _this2 = this; + classList.add('au-enter-active'); + }, delay); + } else { + classList.add('au-enter-active'); + } - return new Promise(function (resolve, reject) { - var animId = element.toString() + Math.random(), - classList = element.classList; + setTimeout(function () { + if (_this.animationStack.indexOf(animId) < 0) { + classList.remove('au-enter-active'); + classList.remove('au-enter'); - classList.add('au-leave'); + resolve(false); + } + }, _this.getElementAnimationDelay(element) + 400 + delay); + }); + }; + + CssAnimator.prototype.leave = function leave(element) { + var _this2 = this; - var animStart; - _this2.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + return new Promise(function (resolve, reject) { + var animId = element.toString() + Math.random(), + classList = element.classList; - _this2.addAnimationToStack(animId); + classList.add('au-leave'); - var animEnd; - _this2.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + var animStart; + _this2.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - classList.remove('au-leave-active'); - classList.remove('au-leave'); + _this2.addAnimationToStack(animId); - _this2.removeAnimationFromStack(animId); + var animEnd; + _this2.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + classList.remove('au-leave-active'); + classList.remove('au-leave'); - resolve(true); - }, false); + _this2.removeAnimationFromStack(animId); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + + resolve(true); }, false); - var parent = element.parentElement, - delay = 0; + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - if (parent.classList.contains('au-stagger')) { - var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); - delay = _this2.getElementAnimationDelay(parent) * elemPos; + var parent = element.parentElement, + delay = 0; - setTimeout(function () { - classList.add('au-leave-active'); - }, delay); - } else { - classList.add('au-leave-active'); - } + if (parent.classList.contains('au-stagger')) { + var elemPos = Array.prototype.indexOf.call(parent.childNodes, element); + delay = _this2.getElementAnimationDelay(parent) * elemPos; setTimeout(function () { - if (_this2.animationStack.indexOf(animId) < 0) { - classList.remove('au-leave-active'); - classList.remove('au-leave'); - - resolve(false); - } - }, _this2.getElementAnimationDelay(element) + 400 + delay); - }); - } - }, { - key: 'removeClass', - value: function removeClass(element, className) { - var _this3 = this; + classList.add('au-leave-active'); + }, delay); + } else { + classList.add('au-leave-active'); + } - return new Promise(function (resolve, reject) { - var classList = element.classList; + setTimeout(function () { + if (_this2.animationStack.indexOf(animId) < 0) { + classList.remove('au-leave-active'); + classList.remove('au-leave'); - if (!classList.contains(className)) { resolve(false); - return; } + }, _this2.getElementAnimationDelay(element) + 400 + delay); + }); + }; - var animId = element.toString() + className + Math.random(); + CssAnimator.prototype.removeClass = function removeClass(element, className) { + var _this3 = this; - classList.remove(className); + return new Promise(function (resolve, reject) { + var classList = element.classList; - var animStart; - _this3.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + if (!classList.contains(className)) { + resolve(false); + return; + } + + var animId = element.toString() + className + Math.random(); + + classList.remove(className); - _this3.addAnimationToStack(animId); + var animStart; + _this3.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - var animEnd; - _this3.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + _this3.addAnimationToStack(animId); - classList.remove(className + '-remove'); + var animEnd; + _this3.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - _this3.removeAnimationFromStack(animId); + classList.remove(className + '-remove'); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + _this3.removeAnimationFromStack(animId); - resolve(true); - }, false); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + resolve(true); }, false); - classList.add(className + '-remove'); + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - setTimeout(function () { - if (_this3.animationStack.indexOf(animId) < 0) { - classList.remove(className + '-remove'); - classList.remove(className); - - resolve(false); - } - }, _this3.getElementAnimationDelay(element) + 400); - }); - } - }, { - key: 'addClass', - value: function addClass(element, className) { - var _this4 = this; + classList.add(className + '-remove'); - return new Promise(function (resolve, reject) { - var animId = element.toString() + className + Math.random(), - classList = element.classList; + setTimeout(function () { + if (_this3.animationStack.indexOf(animId) < 0) { + classList.remove(className + '-remove'); + classList.remove(className); - var animStart; - _this4.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { - evAnimStart.stopPropagation(); + resolve(false); + } + }, _this3.getElementAnimationDelay(element) + 400); + }); + }; + + CssAnimator.prototype.addClass = function addClass(element, className) { + var _this4 = this; - _this4.addAnimationToStack(animId); + return new Promise(function (resolve, reject) { + var animId = element.toString() + className + Math.random(), + classList = element.classList; - var animEnd; - _this4.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { - evAnimEnd.stopPropagation(); + var animStart; + _this4.addMultipleEventListener(element, 'webkitAnimationStart animationstart', animStart = function (evAnimStart) { + evAnimStart.stopPropagation(); - classList.add(className); + _this4.addAnimationToStack(animId); - classList.remove(className + '-add'); + var animEnd; + _this4.addMultipleEventListener(element, 'webkitAnimationEnd animationend', animEnd = function (evAnimEnd) { + evAnimEnd.stopPropagation(); - _this4.removeAnimationFromStack(animId); + classList.add(className); - evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + classList.remove(className + '-add'); - resolve(true); - }, false); + _this4.removeAnimationFromStack(animId); - evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + evAnimEnd.target.removeEventListener(evAnimEnd.type, animEnd); + + resolve(true); }, false); - classList.add(className + '-add'); + evAnimStart.target.removeEventListener(evAnimStart.type, animStart); + }, false); - setTimeout(function () { - if (_this4.animationStack.indexOf(animId) < 0) { - classList.remove(className + '-add'); - classList.add(className); - - resolve(false); - } - }, _this4.getElementAnimationDelay(element) + 400); - }); - } - }]); + classList.add(className + '-add'); + + setTimeout(function () { + if (_this4.animationStack.indexOf(animId) < 0) { + classList.remove(className + '-add'); + classList.add(className); + + resolve(false); + } + }, _this4.getElementAnimationDelay(element) + 400); + }); + }; return CssAnimator; })(); diff --git a/dist/system/index.js b/dist/system/index.js index d8d6d8e..8f8cceb 100644 --- a/dist/system/index.js +++ b/dist/system/index.js @@ -1,9 +1,9 @@ System.register(['aurelia-templating', './animator'], function (_export) { var Animator, CssAnimator; - _export('install', install); + _export('configure', configure); - function install(aurelia) { + function configure(aurelia) { Animator.configureDefault(aurelia.container, new CssAnimator()); } diff --git a/doc/CHANGELOG.md b/doc/CHANGELOG.md index 1117c85..c1d2b7c 100644 --- a/doc/CHANGELOG.md +++ b/doc/CHANGELOG.md @@ -1,3 +1,16 @@ +## 0.2.0 (2015-05-01) + + +#### Bug Fixes + +* **all:** update to latest plugin api ([3a5210c0](https://github.com/aurelia/animator-css/commit/3a5210c0289dc3d65460b6b61f71fa88bb32c138)) + + +#### Features + +* **stagger:** add staggering animations ([d57d22b6](https://github.com/aurelia/animator-css/commit/d57d22b6dd6f4653c8463e27b41cedd38f7c7df3)) + + ### 0.1.0 (2015-04-13) diff --git a/package.json b/package.json index 74a8d47..4831cc2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "aurelia-animator-css", - "version": "0.1.1", + "version": "0.2.0", "description": "An implementation of the abstract Animator interface from templating which enables css-based animations.", "keywords": [ "aurelia", @@ -26,7 +26,12 @@ "lib": "dist/system" }, "dependencies": { - "aurelia-templating": "github:aurelia/templating@^0.10.3" + "aurelia-templating": "github:aurelia/templating@^0.11.0" + }, + "devDependencies": { + "babel": "npm:babel-core@^5.1.13", + "babel-runtime": "npm:babel-runtime@^5.1.13", + "core-js": "npm:core-js@^0.9.4" } }, "devDependencies": {