API Docs for: 1.0.1
Show:

File: src\hud\components\WidgetInput.ts

/**
*
* @module HUD
* @submodule HUDComponents
* 
*/

module Kiwi.HUD.HUDComponents {
    
    /**
    * The WidgetInput Component handles the input events that you may want to listen to on a widget.
    * This Component is essentually another version of the normal Input Component but instead of for GameObjects this is for HUDWidgets.
    *
    * @class WidgetInput
    * @extends Kiwi.Component
    * @namespace Kiwi.HUD.HUDComponents
    * @constructor
    * @param owner {any} The object that this WidgetInput belongs to.
    * @param container {HTMLElement} The HTMLElement that the events will occur on/to.
    * @return {Kiwi.HUD.HUDComponents.WidgetInput} 
    */
    export class WidgetInput extends Component {

        constructor(owner:any, container:HTMLElement) {
            super(owner, 'WidgetInput');
            this._container = container;

            //signals!!
            this.onUp = new Kiwi.Signal;
            this.onDown = new Kiwi.Signal;
            this.onOver = new Kiwi.Signal;
            this.onOut = new Kiwi.Signal;

            this._addEvents();
        }

        /**
        * The type of object that this is.
        * @method objType
        * @return {String} 'WidgetInputComponent'
        * @public
        */
        public objType(): string {
            return 'WidgetInputComponent';
        }

        /**
        * A Signal that dispatches events when the user releases the mouse on top of the HTMLElement.
        * @property onUp
        * @type Kiwi.Signal
        * @public
        */
        public onUp: Kiwi.Signal;

        /**
        * A Signal that dispatches events when the user presses the mouse on top of the HTMLElement.
        * @property onDown
        * @type Kiwi.Signal
        * @public
        */
        public onDown: Kiwi.Signal;

        /**
        * A Signal that dispatches events when the user's mouse initially goes over the top of the HTMLElement.
        * @property onOver
        * @type Kiwi.Signal
        * @public
        */
        public onOver: Kiwi.Signal;

        /**
        * A Signal that dispatches events when the user's mouse leaves the HTMLElement.
        * @property onOut
        * @type Kiwi.Signal
        * @public
        */
        public onOut: Kiwi.Signal;
        
        /**
        * The HTMLElement that the events are going to occur on.
        * @property _container
        * @type HTMLElement
        * @private
        */
        private _container: HTMLElement;

        /**
        * Changes the HTMLElement that the events are occuring on to one passed. 
        * Removes all of the current events from container before changing.
        * @method setElement
        * @param container {HTMLElement} The new element that the events are going to occur on.
        * @public
        */
        public setElement(container: HTMLElement) {
            this._removeEvents();
            this._container = container;
            this._addEvents();
        }

        /**
        * Creates new bindings and adds the events to the HTMLElement.
        * @method _addEvents
        * @private
        */
        private _addEvents() {
            if (!this._active) {
                this._binds = [];
                this._binds.push({ 'event': 'mouseup', 'function': this._up.bind(this) });
                this._binds.push({ 'event': 'mousedown', 'function': this._down.bind(this) });
                this._binds.push({ 'event': 'mouseover', 'function': this._over.bind(this) });
                this._binds.push({ 'event': 'mouseout', 'function': this._out.bind(this) });

                for (var i = 0; i < this._binds.length; i++) {
                    this._container.addEventListener(this._binds[i].event, this._binds[i].function, false);
                }
                this._active = true;
            }
        }

        /**
        * Removes the events off of the current container.
        * @method _removeEvents
        * @private
        */
        private _removeEvents() {
            if (this._active) {
                for (var i = 0; i < this._binds.length; i++) {
                    this._container.removeEventListener(this._binds[i].event, this._binds[i].function, false);
                }
                this._binds = [];
                this._active = false;
            }
        }

        /**
        * An array of objects, that holds the events that are happening and the methods that are bound to the container. 
        * @property _binds
        * @type any
        * @private
        */
        private _binds: any;

        /**
        * If the events are currently actively running or not.
        * @property active
        * @type boolean
        * @private
        */
        private _active: boolean = false;

        /**
        * The method that is called when a mouseup event fires. The onUp Signal is called.
        * @method _up
        * @param evt {MouseEvent}
        * @private
        */
        private _up(evt) {
            this.onUp.dispatch(evt);
        }
        
        /**
        * The method that is called when a mousedown event fires. The onDown Signal is called.
        * @method _down
        * @param evt {MouseEvent}
        * @private
        */
        private _down(evt) {
            this.onDown.dispatch(evt);
        }
        
        /**
        * The method that is called when a mouseover event fires. The onOver Signal is called.
        * @method _over
        * @param evt {MouseEvent}
        * @private
        */
        private _over(evt) {
            this.onOver.dispatch(evt);
        }
        
        /**
        * The method that is called when a mouseout event fires. The onOut Signal is called.
        * @method _out
        * @param evt {MouseEvent}
        * @private
        */
        private _out(evt) {
            this.onOut.dispatch(evt);
        }

    }

}