@egjs/axes/outjs/inputType/WheelInput.js

A module used to change the information of user action entered by various input devices such as touch screen or mouse into the logical virtual coordinates. You can easily create a UI that responds to user actions.

var __assign = (this && this.__assign) || function () {
    __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;
    };
    return __assign.apply(this, arguments);
};
import { $, getDirection, useDirection } from "../utils";
import { ANY, DIRECTION_HORIZONTAL, DIRECTION_VERTICAL } from "../const";
import { toAxis } from "./InputType";
import { isValidKey } from "../eventInput/EventInput";
var WheelInput = (function () {
    function WheelInput(el, options) {
        this.axes = [];
        this.element = null;
        this._enabled = false;
        this._holding = false;
        this._timer = null;
        this.element = $(el);
        this.options = __assign({ inputKey: [ANY], scale: 1, releaseDelay: 300, useNormalized: true, useAnimation: false }, options);
        this._onWheel = this._onWheel.bind(this);
    }
    WheelInput.prototype.mapAxes = function (axes) {
        this._direction = getDirection(!!axes[1], !!axes[0]);
        this.axes = axes;
    };
    WheelInput.prototype.connect = function (observer) {
        this._detachEvent();
        this._attachEvent(observer);
        return this;
    };
    WheelInput.prototype.disconnect = function () {
        this._detachEvent();
        return this;
    };
    WheelInput.prototype.destroy = function () {
        this.disconnect();
        this.element = null;
    };
    WheelInput.prototype.enable = function () {
        this._enabled = true;
        return this;
    };
    WheelInput.prototype.disable = function () {
        this._enabled = false;
        return this;
    };
    WheelInput.prototype.isEnabled = function () {
        return this._enabled;
    };
    WheelInput.prototype._onWheel = function (event) {
        var _this = this;
        if (!this._enabled || !isValidKey(event, this.options.inputKey)) {
            return;
        }
        var offset = this._getOffset([event.deltaY, event.deltaX], [
            useDirection(DIRECTION_VERTICAL, this._direction),
            useDirection(DIRECTION_HORIZONTAL, this._direction),
        ]);
        if (offset[0] === 0 && offset[1] === 0) {
            return;
        }
        event.preventDefault();
        if (!this._holding) {
            this._observer.hold(this, event);
            this._holding = true;
        }
        this._observer.change(this, event, toAxis(this.axes, offset), this.options.useAnimation);
        clearTimeout(this._timer);
        this._timer = setTimeout(function () {
            if (_this._holding) {
                _this._holding = false;
                _this._observer.release(_this, event, [0]);
            }
        }, this.options.releaseDelay);
    };
    WheelInput.prototype._getOffset = function (properties, direction) {
        var scale = this.options.scale;
        var useNormalized = this.options.useNormalized;
        return [
            direction[0] && properties[0]
                ? (properties[0] > 0 ? -1 : 1) *
                    (useNormalized ? 1 : Math.abs(properties[0])) *
                    scale
                : 0,
            direction[1] && properties[1]
                ? (properties[1] > 0 ? -1 : 1) *
                    (useNormalized ? 1 : Math.abs(properties[1])) *
                    scale
                : 0,
        ];
    };
    WheelInput.prototype._attachEvent = function (observer) {
        var element = this.element;
        if (!element) {
            throw new Error("Element to connect input does not exist.");
        }
        this._observer = observer;
        element.addEventListener("wheel", this._onWheel);
        this._enabled = true;
    };
    WheelInput.prototype._detachEvent = function () {
        var element = this.element;
        if (element) {
            this.element.removeEventListener("wheel", this._onWheel);
        }
        this._enabled = false;
        this._observer = null;
        if (this._timer) {
            clearTimeout(this._timer);
            this._timer = null;
        }
    };
    return WheelInput;
}());
export { WheelInput };
//# sourceMappingURL=WheelInput.js.map