chore(env): support es modules

ref naver#90

.gitignore

@@ -203,7 +203,6 @@ GitHub.sublime-settings
 !.vscode/extensions.json
 
 ### Custom ###
-outjs/
 report/
 temp/
 doc/

declaration/index.d.ts

@@ -1,2 +1,6 @@
 import Axes from "./Axes";
-export = Axes;
+export { PanInput } from "./inputType/PanInput";
+export { PinchInput } from "./inputType/PinchInput";
+export { WheelInput } from "./inputType/WheelInput";
+export { MoveKeyInput } from "./inputType/MoveKeyInput";
+export default Axes;

declaration/index.umd.d.ts

@@ -0,0 +1,2 @@
+import Axes from "./Axes";
+export = Axes;

demo/started.md

@@ -20,17 +20,17 @@ IE 10+, latest of Chrome/FF/Safari, iOS 7+ and Android 2.3+ (except 3.x)
 
 ##### ES6+
 ```js
-import Axes from "@egjs/axes";
+import Axes, {PanInput, PinchInput, WheelInput, MoveKeyInput} from "@egjs/axes";
 ```
 
-#### 3. Initialize eg.Axes
+#### 3. Initialize Axes
 
-Initialize eg.Axes. specify the axis to be used.
+Initialize Axes. specify the axis to be used.
 The key of the axis specifies the name to use as the logical virtual coordinate system.
 
 ```js
 // create eg.Axes with option
-const axes = new eg.Axes({
+const axes = new Axes({
   something1: { range: [0, 100] },
   something2: { range: [0, 100] },
   somethingN: { range: [-200, 200] }
@@ -63,10 +63,10 @@ Axes provides three inputTypes.
 
 ```js
 // create inputTypes to use
-const panInput = new eg.Axes.PanInput("#area");
-const wheelInput = new eg.Axes.WheelInput("#wArea");
-const pinchInput = new eg.Axes.PinchInput("#pArea");
-const movekeyInput = new eg.Axes.MoveKeyInput("#mArea");
+const panInput = new PanInput("#area");
+const wheelInput = new WheelInput("#wArea");
+const pinchInput = new PinchInput("#pArea");
+const movekeyInput = new MoveKeyInput("#mArea");
 ```
 
 #### 6. Connect eg.Axes and InputTypes 

outjs/AnimationManager.js

@@ -0,0 +1,201 @@
+"use strict";
+var __assign = (this && this.__assign) || Object.assign || function(t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+        s = arguments[i];
+        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+            t[p] = s[p];
+    }
+    return t;
+};
+exports.__esModule = true;
+var Coordinate_1 = require("./Coordinate");
+var AxisManager_1 = require("./AxisManager");
+var utils_1 = require("./utils");
+var AnimationManager = (function () {
+    function AnimationManager(_a) {
+        var options = _a.options, itm = _a.itm, em = _a.em, axm = _a.axm;
+        this.options = options;
+        this.itm = itm;
+        this.em = em;
+        this.axm = axm;
+        this.animationEnd = this.animationEnd.bind(this);
+    }
+    AnimationManager.getDuration = function (duration, min, max) {
+        return Math.max(Math.min(duration, max), min);
+    };
+    AnimationManager.prototype.getDuration = function (depaPos, destPos, wishDuration) {
+        var _this = this;
+        var duration;
+        if (typeof wishDuration !== "undefined") {
+            duration = wishDuration;
+        }
+        else {
+            var durations_1 = this.axm.map(destPos, function (v, k) { return Coordinate_1["default"].getDuration(Math.abs(Math.abs(v) - Math.abs(depaPos[k])), _this.options.deceleration); });
+            duration = Object.keys(durations_1).reduce(function (max, v) { return Math.max(max, durations_1[v]); }, -Infinity);
+        }
+        return AnimationManager.getDuration(duration, this.options.minimumDuration, this.options.maximumDuration);
+    };
+    AnimationManager.prototype.createAnimationParam = function (pos, duration, option) {
+        var depaPos = this.axm.get();
+        var destPos = pos;
+        var inputEvent = option && option.event || null;
+        return {
+            depaPos: depaPos,
+            destPos: destPos,
+            duration: AnimationManager.getDuration(duration, this.options.minimumDuration, this.options.maximumDuration),
+            delta: this.axm.getDelta(depaPos, destPos),
+            inputEvent: inputEvent,
+            input: option && option.input || null,
+            isTrusted: !!inputEvent,
+            done: this.animationEnd
+        };
+    };
+    AnimationManager.prototype.grab = function (axes, option) {
+        if (this._animateParam && axes.length) {
+            var orgPos_1 = this.axm.get(axes);
+            var pos = this.axm.map(orgPos_1, function (v, k, opt) { return Coordinate_1["default"].getCirculatedPos(v, opt.range, opt.circular); });
+            if (!this.axm.every(pos, function (v, k) { return orgPos_1[k] === v; })) {
+                this.em.triggerChange(pos, option, !!option);
+            }
+            this._animateParam = null;
+            this._raf && utils_1.cancelAnimationFrame(this._raf);
+            this._raf = null;
+            this.em.triggerAnimationEnd(!!(option && option.event));
+        }
+    };
+    AnimationManager.prototype.getEventInfo = function () {
+        if (this._animateParam && this._animateParam.input && this._animateParam.inputEvent) {
+            return {
+                input: this._animateParam.input,
+                event: this._animateParam.inputEvent
+            };
+        }
+        else {
+            return null;
+        }
+    };
+    AnimationManager.prototype.restore = function (option) {
+        var pos = this.axm.get();
+        var destPos = this.axm.map(pos, function (v, k, opt) { return Math.min(opt.range[1], Math.max(opt.range[0], v)); });
+        this.animateTo(destPos, this.getDuration(pos, destPos), option);
+    };
+    AnimationManager.prototype.animationEnd = function () {
+        var beforeParam = this.getEventInfo();
+        this._animateParam = null;
+        var circularTargets = this.axm.filter(this.axm.get(), function (v, k, opt) { return Coordinate_1["default"].isCircularable(v, opt.range, opt.circular); });
+        Object.keys(circularTargets).length > 0 && this.setTo(this.axm.map(circularTargets, function (v, k, opt) { return Coordinate_1["default"].getCirculatedPos(v, opt.range, opt.circular); }));
+        this.itm.setInterrupt(false);
+        this.em.triggerAnimationEnd(!!beforeParam);
+        if (this.axm.isOutside()) {
+            this.restore(beforeParam);
+        }
+        else {
+            this.em.triggerFinish(!!beforeParam);
+        }
+    };
+    AnimationManager.prototype.animateLoop = function (param, complete) {
+        this._animateParam = __assign({}, param);
+        this._animateParam.startTime = new Date().getTime();
+        if (param.duration) {
+            var info_1 = this._animateParam;
+            var self_1 = this;
+            (function loop() {
+                self_1._raf = null;
+                if (self_1.frame(info_1) >= 1) {
+                    if (!AxisManager_1.AxisManager.equal(param.destPos, self_1.axm.get(Object.keys(param.destPos)))) {
+                        self_1.em.triggerChange(param.destPos);
+                    }
+                    complete();
+                    return;
+                }
+                self_1._raf = utils_1.requestAnimationFrame(loop);
+            })();
+        }
+        else {
+            this.em.triggerChange(param.destPos);
+            complete();
+        }
+    };
+    AnimationManager.prototype.getUserControll = function (param) {
+        var userWish = param.setTo();
+        userWish.destPos = this.axm.get(userWish.destPos);
+        userWish.duration = AnimationManager.getDuration(userWish.duration, this.options.minimumDuration, this.options.maximumDuration);
+        return userWish;
+    };
+    AnimationManager.prototype.animateTo = function (destPos, duration, option) {
+        var _this = this;
+        var param = this.createAnimationParam(destPos, duration, option);
+        var depaPos = __assign({}, param.depaPos);
+        var retTrigger = this.em.triggerAnimationStart(param);
+        var userWish = this.getUserControll(param);
+        if (!retTrigger && this.axm.every(userWish.destPos, function (v, k, opt) { return Coordinate_1["default"].isCircularable(v, opt.range, opt.circular); })) {
+            console.warn("You can't stop the 'animation' event when 'circular' is true.");
+        }
+        if (retTrigger && !AxisManager_1.AxisManager.equal(userWish.destPos, depaPos)) {
+            var inputEvent = option && option.event || null;
+            this.animateLoop({
+                depaPos: depaPos,
+                destPos: userWish.destPos,
+                duration: userWish.duration,
+                delta: this.axm.getDelta(depaPos, userWish.destPos),
+                isTrusted: !!inputEvent,
+                inputEvent: inputEvent,
+                input: option && option.input || null
+            }, function () { return _this.animationEnd(); });
+        }
+    };
+    AnimationManager.prototype.frame = function (param) {
+        var curTime = new Date().getTime() - param.startTime;
+        var easingPer = this.easing(curTime / param.duration);
+        var toPos = param.depaPos;
+        toPos = this.axm.map(toPos, function (v, k, opt) {
+            v += param.delta[k] * easingPer;
+            return Coordinate_1["default"].getCirculatedPos(v, opt.range, opt.circular);
+        });
+        this.em.triggerChange(toPos);
+        return easingPer;
+    };
+    AnimationManager.prototype.easing = function (p) {
+        return p > 1 ? 1 : this.options.easing(p);
+    };
+    AnimationManager.prototype.setTo = function (pos, duration) {
+        if (duration === void 0) { duration = 0; }
+        var axes = Object.keys(pos);
+        this.grab(axes);
+        var orgPos = this.axm.get(axes);
+        if (AxisManager_1.AxisManager.equal(pos, orgPos)) {
+            return this;
+        }
+        this.itm.setInterrupt(true);
+        var movedPos = this.axm.filter(pos, function (v, k) { return orgPos[k] !== v; });
+        if (!Object.keys(movedPos).length) {
+            return this;
+        }
+        movedPos = this.axm.map(movedPos, function (v, k, opt) {
+            if (opt.circular && (opt.circular[0] || opt.circular[1])) {
+                return duration > 0 ? v : Coordinate_1["default"].getCirculatedPos(v, opt.range, opt.circular);
+            }
+            else {
+                return Coordinate_1["default"].getInsidePosition(v, opt.range, opt.circular);
+            }
+        });
+        if (AxisManager_1.AxisManager.equal(movedPos, orgPos)) {
+            return this;
+        }
+        if (duration > 0) {
+            this.animateTo(movedPos, duration);
+        }
+        else {
+            this.em.triggerChange(movedPos);
+            this.itm.setInterrupt(false);
+        }
+        return this;
+    };
+    AnimationManager.prototype.setBy = function (pos, duration) {
+        if (duration === void 0) { duration = 0; }
+        return this.setTo(this.axm.map(this.axm.get(Object.keys(pos)), function (v, k) { return v + pos[k]; }), duration);
+    };
+    return AnimationManager;
+}());
+exports.AnimationManager = AnimationManager;
+;

outjs/Axes.js

@@ -0,0 +1,122 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || Object.assign || function(t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+        s = arguments[i];
+        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+            t[p] = s[p];
+    }
+    return t;
+};
+exports.__esModule = true;
+var Component = require("@egjs/component");
+var AnimationManager_1 = require("./AnimationManager");
+var EventManager_1 = require("./EventManager");
+var InterruptManager_1 = require("./InterruptManager");
+var AxisManager_1 = require("./AxisManager");
+var InputObserver_1 = require("./InputObserver");
+var const_1 = require("./const");
+var Axes = (function (_super) {
+    __extends(Axes, _super);
+    function Axes(axis, options, startPos) {
+        if (axis === void 0) { axis = {}; }
+        var _this = _super.call(this) || this;
+        _this.axis = axis;
+        _this._inputs = [];
+        _this.options = __assign({
+            easing: function easeOutCubic(x) {
+                return 1 - Math.pow(1 - x, 3);
+            },
+            interruptable: true,
+            maximumDuration: Infinity,
+            minimumDuration: 0,
+            deceleration: 0.0006
+        }, options);
+        _this.itm = new InterruptManager_1.InterruptManager(_this.options);
+        _this.axm = new AxisManager_1.AxisManager(_this.axis, _this.options);
+        _this.em = new EventManager_1.EventManager(_this);
+        _this.am = new AnimationManager_1.AnimationManager(_this);
+        _this.io = new InputObserver_1.InputObserver(_this);
+        _this.em.setAnimationManager(_this.am);
+        startPos && _this.em.triggerChange(startPos);
+        return _this;
+    }
+    Axes.prototype.connect = function (axes, inputType) {
+        var mapped;
+        if (typeof axes === "string") {
+            mapped = axes.split(" ");
+        }
+        else {
+            mapped = axes.concat();
+        }
+        if (~this._inputs.indexOf(inputType)) {
+            this.disconnect(inputType);
+        }
+        if ("hammer" in inputType) {
+            var targets = this._inputs.filter(function (v) { return v.hammer && v.element === inputType.element; });
+            if (targets.length) {
+                inputType.hammer = targets[0].hammer;
+            }
+        }
+        inputType.mapAxes(mapped);
+        inputType.connect(this.io);
+        this._inputs.push(inputType);
+        return this;
+    };
+    Axes.prototype.disconnect = function (inputType) {
+        if (inputType) {
+            var index = this._inputs.indexOf(inputType);
+            if (index >= 0) {
+                this._inputs[index].disconnect();
+                this._inputs.splice(index, 1);
+            }
+        }
+        else {
+            this._inputs.forEach(function (v) { return v.disconnect(); });
+            this._inputs = [];
+        }
+        return this;
+    };
+    Axes.prototype.get = function (axes) {
+        return this.axm.get(axes);
+    };
+    Axes.prototype.setTo = function (pos, duration) {
+        if (duration === void 0) { duration = 0; }
+        this.am.setTo(pos, duration);
+        return this;
+    };
+    Axes.prototype.setBy = function (pos, duration) {
+        if (duration === void 0) { duration = 0; }
+        this.am.setBy(pos, duration);
+        return this;
+    };
+    Axes.prototype.isBounceArea = function (axes) {
+        return this.axm.isOutside(axes);
+    };
+    Axes.prototype.destroy = function () {
+        this.disconnect();
+        this.em.destroy();
+    };
+    Axes.VERSION = "#__VERSION__#";
+    Axes.TRANSFORM = const_1.TRANSFORM;
+    Axes.DIRECTION_NONE = const_1.DIRECTION.DIRECTION_NONE;
+    Axes.DIRECTION_LEFT = const_1.DIRECTION.DIRECTION_LEFT;
+    Axes.DIRECTION_RIGHT = const_1.DIRECTION.DIRECTION_RIGHT;
+    Axes.DIRECTION_UP = const_1.DIRECTION.DIRECTION_UP;
+    Axes.DIRECTION_DOWN = const_1.DIRECTION.DIRECTION_DOWN;
+    Axes.DIRECTION_HORIZONTAL = const_1.DIRECTION.DIRECTION_HORIZONTAL;
+    Axes.DIRECTION_VERTICAL = const_1.DIRECTION.DIRECTION_VERTICAL;
+    Axes.DIRECTION_ALL = const_1.DIRECTION.DIRECTION_ALL;
+    return Axes;
+}(Component));
+exports["default"] = Axes;
+;