/**
 * @description Interface describing some point in space with 'x' and 'y' properties.
 * @interface jibo.face.views.Element~PointData
 * @property {Number|String} [x] X value for the point
 * @property {Number|String} [y] Y value for the point
 */

/**
 * @description Interface for describing position of the element on the screen.
 * @interface jibo.face.views.Element~PositionData
 * @extends jibo.face.views.Element~PointData
 * @property {Number|String} [x] X value for the position. May take numbers and such values as LEFT/CENTER/RIGHT.
 * @property {Number|String} [y] Y value for the position. May take numbers and such values as TOP/CENTER/BOTTOM.
 * @property {Number|jibo.face.views.Element~PointData} [margin] Sets the margin value for position specified. May be a number or {jibo.face.views.Element~PointData} structure.
 */

/**
 * @description Interface for basic transformations.
 * @interface jibo.face.views.Element~TransformData
 * @property {Number} [scaleX] From 0 to N.
 * @property {Number} [scaleY] From 0 to N.
 * @property {Number} [rotate] In degrees. Positive value to rotate object clockwise. Negative value to rotate object counterclockwise.
 * @property {Number} [pivotX] From 0 to 1.
 * @property {Number} [pivotY] From 0 to 1.
 */

/**
 * @description Interface for describing hit area of the element.
 * @interface jibo.face.views.Element~HitAreaData
 * @extends jibo.face.views.Element~PointData
 * @property {Number} [x] X value of the hit area.
 * @property {Number} [y] Y value of the hit area.
 * @property {Number} [width] Width value of the hit area.
 * @property {Number} [height] Height value of the hit area.
 */

/**
 * @description Interface for width and height.
 * @interface jibo.face.views.Element~DimensionData
 * @property {Number} width Width value of the hit area
 * @property {Number} height Height value of the hit area
 */

/**
 * @description Interface - Configuration values for creating an Element.
 * @interface jibo.face.views.Element~ElementOptions
 * @extends jibo.face.views.Component~ComponentOptions
 * @prop {jibo.face.views.Element~PositionData} [position] - Position of the element on the screen.
 * @prop {jibo.face.views.Element~TransformData} [transform] - Transformation values to be applied to the element.
 * @prop {jibo.face.views.Element~HitAreaData} [hitArea] - Structure desribing hit are a for the element.
 * @prop {Boolean} [interactable] - Flag that indicates if user can interact with the element.
 */

/**
 * Base class for components elements (non-groups) that appear in component
 * groups (buttons, labels, .etc) Has base methods that deal with display
 * and positioning.
 *
 * @class Element
 * @extends jibo.face.views.Component
 * @memberof jibo.face.views
 */

    /**
     * Flag determines if Element can be interactive.
     * If `false` prevents locking and unlocking input from effecting the display's interactivity.
     * @name jibo.face.views.Element#interactable
     * @default false
     * @type {boolean}
     */

    /**
     * Display container for the Element.
     * @name jibo.face.views.Element#display
     * @type {PIXI.Container}
     */

    /**
     * The target position.
     * Can be specified prior to the creation of the display, when the display is created this position is applied.
     * @name jibo.face.views.Element#targetPosition
     * @type {PIXI.Point}
     */

    /**
     * The transformation data.
     * @method jibo.face.views.Element#transformData
     * @return {jibo.face.views.Element~TransformData}
     */

    /**
     * Set transformData for Element.
     * @name jibo.face.views.Element#setTransformData
     * @type {jibo.face.views.Element~TransformData}
     */

    /**
     * FOR OVERRIDE ONLY. DO NOT CALL.
     *
     * Assign data passed via Object to class.
     * Method can be overridden to allow for manual definition of values, assets, etc.
     * @method jibo.face.views.Element#assignConfig
     * @param {any} configData - Object derived from JSON containing values specific to Element.
     */

    /**
     * FOR OVERRIDE ONLY. DO NOT CALL.
     *
     * Update data representation of element with any `state` changes
     * (anything that should persist between views).
     * @method jibo.face.views.Element#updateConfig
     * @param configData {any} - Object derived from JSON containing values specific to Element.
     * @returns {any} Updated element.
     */

    /**
     * FOR OVERRIDE ONLY. DO NOT CALL.
     *
     * Frame enter loop update, should be overridden.
     * @method jibo.face.views.Element#update
     * @param {number} elapsed Time in milliseconds since the last frame update.
     */

    /**
     * FOR OVERRIDE ONLY. DO NOT CALL.
     *
     * Create Element's display and add to container.
     * @method jibo.face.views.Element#createDisplay
     * @param {PIXI.Container} container Parent Container which all DisplayObject
     *        created within this Component should be added to.
     * @param {Object} assets Object passed back from loader namespace load method,
     *        refer to {@link jibo.loader} for detail
     */

    /**
     * Set up the display.
     * Assign assets, set timelines, etc.
     * @method jibo.face.views.Element#setupDisplay
     * @param {Object} [assets] Object passed back from loader namespace load method,
     *        refer to {@link jibo.loader} for detail
     */

    /**
     * Destroy display's children
     * Clean up all processes using display's children
     * (i.e. tweens).
     * @method jibo.face.views.Element#emptyDisplay
     */

    /**
     * Stop all tweens whose targets are children of Element's display.
     * Option to stop tweens on Element's display as well.
     * @param {boolean} [includeDisplay = false] If `true` will stop tween on display.
     * @method jibo.face.views.Element#stopChildTweens
     */

    /**
     * Called by parent ComponentGroup once parent has finished its loading and setup.
     * Allows opportunity to do additional setup that may depend on other components.
     *
     * ATTENTION: This should not be called directly, the parent View {@link jibo.face.views.View}
     * will call this, which will recurse through Component tree.
     * @method jibo.face.views.Element#ready
     */

    /**
     * Used to define the position for the display before it is created.
     * @method jibo.face.views.Element#setTargetPosition
     * @param {Number} [x = 0] The x position target.
     * @param {Number} [y = 0] The y position target.
     * @param {Boolean} [applyNow = false] Flag determining if given target position should be applied to display within this method.
     *          (Display must be defined for this to take effect.)
     */

    /**
     * Apply position that was defined in config to display's actual position.
     * @method jibo.face.views.Element#applyPosition
     * @public
     */

    /**
     * FOR OVERRIDE ONLY. DO NOT CALL.
     *
     * Open transition, defaults to vertical tween upward from below viewport.
     * @method jibo.face.views.Element#open
     * @param {Function} callback Function to be called once open is complete.
     * @param {String} transitionType String used to determine Element's open transition,
     *        refer to ViewManager for constants used
     * @param {number} [duration = ViewManager.TRANS_TIME] Duration in milliseconds of the transition.
     * @param {String} [tweenType = 'backOut'] Type of tween used.
     */

    /**
     * FOR OVERRIDE ONLY. DO NOT CALL.
     *
     * Close transition, defaults to vertical tween upward out of viewport.
     * @method jibo.face.views.Element#close
     * @param {Function} callback Function to be called once open is complete.
     * @param {String} [transitionType] String used to determine way Element's close transition,
     *        refer to ViewManager for constants used.
     * @param {number} [duration = ViewManager.TRANS_TIME] Duration in milliseconds of the transition.
     * @param {String} [tweenType = 'backIn'] Type of tween used.
     */

    /**
     * FOR OVERRIDE ONLY. DO NOT CALL.
     *
     * Destroy, stops any tweens that may be active on the Elements' display.
     * @method jibo.face.views.Element#destroy
     */

    /**
     * Lock or unlock input.
     * If display is defined and interactable is `true` sets display's interactivity.
     * @method jibo.face.views.Element#lockInput
     * @param {Boolean} flag Determines if input is locked.
     */

    /**
     * Center the pivot of the display.
     * Overwrite in inheriting classes
     * @method jibo.face.views.Element#centerPivot
     */