import { __decorate, __extends } from "tslib";
import Vue from 'vue';
import Component from 'vue-class-component';
import { Prop } from 'vue-property-decorator';
import { TOUCH_NAME } from '../component-names';
import { MZingGestureDirections, MZingTapInteractions, MZingTouchGestures } from './enums';
import WithRender from './touch.html';
import ZingTouchUtil from './zingtouch';
export var MTouchSwipeDirection;
(function (MTouchSwipeDirection) {
    MTouchSwipeDirection["horizontal"] = "horizontal";
    MTouchSwipeDirection["vertical"] = "vertical";
    MTouchSwipeDirection["both"] = "both";
})(MTouchSwipeDirection || (MTouchSwipeDirection = {}));
var MTouch = /** @class */ (function (_super) {
    __extends(MTouch, _super);
    function MTouch() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Object.defineProperty(MTouch.prototype, "internalSwipeOptions", {
        get: function () {
            var swipeOptions = this.swipeOptions || {};
            return Object.assign({
                direction: swipeOptions.direction || MTouchSwipeDirection.both,
                angleThreshold: swipeOptions.angleThreshold || 20,
                velocity: swipeOptions.velocity || 0.3
            });
        },
        enumerable: false,
        configurable: true
    });
    MTouch.prototype.mounted = function () {
        this.initializeZingTouch();
    };
    MTouch.prototype.beforeDestroy = function () {
        this.destroyZingTouch();
    };
    MTouch.prototype.initializeZingTouch = function () {
        this.destroyZingTouch();
        this.zingRegion = ZingTouchUtil.setupRegion(this.$el, false, false);
        this.configureZingSwipe();
        this.configureZingTap();
    };
    MTouch.prototype.configureZingSwipe = function () {
        var _this = this;
        this.zingRegion.bind(this.$el, ZingTouchUtil.GestureFactory.getGesture(MZingTouchGestures.Swipe, this.internalSwipeOptions), function (event) {
            switch (_this.internalSwipeOptions.direction) {
                case MTouchSwipeDirection.both:
                case MTouchSwipeDirection.horizontal:
                    _this.handleHorizontalSwipe(event);
                    break;
            }
        });
    };
    MTouch.prototype.handleHorizontalSwipe = function (event) {
        var swipeOptions = this.internalSwipeOptions;
        switch (ZingTouchUtil.detectDirection(event, swipeOptions.angleThreshold)) {
            case MZingGestureDirections.Right:
                this.handleZingEvent(event);
                this.$emit('swiperight', event);
                break;
            case MZingGestureDirections.Left:
                this.handleZingEvent(event);
                this.$emit('swipeleft', event);
                break;
        }
    };
    MTouch.prototype.configureZingTap = function () {
        var _this = this;
        this.zingRegion.bind(this.$el, ZingTouchUtil.GestureFactory.getGesture(MZingTouchGestures.Tap), function (event) {
            switch (ZingTouchUtil.detectTap(event)) {
                case MZingTapInteractions.Tap:
                    _this.handleZingEvent(event);
                    _this.$emit('tap', event);
                    break;
                case MZingTapInteractions.Click:
                    _this.handleZingEvent(event);
                    _this.$emit('click', event);
                    break;
            }
        });
    };
    MTouch.prototype.destroyZingTouch = function () {
        if (this.zingRegion) {
            this.zingRegion.unbind(this.$el);
        }
        this.zingRegion = undefined;
    };
    MTouch.prototype.handleZingEvent = function (event) {
        // Since we reemit the event, we stop event propagation.  Event whould be handled twice from each listener otherwise.
        event.stopPropagation();
    };
    __decorate([
        Prop({ default: 'div' })
    ], MTouch.prototype, "tag", void 0);
    __decorate([
        Prop()
    ], MTouch.prototype, "swipeOptions", void 0);
    MTouch = __decorate([
        WithRender,
        Component
    ], MTouch);
    return MTouch;
}(Vue));
export { MTouch };
var TouchPlugin = {
    install: function (v, options) {
        v.component(TOUCH_NAME, MTouch);
    }
};
export default TouchPlugin;
//# sourceMappingURL=touch.js.map