sideral/Module/Module.js

"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;
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
            t[p[i]] = s[p[i]];
    return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
var SideralObject_1 = require("./../SideralObject");
var Tool_1 = require("./../Tool");
var index_1 = require("./../index");
/**
 * SideralObject visible on screen
 */
var Module = (function (_super) {
    __extends(Module, _super);
    /* LIFECYCLE */
    /**
     * @constructor
     */
    function Module() {
        var _this = _super.call(this) || this;
        /**
         * PIXI Container (a module must have a pixi container)
         * @readonly
         */
        _this.container = new index_1.PIXI.Container();
        /**
         * Know if the module is clickable
         * @private
         */
        _this._clickable = false;
        /**
         * Know if it is the first mouse hover event fired
         * @private
         */
        _this._mouseHover = false;
        /**
         * Know if children must be sorted or not
         * @private
         */
        _this._sortRequested = false;
        _this.setProps({
            x: 0,
            y: 0,
            vx: 0,
            vy: 0,
            width: 0,
            height: 0,
            angle: 0,
            opacity: 1,
            flip: false,
            visible: true
        });
        _this.timers = _this.add(new SideralObject_1.TimerManager());
        _this.signals.click = new SideralObject_1.Signal(_this, _this.onBindClick.bind(_this), _this.onRemoveClick.bind(_this));
        _this.signals.doubleClick = new SideralObject_1.Signal(_this, _this.onBindClick.bind(_this), _this.onRemoveClick.bind(_this));
        _this.signals.hover = new SideralObject_1.Signal(_this, _this.onBindClick.bind(_this), _this.onRemoveClick.bind(_this));
        _this.signals.hoverStart = new SideralObject_1.Signal(_this, _this.onBindClick.bind(_this), _this.onRemoveClick.bind(_this));
        _this.signals.hoverEnd = new SideralObject_1.Signal(_this, _this.onBindClick.bind(_this), _this.onRemoveClick.bind(_this));
        return _this;
    }
    /**
     * @initialize
     * @override
     */
    Module.prototype.initialize = function (props) {
        // We call the updateFollow to update the position of the module before create the Physic
        if (props.follow) {
            this.updateFollow(null, props.follow);
            props.x = this.props.x;
            props.y = this.props.y;
        }
        _super.prototype.initialize.call(this, props);
        this.connect(this.signals.propChange, ["visible", "opacity"], this.onVisibilityChange.bind(this))
            .connect(this.signals.propChange, "angle", this.updateContainerPosition.bind(this))
            .connect(this.signals.propChange, ["x", "y"], this.onPositionChange.bind(this))
            .connect(this.signals.propChange, ["width", "height"], this.onSizeChange.bind(this))
            .connect(this.signals.propChange, "flip", this.onFlipChange.bind(this))
            .connect(this.signals.update, this.updateFollow.bind(this), this.updateVelocity.bind(this));
        this.onVisibilityChange();
        this.updateContainerPosition();
    };
    /**
     * @update
     * @override
     */
    Module.prototype.update = function (tick) {
        _super.prototype.update.call(this, tick);
        if (this._mouseHover) {
            this.signals.hover.dispatch();
        }
    };
    /**
     * @override
     */
    Module.prototype.kill = function () {
        _super.prototype.kill.call(this);
        this.removeContainer();
    };
    /* METHODS */
    /**
     * Remove the pixi Container
     */
    Module.prototype.removeContainer = function () {
        if (this.container) {
            this.container.destroy();
        }
        this.container = null;
    };
    /**
     * Set a new position of the module
     * @param x - The position in x axis
     * @param y - The position in y axis
     */
    Module.prototype.position = function (x, y) {
        x = typeof x === "undefined" ? this.props.x : x;
        y = typeof y === "undefined" ? this.props.y : y;
        if (!this.initialized) {
            this.setProps({ x: x, y: y });
        }
        else {
            this.props.x = x;
            this.props.y = y;
        }
    };
    /**
     * Set a new size of the module
     * @param width - The next width of the module
     * @param height - The next height of the module
     */
    Module.prototype.size = function (width, height) {
        width = typeof width === "undefined" ? this.props.width : width;
        height = typeof height === "undefined" ? this.props.height : height;
        if (!this.initialized) {
            this.setProps({ width: width, height: height });
        }
        else {
            this.props.width = width;
            this.props.height = height;
        }
    };
    /**
     * Add an item to the current object. The item added will enter into the lifecycle of the object and will become a children
     * of this object. The method "initialize" of the item will be called.
     * @access public
     * @param item - A SideralObject
     * @param props - Props to merge to the item
     * @param z - The z index of the item
     * @returns The item initialized
     */
    Module.prototype.add = function (item, props, z) {
        if (props === void 0) { props = {}; }
        props = props || {};
        if (typeof z !== "undefined") {
            props.z = z;
        }
        _super.prototype.add.call(this, item, props);
        if (item instanceof Module) {
            if (typeof props.z !== "undefined") {
                this.container.addChildAt(item.container, z);
            }
            else {
                this.container.addChild(item.container);
            }
        }
        return item;
    };
    /**
     * This method is an helper to add a module. It is much faster than add when you must give a "x" and "y" properties
     * @access public
     * @param item - Module to add
     * @param x - The position in x axis
     * @param y - The position in y axis
     * @param props - Other properties to merge to the module
     * @param z - The z index of the item
     * @returns The module initialize
     */
    Module.prototype.spawn = function (item, x, y, props, z) {
        if (props === void 0) { props = {}; }
        if (!(item instanceof Module)) {
            throw new Error("Module.spawn : The item must ben an instance of Module");
        }
        props.x = x;
        props.y = y;
        return this.add(item, props, z);
    };
    /**
     * Spawn multiple modules
     * @param params - Parameters of the multiple spawn
     */
    Module.prototype.spawnMultiple = function (params) {
        params.forEach(function (param) {
            if (!param.props) {
                param.props = {};
            }
            param.props.x = param.x;
            param.props.y = param.y;
            param.props.z = param.z;
        });
        return _super.prototype.addMultiple.call(this, params);
    };
    /**
     * Create a new transition for the module
     * @param type - Type of transition (it could be the name of a property to change or an Enum.TRANSITION)
     * @param duration - The duration of transtion
     * @param options - Options of transition (see ITransition)
     */
    Module.prototype.addTransition = function (type, duration, _a) {
        var _this = this;
        if (_a === void 0) { _a = {}; }
        var from = _a.from, to = _a.to, complete = _a.complete, update = _a.update, options = __rest(_a, ["from", "to", "complete", "update"]);
        from = typeof from === "undefined" ? this.props[type] : from,
            to = typeof to === "undefined" ? this.props[type] : to;
        if (typeof duration !== "number") {
            throw Error("Module.addtransition: duration must be a number");
        }
        this.timers.addTimer(type, duration, complete, __assign({}, options, { update: function (tick, value, ratio) {
                _this.props[type] = from + ((to - from) * ratio);
                if (update) {
                    update(tick, value, ratio);
                }
            } }));
        return this;
    };
    /**
     * Swap the current PIXI container to another PIXI container. This is usefull if you want to change
     * the PIXI Object without destroy children and parent relationship.
     * @access protected
     * @param nextContainer: PIXI Container
     * @returns -
     */
    Module.prototype.swapContainer = function (nextContainer) {
        var _this = this;
        if (!this.parent || !(this.parent instanceof Module)) {
            return null;
        }
        var containerIndex = this.parent.container.children.findIndex(function (child) { return child === _this.container; }), children = this.container.children.slice(0);
        this.parent.container.removeChild(this.container);
        this.container.destroy();
        if (containerIndex > -1) {
            this.parent.container.addChildAt(nextContainer, containerIndex);
        }
        else {
            this.parent.container.addChild(nextContainer);
        }
        this.container = nextContainer;
        children.forEach(function (child) { return _this.container.addChild(child); });
    };
    /**
     * Use this method to follow this entity by an other entity
     * @param centered - if True, the follower will be centered to the followed
     * @param offsetX - Offset in x axis
     * @param offsetY - Offset in y axis
     * @param offsetFlipX - Set a special offset in x axis if the followed is flipped
     * @returns Configuration object to follow this entity
     */
    Module.prototype.beFollowed = function (centered, offsetX, offsetY, offsetFlipX) {
        if (centered === void 0) { centered = false; }
        if (offsetX === void 0) { offsetX = 0; }
        if (offsetY === void 0) { offsetY = 0; }
        if (offsetFlipX === void 0) { offsetFlipX = null; }
        return {
            target: this,
            centered: centered,
            offsetX: offsetX,
            offsetY: offsetY,
            offsetFlipX: offsetFlipX
        };
    };
    /**
     * Get its position relative to the position of the scene
     * @return The relative position
     */
    Module.prototype.getRelativePosition = function () {
        var scene = this.context.scene;
        if (scene && this.container) {
            var point = this.container.toLocal(new index_1.PIXI.Point(scene.props.x, scene.props.y));
            return { x: point.x * -1, y: point.y * -1 };
        }
        return { x: this.props.x, y: this.props.y };
    };
    /**
     * Update the velocity of the module related to the tick
     * @param tick - The tick
     */
    Module.prototype.updateVelocity = function (tick) {
        this.props.x += this.props.vx * tick;
        this.props.y += this.props.vy * tick;
    };
    /* EVENTS */
    /**
     * Event fired when "x" or "y" properties has changed
     */
    Module.prototype.onPositionChange = function () {
        this.updateContainerPosition();
    };
    /**
     * Event fired when "width" or "height" properties has changed
     */
    Module.prototype.onSizeChange = function () {
        this.updateContainerPosition();
    };
    /**
     * Update the position of the pixi container
     */
    Module.prototype.updateContainerPosition = function () {
        if (this.container) {
            this.container.pivot.set(this.props.width / 2, this.props.height / 2);
            this.container.position.set(this.props.x + this.container.pivot.x, this.props.y + this.container.pivot.y);
            this.container.rotation = Tool_1.Util.toRadians(this.props.angle);
        }
    };
    /**
     * Update the position of this entity if it follows a target
     */
    Module.prototype.updateFollow = function (tick, follow) {
        follow = follow || this.props.follow;
        if (follow) {
            var offsetX = follow.offsetX, offsetY = follow.offsetY, offsetFlipX = follow.offsetFlipX, centered = follow.centered, target = follow.target;
            this.props.x = target.props.x + (target.props.flip && offsetFlipX !== null ? offsetFlipX : offsetX) + (centered ? (target.props.width / 2) - (this.props.width / 2) : 0);
            this.props.y = target.props.y + offsetY + (centered ? (target.props.height / 2) - (this.props.height / 2) : 0);
        }
    };
    /**
     * When "visible" or opacity property has changed
     */
    Module.prototype.onVisibilityChange = function () {
        var _a = this.props, visible = _a.visible, opacity = _a.opacity;
        if (!visible || opacity <= 0) {
            this.container.visible = this.container.renderable = false;
        }
        else {
            this.container.visible = this.container.renderable = true;
            this.container.alpha = opacity;
        }
    };
    /**
     * When "flip" attribute change
     */
    Module.prototype.onFlipChange = function () {
        this.container.scale.x = Math.abs(this.container.scale.x) * (this.props.flip ? -1 : 1);
        this.updateContainerPosition();
    };
    /**
     * Fired when a listener is added to the signal click
     */
    Module.prototype.onBindClick = function () {
        var listeners = this.signals.click._listeners.length + this.signals.doubleClick._listeners.length;
        if (!this._clickable && this.container && listeners >= 1) {
            this.container.interactive = true;
            this.container.buttonMode = true;
            this._clickable = true;
            this.container.on("click", this.signals.click.dispatch.bind(this.signals.click));
            this.container.on("mouseout", this._onMouseOutFired.bind(this));
            this.container.on("mouseover", this._onMouseOverFired.bind(this));
        }
    };
    /**
     * Fired when a listener is removed from the signal click
     */
    Module.prototype.onRemoveClick = function () {
        var listeners = this.signals.click._listeners.length + this.signals.doubleClick._listeners.length;
        if (this._clickable && this.container && !listeners) {
            this.container.interactive = false;
            this.container.buttonMode = false;
            this._clickable = false;
            this.container.off("click", this.signals.click.dispatch.bind(this));
            this.container.off("mouseout", this._onMouseOutFired.bind(this));
            this.container.off("mouseover", this._onMouseOverFired.bind(this));
        }
    };
    /**
     * When mousehover event from pixi is fired
     * @private
     */
    Module.prototype._onMouseOverFired = function () {
        this._mouseHover = true;
        this.signals.hoverStart.dispatch();
    };
    /**
     * When mouseout event from pixi is fired
     * @private
     */
    Module.prototype._onMouseOutFired = function () {
        this._mouseHover = false;
        this.signals.hoverEnd.dispatch();
    };
    return Module;
}(SideralObject_1.SideralObject));
exports.Module = Module;