ZaneDev/JiboOs
1
0
Fork 0
forked from Jibo-Revival-Group/JiboOs
Code Pull Requests Activity

initial commit

Browse Source
This commit is contained in:
Kevin
2026-03-16 13:53:01 +02:00
parent 631dc7df36
commit 81e6e0a7a2
23381 changed files with 8224173 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
docs/rendering/gui/components/Button.js Normal file
View File

@@ -0,0 +1,110 @@
/**
* Button element.
* Can be assigned {@link jibo.face.views.ActionData}, which are triggered on button click.
*
* @class Button
* @extends jibo.face.views.Element
* @memberof jibo.face.views
*/
/**
* `PIXI.animate.MovieClip` containing button states.
* Buttons do not require MovieClips, so if a `PIXI.animate.Timeline`
* is not given as the base asset this remains undefined.
* @name jibo.face.views.Button#timeline
* @type {PIXI.animate.MovieClip}
*/
/**
* FOR OVERRIDE ONLY. DO NOT ALTER.
*
* The Class name as a string.
* @name jibo.face.views.Button#_type
* @type {String}
* @protected
*/
/**
* Flag used to keep track if button is down.
* Is set within button state methods e.g. over, down, up, etc.
* @name jibo.face.views.Button#isDown
* @type {Boolean}
* @protected
*/
/**
* Create a Button from a configuration Object derived from JSON.
* @method jibo.face.views.Button.createFromConfig
* @param {Object} configData Object derived from JSON, must be a specific format refer to examples.
* @returns {jibo.face.views.Button} The Button created from the given configuration.
*/
/**
* Create a Button object by passing the DisplayObject and specifying the {@link jibo.face.views.ActionData}.
* This allows for a more direct way to create Buttons that is not reliant on the configuration data.
* @method jibo.face.views.Button.createFromDisplayObject
* @param {PIXI.DisplayObject} displayObject The DisplayObject with the button assets.
* @param {jibo.face.views.ActionData} [actionData] The action to be triggered on button click.
* @param {PIXI.Container} container Display container for the button.
* @returns {jibo.face.views.Button} The created Button.
*/
/**
* Set up the display.
* Assign assets, set timelines, etc.
* @method jibo.face.views.Button#setupDisplay
* @param {Object} [assets] - Object passed back from loader namespace load method,
* refer to {@link jibo.loader} for details.
*/
/**
* TO BE CALLED INTERNALLY ONLY.
*
* Define the interactive hit area of the display.
* The `DisplayObject.hitArea` is what Pixi uses to define the interactive area.
* Should be called within `setupDisplay()`.
* @method jibo.face.views.Button#setupHitArea
* @param {PIXI.Rectangle} [bounds] Optionally specify the bounds for the hit area.
* If not defined, defaults to using the display's bounds.
* @protected
*/
/**
* Lock or unlock input, lock value is applied to the display's interactive variable.
* @method jibo.face.views.Button#lockInput
* @param {Boolean} flag - Determines if input is locked.
*/
/**
* Manually force a click.
* @method jibo.face.views.Button#click
* @param {any} mouseData Returned from Pixi.
* @protected
*/
/**
* Handler for out touch input.
* @method jibo.face.views.Button#out
* @param {any} mouseData Returned from Pixi.
* @protected
*/
/**
* Handler for down touch input.
* @method jibo.face.views.Button#down
* @param {any} mouseData Returned from Pixi.
* @protected
*/
/**
* Handler for up touch input.
* @method jibo.face.views.Button#up
* @param {any} mouseData Returned from Pixi.
* @protected
*/
/**
* Activate the button, used for non-touch input.
* @method jibo.face.views.Button#activate
* @public
*/

35
docs/rendering/gui/components/Clip.js Normal file
View File

@@ -0,0 +1,35 @@
/**
* Clip to manage timelines and images.
*
* @class Clip
* @extends jibo.face.views.Element
* @memberof jibo.face.views
*/
/**
* Timeline for the display content.
* @name jibo.face.views.Clip#timeline
* @type {Timeline}
*/
/**
* MovieClip for the display content, the instance of the Timeline.
* @name jibo.face.views.Clip#movieClip
* @type {PIXI.animate.MovieClip}
*/
/**
* Create a Clip from a configuration Object derived from JSON.
* @method jibo.face.views.Clip#createFromConfig
* @param configData Object derived from JSON, must be a specific format refer to examples.
* @returns {jibo.face.views.Clip} The created Clip.
*/
/**
* Create a Clip object by passing the DisplayObject.
* This allows for a more direct way to create Clips that is not reliant on the configuration data.
* @method jibo.face.views.Clip#createFromDisplayObject
* @param {PIXI.DisplayObject} displayObject The DisplayObject with the button assets.
* @param {PIXI.Container} [container] Display container for the button.
* @returns {jibo.face.views.Clip} The created Clip.
*/

91
docs/rendering/gui/components/ContactButton.js Normal file
View File

@@ -0,0 +1,91 @@
/**
* Contact button, extends MenuButton to handle specifics required for contacts
*
* @class ContactButton
* @extends jibo.face.views.MenuButton
* @memberof jibo.face.views
*/
/**
* The default class identifier.
* MenuButton uses variants, so this should be defined specifically at
* Generally used to register the class.
* @name jibo.face.views.ContactButton.DEFAULT_TYPE
* @type {String}
* @readOnly
*/
/**
* Loop member associated with button.
* @method jibo.face.views.ContactButton#looper
* @returns {jibo.kb.loop.UserNode} Loop member associated with button.
* @readOnly
*/
/**
* Looper member associated with button.
* @name jibo.face.views.ContactButton#_looper
* @type {jibo.kb.loop.UserNode}
* @private
*/
/**
* Create a ContactButton from a configuration Object derived from JSON.
* @method jibo.face.views.ContactButton#createFromConfig
* @param {Object} configData Object derived from JSON, must be a specific format refer to examples.
* @returns {jibo.face.views.ContactButton} The ContactButton created from the given configuration.
*/
/**
* Create and add a button asset descriptor that corresponds with the type value.
* If `type` is provided as a parameter, it is applied to the internal type variable.
* Add an asset descriptor for the looper's photo, if defined.
* @method jibo.face.views.ContactButton#applyButtonType
* @param {String} [type] If definfed, applied to [MenuButton#_type]{@link jibo.face.views.MenuButton#_type},
* which is then used to determine which timeline assets to use for the button.
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Destroy.
* @method jibo.face.views.ContactButton#destroy
*/
/**
* Keep reference to looper Object and use to define variables.
* @method jibo.face.views.ContactButton#assignLooper
* @param {jibo.kb.loop.UserNode} looper Reference to Looper.
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Set up the timeline asset associated with the button.
* @method jibo.face.views.ContactButton#setupTimeline
* @param assets {any} Assets associated with the button.
* @protected
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Handler for toggleDown-transition executed in {@link jibo.face.views.StandardButton#down}
* @method jibo.face.views.ContactButton#toggleDownTransition
* @protected
*/
/**
* Handler for click touch input.
* If `willToggle` is `true`, toggle the check mark on each click.
* @method jibo.face.views.ContactButton#click
* @protected
*/
/**
* Show or hide the button's checkmark according to its state.
* @method jibo.face.views.ContactButton#animateToggleState
* @param {Boolean} [isToggled = false] State the button needs to be animated into
* @param {Boolean} [shouldAnimate = true] Flag determining if check mark should animate.
* @private
*/

78
docs/rendering/gui/components/ContentButton.js Normal file
View File

@@ -0,0 +1,78 @@
/**
* @interface jibo.face.views.ContentButton~ContentButtonOptions
* @extends jibo.face.views.MenuButton~MenuButtonOptions
* @description Interface describing data provided in the config.
* @prop {Boolean} [isVideo] - Flag indicating if the content in the button is video.
* @prop {jibo.face.views.ContentButton.AlbumInfo} [albumInfo] - Information about album shown in the button.
*/
/**
* @interface jibo.face.views.ContentButton~ContentButtonOptions
* @extends jibo.face.views.MenuButton~MenuButtonOptions
* @description Interface describing data provided in the config.
* @prop {Boolean} [isVideo] - Flag indicating if the content in the button is video.
* @prop {jibo.face.views.ContentButton.AlbumInfo} [albumInfo] - Information about album shown in the button.
*/
/**
* Information about album displayed on the button.
* @class AlbumInfo
* @memberof jibo.face.views.ContentButton
*/
/**
* Album title.
* @name jibo.face.views.ContentButton.AlbumInfo#title
* @type {String}
*/
/**
* Number of items in the album.
* @name jibo.face.views.ContentButton.AlbumInfo#length
* @type {Number}
*/
/**
* Content button, extends MenuButton to handle specifics required for displaying photo, video, or
* album thumbnails.
* @class ContentButton
* @extends jibo.face.views.MenuButton
* @memberof jibo.face.views
*/
/**
* The default class identifier.
* Generally used to register the class.
* @name jibo.face.views.ContentButton#DEFAULT_TYPE
* @type {String}
* @private
* @readOnly
*/
/**
* Create a ContentButton from a configuration Object derived from JSON.
* @method jibo.face.views.ContentButton#createFromConfig
* @param {Object} configData Object derived from JSON, must be a specific format refer to examples.
* @returns {jibo.face.views.ContentButton} ContentButton created from the given configuration.
*/
/**
* Assign configuration.
* @method jibo.face.views.ContentButton#assignConfig
* @param {Object} configData - Configuration to apply
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Destroy.
* @method jibo.face.views.ContentButton#destroy
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Set up the timeline asset associated with the button.
* @method jibo.face.views.ContentButton#setupTimeline
* @protected
*/

223
docs/rendering/gui/components/Element.js Normal file
View File

@@ -0,0 +1,223 @@
/**
* @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
*/

155
docs/rendering/gui/components/ElementGroup.js Normal file
View File

@@ -0,0 +1,155 @@
/**
* @description Interface describing some point in space with 'x' and 'y' properties.
* @interface jibo.face.views.ElementGroup~PointData
* @property {Number|String} [x] X value for the point
* @property {Number|String} [y] Y value for the point
*/
/**
* @description Interface - Configuration values for creating an ElementGroup.
* @interface jibo.face.views.ElementGroup~ElementOptions
* @extends jibo.face.views.Component~ComponentOptions
* @prop {Boolean} [interactable] - Flag that indicates if user can interact with the element.
*/
/**
* Base class for element groups that extend component
* groups. Has base methods that deal with display
* and positioning.
*
* @class ElementGroup
* @extends jibo.face.views.ComponentGroup
* @implements jibo.face.views.IElement
* @memberof jibo.face.views
*/
/**
* The default class identifier.
* Generally used to register the class.
* @name jibo.face.views.ElementGroup.DEFAULT_TYPE
* @type {String}
* @readOnly
*/
/**
* Flag determines if ElementGroup can be interactive.
* If `false` prevents locking and unlocking input from effecting the display's interactivity.
* @name jibo.face.views.ElementGroup#interactable
* @default false
* @type {boolean}
*/
/**
* Display container for the ElementGroup.
* @name jibo.face.views.ElementGroup#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.ElementGroup#targetPosition
* @type {PIXI.Point}
*/
/**
* Create ElementGroup from configuration.
* @method jibo.face.views.ElementGroup#createFromConfig
* @param {Object} configData Configuration to create list from.
* @returns {jibo.face.views.ElementGroup}
*/
/**
* 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.ElementGroup#assignConfig
* @param {any} configData - Object derived from JSON containing values specific to ElementGroup.
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Create ElementGroup's display and add to container.
* @method jibo.face.views.ElementGroup#createDisplay
* @param {PIXI.Container} container Parent Container which all DisplayObject
* created within this ElementGroup 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.ElementGroup#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.ElementGroup#emptyDisplay
*/
/**
* Stop all tweens whose targets are children of ElementGroup's display.
* Option to stop tweens on ElementGroup's display as well.
* @param {boolean} [includeDisplay = false] If `true` will stop tween on display.
* @method jibo.face.views.ElementGroup#stopChildTweens
*/
/**
* Used to define the position for the display before it is created.
* @method jibo.face.views.ElementGroup#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.ElementGroup#applyPosition
* @public
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Open transition, defaults to vertical tween upward from below viewport.
* @method jibo.face.views.ElementGroup#open
* @param {Function} callback Function to be called once open is complete.
* @param {String} transitionType String used to determine ElementGroup'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.ElementGroup#close
* @param {Function} callback Function to be called once open is complete.
* @param {String} [transitionType] String used to determine way ElementGroup'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 ElementGroup's display.
* @method jibo.face.views.ElementGroup#destroy
*/
/**
* Lock or unlock input.
* If display is defined and interactable is `true` sets display's interactivity.
* @method jibo.face.views.ElementGroup#lockInput
* @param {Boolean} flag Determines if input is locked.
*/

9
docs/rendering/gui/components/IElement.js Normal file
View File

@@ -0,0 +1,9 @@
/**
* Interface for elements and element groups that appear in component
* groups (buttons, labels, .etc) Has base methods that deal with display
* and positioning.
*
* @interface IElement
* @extends jibo.face.views.Component
* @memberof jibo.face.views
*/

181
docs/rendering/gui/components/Label.js Normal file
View File

@@ -0,0 +1,181 @@
/**
* @interface jibo.face.views.Label~LabelOptions
* @extends jibo.face.views.Element~ElementOptions
* @description Interface describing data provided in the config for label initialization.
* @prop {PIXI.TextStyle} [style] - Structure that describes text style.
* @prop {String} [text] - Text value shown in the label.
* @prop {jibo.face.views.Element~PointData} [targetAnchor] - Anchor point for the label.
* @prop {jibo.face.views.Element~DimensionData} [bounds] - Bounds for text. When specified font will be decreased to fit.
*/
/**
* Wraps text label in Pixi.
*
* @class Label
* @extends jibo.face.views.Element
* @memberof jibo.face.views
*/
/**
* Default value for the text style if one's missing.
* @name jibo.face.views.Label.DEFAULT_STYLE
* @type {PIXI.TextStyle}
* @readOnly
* @private
*/
/**
* The default class identifier.
* Generally used to register the class.
* @name jibo.face.views.Label.DEFAULT_TYPE
* @type {String}
* @readOnly
*/
/**
* Object describing the font specification used by `PIXI.Text`.
* ```
* fontSize: 100,
* fontFamily: 'Proxima Nova Soft',
* fill: '#FFFFFF',
* fontStyle: 'bold'
* wordWrap: true,
* wordWrapWidth: 100,
* align: 'center'
* ```
* @name jibo.face.views.Label#style
* @type {PIXI.TextStyle}
*/
/**
* Reference to the PIXI.Text object.
* @name jibo.face.views.Label#textDisplay
* @type {PIXI.Text}
*/
/**
* Bounds of the label component
* @name jibo.face.views.Label#_bounds
* @type {jibo.face.views.Element~DimensionData}
* @private
*/
/**
* Dimensional boundaries of the label that text display cannot exceed.
* If defined, {@link jibo.face.views.Label#style}`.fontSize` will be scaled to fit.
* Does not increase `fontSize` if text will fit provided boundaries.
* @example
* x: 300, // width
* y: 100 // height
* @name jibo.face.views.Label#bounds
* @type {jibo.face.views.Element~DimensionData}
*/
/**
* Anchor values for display, values range from 0 to 1
* and represent a percentage of the total width or height.
* If defined anchor values will be applied to display on its creation.
* @name jibo.face.views.Label#_targetAnchor
* @type {PIXI.Point}
* @private
*/
/**
* Text message to display.
* @name jibo.face.views.Label#_text
* @type {String}
* @private
*/
/**
* Keeps reference to original font size specified by style.
* A reference is necessary as the font size can be adjusted to fit the bounds.
* @name jibo.face.views.Label#_originalFontSize
* @type {String}
* @private
*/
/**
* Text to display.
* If display exists updating the text value will also update the display.
* @name jibo.face.views.Label#text
* @type {String}
*/
/**
* Helper method to create font style Objects for use with `PIXI.Text`.
* @method jibo.face.views.Label.createFontStyle
* @param {Number|String} size The size of the font.
* @param {String} family The font family/name.
* @param {String} color The font color.
* @param {String} [style] The font style (e.g. bold, italic)
* @param {String} [align] The font alignment (e.g. left, center, right)
* @returns {PIXI.TextStyle} [style] Object in format required by Pixi to define text style.
*/
/**
* Create Label from config Object.
* @method jibo.face.views.Label.createFromConfig
* @param configData {any} Configuration object to create label for.
* @returns {jibo.face.views.Label} Label created.
*/
/**
* Get the width and height of `PIXI.Text` based on current text and style.
* If text has not been defined method will use given `sampleText`, if that is not given uses an internal default.
* @method jibo.face.views.Label#getTextDimensions
* @param {String} [sampleText] Used only if {@link jibo.face.views.Label#text} is undefined.
* @returns {jibo.face.views.Element~DimensionData} Dimensions of text.
*/
/**
* Predefine the anchor point for your text. These anchors are applied when `applyTransition` is called.
* This is useful for defining anchor of the label before the display is created.
* @method jibo.face.views.Label#setTargetAnchor
* @param {int} [x = 0] - Value between 0 and 1, percentage of width where the anchor should be placed.
* @param {int} [y = 0] - Value between 0 and 1, percentage of height where the anchor should be placed.
* @param {Boolean} [applyNow = false] If `true` will apply anchor position to Text within method,
* as long as Text has been defined.
*/
/**
* Apply target position and anchors if they were defined and if display and text have been created.
* @method jibo.face.views.Label#applyPosition
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Open transition, defaults to fading alpha in from zero.
* @method jibo.face.views.Label#open
* @param {Function} [callback] Function to be called once open is complete.
* @param {String} transitionType String used to determine way Component opens,
* refer to ViewManager for constants used
* @param {number} [duration = ViewManager.TRANS_TIME] Duration of the transition.
* @param {String} [tweenType = sineOut] Type of tween used.
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Open transition, defaults to fading alpha out to zero.
* @method jibo.face.views.Label#close
* @param {Function} [callback] Function to be called once open is complete.
* @param {String} [transitionType] String used to determine way Component closes,
* refer to ViewManager for constants used.
* @param {number} [duration = ViewManager.TRANS_TIME] Duration of the transition.
* @param {String} [tweenType = sineIn] Type of tween used.
*/
/**
* Adjust text font size to fit within bounds.
* Applies autofit if bounds were specified and display and text are defined.
* @method jibo.face.views.Label#applyTextBounds
*/
/**
* Extract font size from a text style and return as a number.
* @method jibo.face.views.Label#getFontSize
* @return {number} - Font size as a number
* @private
*/

661
docs/rendering/gui/components/List.js Normal file
View File

@@ -0,0 +1,661 @@
/**
* @interface jibo.face.views.List~ListOptions
* @extends jibo.face.views.Element~ElementOptions
* @description Interface - Configuration values for creating a List.
* @prop {String} [axis] - Orientation of the list. Can be either `horizontal` or `vertical`.
* @prop {jibo.face.views.Element~ElementOptions[]} [componentConfigs] - Object containing list of element configurations contain within list.
* @prop {Boolean} [noPan = false] - If `true` disables gesture for panning left and right on list.
* @prop {Number} [elementsPerPage] - Number of elements that will appear fully on screen at a time.
* @prop {Number} [pageIndex] - Index of active page of list.
* @prop {Number} [indexOfAction] - Index of the element within list that last triggered an action.
* @prop {jibo.face.views.Element~DimensionData} [elementDimensions] - Width and height of the elements.
* @prop {Number} [elementBuffer] - Minimum space between the elements in the list.
* @prop {jibo.face.views.Element~ElementOptions} [defaultElement] - Default configuration for the elements in the list.
* @prop {Boolean} [dynamic = false] - If `true`, list elements will load as needed. If `false`, all elements assets are loaded with view.
* @prop {Boolean} [dynamicPreload = true] - Use only when `dynamic` is `true`.
* If `true` will load the assets for active elements prior to open, if `false` assets for active elements start laod after open is called.
* @prop {Number} [dynamicBuffer] - Use only when `dynamic` is `true`. Number of pages on either side of current page that will be loaded.
*/
/**
* Format for methods that will handle destroy transitioning for an Element
* @callback jibo.face.views.List~ElementTransition
* @param {jibo.face.views.Element} element - Element to transition.
* @param {Function} done - Called once transition is complete.
*/
/**
* Manage lists of elements using pagination.
*
* @class List
* @extends jibo.face.views.ComponentGroup
* @memberof jibo.face.views
*/
/**
* The default class identifier.
* Generally used to register the class.
* @name jibo.face.views.List.DEFAULT_TYPE
* @type {String}
* @readOnly
*/
/**
* Action type triggered when page changes.
* @name jibo.face.views.List.PAN
* @type {String}
* @readOnly
*/
/**
* Action type triggered/Event string dispatched when page changes.
* @name jibo.face.views.List.PAGED
* @type {String}
* @readOnly
*/
/**
* Event dispatched when page forward attempt is made from end of list.
* @name jibo.face.views.List.AT_END
* @type {String}
* @readOnly
*/
/**
* Event dispatched when page backward attempt is made from front of list.
* @name jibo.face.views.List.AT_FRONT
* @type {String}
* @readOnly
*/
/**
* Number of elements that will appear fully on screen at a time.
* @name jibo.face.views.List#elementsPerPage
* @type {number}
*/
/**
* Number of elements permitted to remain active at
* the edge of the 'page' in addition to the elements per page,
* a value of 1 will allow the elements on either end to remain visible and active.
* @name jibo.face.views.List#numElementsAtEdge
* @type {number}
* @default 1
*/
/**
* The width and height of the elements.
* @name jibo.face.views.List#elementDimensions
* @type {jibo.face.views.Element~DimensionData}
*/
/**
* Minimum space between the elements in the list.
* Buffer is calculated during List creation to guarantee appropriate page positioning,
* and uses this value as the minimum allowable spacing between elements.
* @name jibo.face.views.List#elementBuffer
* @type {number}
* @default 20
*/
/**
* Default configuration for the elements within the list.
* Properties of `defaultElementData` are merged into the element configs on List creation,
* filling in any unspecified values.
* @name jibo.face.views.List#defaultElementData
* @type {Object}
*/
/**
* Position of list axis.
* Only horizontal lists are currently supported.
* @name jibo.face.views.List#axisPosition
* @type {number}
*/
/**
* In case of dynamic element lists, the number of pages on either side of current page that will be loaded.
* @name jibo.face.views.List#dynamicLoadBuffer
* @type {number}
* @default 1
*/
/**
* Flag to disable gestures for panning left and right on list.
* Set value before List's `createDisplay` is called to take effect.
* @name jibo.face.views.List#noPan
* @type {boolean}
* @default false
*/
/**
* Flag to determine if all the list elements will be created dynamically.
* Dynamic elements within the list are not supported yet, so this should remain false.
* The use case for dynmic creation be for a list with a large or unknown number of elements.
* @name jibo.face.views.List#dynamicElements
* @type {boolean}
* @default false
*/
/**
* Flag to include assets for elements that are in initial load range as part of the assets included in the View setup.
* This guarantees that the initially visible elements will have their required assets when the View is opened.
* @name jibo.face.views.List#dynamicPreload
* @type {boolean}
* @default false
*/
/**
* `true` to allow automatic recalculation of elementsPerPage to fit as many elements on page as possible, `false` to respect elementsPerPage
* @name jibo.face.views.List#autoFitElements
* @type {Boolean}
* @default true
*/
/**
* `true` to display portion of elements from next pages at edge of screen, `false` to disable it
* @name jibo.face.views.List#pageHinting
* @type {Boolean}
* @default true
*/
/**
* Get the standard distance between element positions, calculated from element dimensions and buffer.
* @name jibo.face.views.List#elementSpacing
* @type {number}
*/
/**
* Whether the list requires a pan or not, determine at ready.
* @name jibo.face.views.List#_requiresPan
* @type {Boolean}
* @private
*/
/**
* In case of list with multiple pages, amount element for next page appears on screen.
* Determines amount element shows to indicate there are more elements in that direction.
* @name jibo.face.views.List#EDGE_HINT
* @type {Number}
* @constant
* @private
*/
/**
* The max distance of buffer 'spread' when scrolling.
* @name jibo.face.views.List#BUFFER_SPREAD
* @type {number}
* @constant
* @private
*/
/**
* Minimum amount of pan distance required for page change.
* @name jibo.face.views.List#PAN_THRESHOLD
* @type {int}
* @constant
* @private
*/
/**
* The max distance of buffer 'spread' when panning.
* @name jibo.face.views.List#PAN_SPREAD
* @type {number}
* @constant
* @private
*/
/**
* Constant springs value used for spring movement.
* @name jibo.face.views.List#SPRING
* @type {number}
* @constant
* @private
*/
/**
* Constant friction value applied to spring movement.
* @name jibo.face.views.List#FRICTION
* @type {int}
* @type {number}
* @constant
* @private
*/
/**
* The threshold the velocity must surpass in order to start the 'spread' between elements.
* Assume a velocity of 0 if the velocity gets below or equal to this threshold.
* @name jibo.face.views.List#REST_THRESHOLD
* @type {number}
* @constant
* @private
*/
/**
* The x delta that all list elements must be below in order to unlock inputs during a swipe.
* @name jibo.face.views.List#SWIPE_THRESHOLD
* @type {number}
* @constant
* @private
*/
/**
* The axis of the list, only supports horizontal for now.
* @name jibo.face.views.List#_axis
* @type {String}
* @default 'horizontal'
* @private
*/
/**
* List of Elements currently awaiting assets to load.
* @name jibo.face.views.List#_loadingElements
* @type {jibo.face.views.Element[]}
* @private
*/
/**
* left page bound
* @name jibo.face.views.List#_leftPageBound
* @type {number}
* @private
*/
/**
* right page bound
* @name jibo.face.views.List#_leftPageBound
* @type {number}
* @private
*/
/**
* Current page the list is on, 0 being the first page.
* @name jibo.face.views.List#_pageIndex
* @type {int}
* @private
*/
/**
* The current element offset of the pages.
* @name jibo.face.views.List#_pageElementOffset
* @type {int}
* @private
*/
/**
* The list index of the element that last triggered an action.
* @name jibo.face.views.List#_indexOfAction
* @type {number}
* @private
*/
/**
* The current page the list is on, 0 being the first page.
* @name jibo.face.views.List#pageIndex
* @type {number}
* @readOnly
*/
/**
* Maximum buffer distance, this is the standard buffer plus the max distance of buffer 'spread' when scrolling
* @name jibo.face.views.List#_bufferMax
* @type {int}
* @private
*/
/**
* Current type of movement, refer to Movement enum for values.
* @name jibo.face.views.List#_currentMovement
* @type {int}
* @private
*/
/**
* Total distance of the list has mpved from when pan began.
* This is reset to zeroed once the pan stops.
* @name jibo.face.views.List#_panTotalDelta
* @type {number}
* @private
*/
/**
* Holds index range for active elements.
* For use in dynamic lists where we don't want to keep calculating the active range.
* @name jibo.face.views.List#_dynamicActiveIndexRange
* @type {number[]}
* @private
*/
/**
* Create List from configuration.
* @method jibo.face.views.List#createFromConfig
* @param {Object} configData Configuration to create list from.
* @returns {jibo.face.views.List}
*/
/**
* Add Element to the List.
* Assigns the Element's index within the list to the Element.index variable.
* @method jibo.face.views.List#addComponent
* @param {jibo.face.views.Element} element The Element to add this group's component list and library.
* @param {String} [elementId] The id to assign to the Element, if specified will overwrite existing id,
* if none is specified an id will be automatically generated and assigned.
* @returns {jibo.face.views.Element} Returns the given Element.
*/
/**
* Remove Element from list, ultimately destroying the Element.
* @method jibo.face.views.List#removeComponent
* @param {jibo.face.views.Component|Number|String} componentDeterminer - Provide Component, index of component, or id of component to remove.
* @param {Function} [done] - Callback for when element has been fully removed.
* @param {jibo.face.views.List~ElementTransition} [transition] - Optional method to transition element prior to destruction, if not defined uses default.
* @returns {jibo.face.views.Component}
*/
/**
* Compiles together Objects that describe the assets to load from this Component and its children.
* If list is dynamic, only loads an asset to display loading, the element asset are then loaded on the fly.
* @name jibo.face.views.List#assetDescriptors
* @type {jibo.face.views~AssetDescriptor[]}
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Updates the indexes, so list can remember which page it was on when it closed and what element closed it.
* @method jibo.face.views.List#updateConfig
* @param {Object} [configData] Object defining configuration.
* @returns {Object}
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Create the display, sets up touch controls.
* @method jibo.face.views.List#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 loader namespace within jibo for details.
*/
/**
* Called by parent ComponentGroup once parent has finished its loading and setup.
* Allows opportunity to do additional setup that may depend on other components.
* Register for update if multiple pages are required. Also register for panning if its not disabled.
*
* ATTENTION: This should not be called directly, the top level View {@link jibo.face.views.View}
* will call this, which will recurse through Component tree.
* @method jibo.face.views.List#ready
*/
/**
* Destroy, unregister for update, remove gestures.
* Should not be called directly, is called through the owning ComponentGroup
* @method jibo.face.views.List#destroy
*/
/**
* Lock input for List and all child Components,
* and activate or deactivate gestures.
* @method jibo.face.views.List#lockInput
* @param {Boolean} [flag = true] - Flag for pausing or un-pausing the Component.
*/
/**
* Turn the interactivity of the child components off or on.
* @method jibo.face.views.List#lockChildInput
* @param {boolean} flag - flag to turn interactivity on or off.
* @protected
*/
/**
* Open the list, has unique implementation for vertical transitions (TRANS_UP, TRANS_DOWN, & TRANS_EYE).
* Once open is complete start registering for pans if criteria are met.
* Should not be called directly, is called through the owning ComponentGroup
* @method jibo.face.views.List#open
* @param {Function} callback Function to be called once open is complete.
* @param {String} transitionType String used to determine way Component opens,
* refer to ViewManager for constants used
* @param {number} [duration = ViewManager.TRANS_TIME] Duration of the transition.
* @param {String} [tweenType = 'backOut'] Type of tween used.
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Close the list, has unique implementation for vertical transitions (TRANS_UP, TRANS_DOWN, & TRANS_EYE).
* Should not be called directly, is called through the owning ComponentGroup.
* @method jibo.face.views.List#close
* @param {Function} callback Function to be called once open is complete.
* @param {String} [transitionType] String used to determine way Component closes,
* refer to ViewManager for constants used.
* @param {number} [duration = ViewManager.TRANS_TIME] Duration of the transition.
* @param {String} [tweenType = 'backIn'] Type of tween used.
*/
/**
* Bubble up action to parent, keep a reference to the index of the element that triggered action for later use with transitions.
* @method jibo.face.views.List#actionHandler
* @param {jibo.face.views.ActionData} action Contains string for type of action and Object with any pertinent data required for that action type.
* @param {jibo.face.views.Component} [fromComponent] Component that triggered action.
*/
/**
* Blocks actions from reaching child Elements.
* Listens for actions that will effect the page to change,
* namely ActionData.SWIPE_RIGHT, ActionData.SWIPE_LEFT
* @method jibo.face.views.List#actionEnactor
* @param {jibo.face.views.ActionData} action Contains string for type of action and data Object with any pertinent data dependent on action type.
* @return {boolean} Returns true if given action is acted on.
*/
/**
* Move forward or backward one page.
* @method jibo.face.views.List#changePage
* @param {Boolean} [pageForward = true] - If `true` moves forward through the list, if `false` moves backwards.
* @return {Boolean} `true` if list was able to change pages
*/
/**
* Move to start or end of list.
* @method jibo.face.views.List#pageToEnd
* @param {Boolean} [pageToFront = false] - If `true` moves to the beginning of the list, if `false` moves to end of the list.
* @return {Boolean} `true` if list was able to change pages
*/
/**
* Get the start index of the element for the given page index.
* Make sure page index is set before using as it to guarantees offsets is correct.
* The offset guarantees that pages will always show the max elements per page,
* leaving no 'empty' slots when the page displays.
* @method jibo.face.views.List#getStartIndexByPage
* @param {number} pageIndex The index of the page.
* @return {number} The adjusted start index for the page, so that the page is always 'full'.
* @public
*/
/**
* Set the active page index.
* Updates variables that keep track of element offset and range for dynamic elements.
* @method jibo.face.views.List#setActivePage
* @param {number} index - index of page
* @protected
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL FROM EXTERNAL CLASS.
*
* Custom list open for opening vertically.
* Should not be called directly, but from within List.open()
* @method jibo.face.views.List#openVertical
* @param {Function} callback Function to be called once open is complete.
* @param {String} [transitionType] String used to determine way Component closes,
* refer to ViewManager for constants used.
* @param {number} [duration = ViewManager.TRANS_TIME] Duration of the transition.
* @param {String} [tweenType = 'backIn'] Type of tween used.
* @private
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL FROM EXTERNAL CLASS.
*
* Custom list close for closing vertically.
* Should not be called directly, but from within List.close()
* @method jibo.face.views.List#closeVertical
* @param {Function} callback Function to be called once open is complete.
* @param {String} [transitionType] String used to determine way Component closes,
* refer to ViewManager for constants used.
* @param {number} [duration = ViewManager.TRANS_TIME] Duration of the transition.
* @param {String} [tweenType = 'backIn'] Type of tween used.
* @private
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL FROM EXTERNAL CLASS.
*
* Custom list open for opening from an EyeView.
* Should not be called directly, but from within List.open()
* @method jibo.face.views.List#openFromEye
* @param {Function} callback Function to be called once open is complete.
* @param {number} [duration = ViewManager.TRANS_TIME] Duration of the transition.
* @private
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL FROM EXTERNAL CLASS.
*
* Custom list close for closing an EyeView.
* Should not be called directly, but from within List.close()
* @method jibo.face.views.List#closeToEye
* @param {Function} callback Function to be called once open is complete.
* @param {number} [duration = ViewManager.TRANS_TIME] Duration of the transition.
* @private
*/
/**
* Load and destroy elements dynamically based on page index.
* @method jibo.face.views.List#dynamicElementsPageChange
* @param {number} pageIndex - Page index to reference for dynamic loading, generally the current page.
* @private
*/
/**
* Enables recursive iteration through each asset descriptor in given object, loading each individually.
* This is to reduce the impact of one bad asset corrupting a load batch.
* @method jibo.face.views.List#iterativeLoad
* @param {any} assetsToLoad Object containing AssetDescriptors using their id as key
* @private
*/
/**
* Run through list of loading components and check to see if their required assets have been loaded.
* If assets are available update display.
* @method jibo.face.views.List#assignElementAssets
* @private
*/
/**
* Remove loader display and create Element's display now that assets are available.
* @method jibo.face.views.List#updateElementDisplay
* @param {jibo.face.views.Element} element - Element to update.
* @private
*/
/**
* Remove loader stand-in and create Element's display now that assets are available.
* @method jibo.face.views.List#emptyElementDisplay
* @param {jibo.face.views.Element} element - Element to empty display.
* @private
*/
/**
* Set the list element targets based on page index.
* This is used in conjunction with changePage().
* @method jibo.face.views.List#setTargetsByPage
* @param {number} pageIndex - we can expect that the pageIndex is possible
* @private
*/
/**
* Set the list element targets based on touch input.
* This is used when panning the list.
* @method jibo.face.views.List#setTargetsByInput
* @param {number} panState The t of the pan, refer to Pan Case enum for valid states
* @param {number} velocity The velocity of the pan, equal to the delta of the mouse x position since last update
* @param {number} inputX - Position x of input.
* @private
*/
/**
* Updates the position of the list elements by springing them toward their targets.
* @method jibo.face.views.List#springUpdate
* @private
*/
/**
* Setup panning, determining the pan state and setting spring strength.
* The parameters are supplied by the GestureManager.
* @method jibo.face.views.List#pan
* @param {number} inputX - Position x of input.
* @param {number} velocity - Distance input has moved since last GestureManager dispatch.
* @private
*/
/**
* Stop panning.
* @method jibo.face.views.List#panStop
* @private
*/
/**
* Handler for events sent from pan gesture.
* @method jibo.face.views.List#onPanEvent
* @param {Object} event - Event object sent from HammerJS's Pan gesture.
* @private
*/
/**
* Check the input events received from the gesture manager.
* @method jibo.face.views.List#checkGestureInput
* @param {Boolean} active - Flag determining if pan is active.
* @param {Number} [inputX = 0] - Current x position of pan input.
* @param {Number} [deltaX = 0] - Difference between start position on current position of pan input.
* @private
*/
/**
* Default transition for removing a list element.
* @method jibo.face.views.List#elementRemovalTransition
* @param {jibo.face.views.Element} element - Element from list to destroy
* @param {Function} done - Callback when transition is complete
* @private
*/
/**
* Destroy a single element, removal of element form the list is handle in List.
* Removes assets associated with Element, while checking for asset conflicts.
* @method jibo.face.views.List#destroyElement
* @param {jibo.face.views.Element} element - Element from list to destroy
* @param {Function} [done] - Callback when destruction of element is complete
* @private
*/
/**
* Merge Component configurations together.
* @method jibo.face.views.List#mergeConfigs
* @param {Object} data - Object that defaultData is merging into and that will be returned.
* @param Object} defaultData - Object to merge into data
* @param {Boolean} [mergeArrays = true] - if `true` will merge Arrays together, if 'false' arrays will overwrite each other.
* @returns {Object} - resulting object from merge.
* @private
*/
/**
* Returns page index that has been tested against the number of elements in list.
* Does not adjust the original parameter.
* @method jibo.face.views.List#normalizePageIndex
* @param {Number} pageIndex The index of the page
* @return {Number} the normalized page index
* @private
*/

112
docs/rendering/gui/components/ListProgress.js Normal file
View File

@@ -0,0 +1,112 @@
/**
* @typedef jibo.face.views.ListProgress~ListProgressOptions
* @description Interface - Configuration values for creating a ListProgress.
* @prop {number} [width] - Value for the desired width of the component.
* @prop {number} [height] - Value for the desired height of the component.
* @prop {number} [backgroundColor] - Background color value.
* @prop {number} [progressColor] - Progress color value.
* @prop {Object} [position] - An object with 'x' and 'y' properties.
*/
/**
* Indicate current position (page) while navigating in MenuView.
*
* @class ListProgress
* @extends jibo.face.views.Element
* @memberof jibo.face.views
*/
/**
* Default value for WIDTH of the component.
* @name jibo.face.views.ListProgress.DEFAULT_WIDTH
* @type {number}
* @readOnly
* @private
*/
/**
* Default value for HEIGHT of the component.
* @name jibo.face.views.ListProgress.DEFAULT_HEIGHT
* @type {number}
* @readOnly
* @private
*/
/**
* Default value for backgroundColor of the component.
* @name jibo.face.views.ListProgress.BACKGROUND_COLOR
* @type {number}
* @readOnly
* @private
*/
/**
* Default value for progressColor of the component.
* @name jibo.face.views.ListProgress.PROGRESS_COLOR
* @type {number}
* @readOnly
* @private
*/
/**
* Set of options which are used to specify position, size and look of progress bar
* @name jibo.face.views.ListProgress#_listProgressOptions
* @type {jibo.face.views.ListProgress~ListProgressOptions}
* @private
*/
/**
* Graphics instance that represents progress bar
* @name jibo.face.views.ListProgress#_progressDisplay
* @type {PIXI.Graphics}
* @private
*/
/**
* Graphics instance that represents background
* @name jibo.face.views.ListProgress#_backgroundDisplay
* @type {PIXI.Graphics}
* @private
*/
/**
* Last passed-in page index from MenuView
* @name jibo.face.views.ListProgress#_pageIndex
* @type {number}
* @private
*/
/**
* Last passed-in pages count from MenuView
* @name jibo.face.views.ListProgress#_pagesCount
* @type {number}
* @private
*/
/**
* The radius of the round corner to be drawn on the left and right of the progress bar
* @name jibo.face.views.ListProgress#_cornerRadius
* @type {number}
* @private
*/
/**
* Set up the display.
* Assign assets, set timelines, etc.
* @method jibo.face.views.ListProgress#setupDisplay
* @param {Object} [assets] Object passed back from loader namespace load method,
* refer to {@link jibo.loader} for detail
*/
/**
* Updates progress position based on provided current page and pages quantity available in the MenuView
* @method jibo.face.views.ListProgress#updatePage
* @param {number} [pageIndex = -1] Index of the current page
* @param {number} [pagesCount = -1] Number of pages available in MenuView
*/
/**
* Retrieves the actual height of the component.
* @method jibo.face.views.ListProgress#getHeight
* @type {Number}
*/

152
docs/rendering/gui/components/MenuButton.js Normal file
View File

@@ -0,0 +1,152 @@
/**
* @interface jibo.face.views.MenuButton~MenuButtonOptions
* @extends jibo.face.views.StandardButton~StandardButtonOptions
* @description Interface describing data provided in the config.
* @prop {Number[]|String} [colors] - Array with colors that can be used for button filling.
* @prop {String} [label] - Value for the text label to be shown for the button.
* @prop {String} [iconSrc] - Path to the icon placed inside of the button.
*/
/**
* @interface jibo.face.views.MenuButton~ButtonData
* @description Interface for required data for MenuButton types.
* @prop {String} assetPath - Path to button timeline source.
* @prop {jibo.face.views.Element~DimensionData} dimensions - Width and height of button.
* @prop {String} [cache] - Optionally define cache.
*/
/**
* Menu button.
*
* @class MenuButton
* @extends jibo.face.views.StandardButton
* @memberof jibo.face.views
*/
/**
* The default class identifier.
* Generally used to register the class.
* @name jibo.face.views.MenuButton.DEFAULT_TYPE
* @type {String}
* @readOnly
*/
/**
* Text to appear below the MenuButton
* @name jibo.face.views.MenuButton#label
* @type {String}
*/
/**
* MovieClip that may be placed inside of the MenuButton instead of a static image
* @name jibo.face.views.MenuButton#iconMovieClip
* @type {PIXI.animate.MovieClip}
*/
/**
* Array of 2 colors to be applied to button base.
* @name jibo.face.views.MenuButton#_colors
* @type {number[]}
* @private
*/
/**
* Mapping for button-specific data.
* @name jibo.face.views.MenuButton#_buttonURIs
* @type {Object}
* @private
*/
/**
* String identifier for skill button.
* @name jibo.face.views.MenuButton.SKILL
* @type {string}
* @readOnly
*/
/**
* String identifier for action button.
* @name jibo.face.views.MenuButton.ACTION
* @type {string}
* @readOnly
*/
/**
* String identifier for large action button.
* @name jibo.face.views.MenuButton.ACTION_BIG
* @type {string}
* @readOnly
*/
/**
* The predefined dimensions of the button.
* This only returns the dimensions that have been explicitly set;
* it does not return the dimensions of the display itself.
* @name jibo.face.views.MenuButton#dimensions
* @type {jibo.face.views.Element~DimensionData}
* @readOnly
*/
/**
* Array of 2 colors to be applied to button base. If set to a value of `default`, `confirm`,
* or `cancel` uses the global color for that button type.
* @name jibo.face.views.MenuButton#colors
* @type {number[]}
*/
/**
* Get button data object.
* @method jibo.face.views.MenuButton.getButtonData
* @param {string} type - Type of button.
* @returns {jibo.face.views.MenuButton~ButtonData} ButtonData for the object.
* @protected
*/
/**
* Add button data object.
* @method jibo.face.views.MenuButton.addButtonData
* @param {string} type - Type of button.
* @param {string} assetPath - Path to button timeline src.
* @param {jibo.face.views.Element~DimensionData} dimensions - Width and height of button.
* @param {string} [cache] - Optionally define cache.
* @returns {jibo.face.views.MenuButton~ButtonData} ButtonData for the object.
* @protected
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Set up the display.
* Assign assets, set timelines, etc.
* @method jibo.face.views.MenuButton#setupDisplay
* @param {Object} [assets] Object passed back from loader namespace load method,
* refer to {@link jibo.loader} for detail.
*/
/**
* Set new icon for MenuButton.
* @method jibo.face.views.MenuButton#setIcon
* @param {PIXI.DisplayObject} icon DisplayObject instance to use as new icon.
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL EXTERNALLY.
* Define the interactive hit area of the display.
* The DisplayObject.hitArea is what Pixi uses to define the interactive area.
* @method jibo.face.views.MenuButton#setupHitArea
* @param {PIXI.Rectangle} [bounds] Optionally specify the bounds for the hit area.
* If not defined, defaults to using the display's bounds.
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Destroy.
* @method jibo.face.views.MenuButton#destroy
*/
/**
* Assign colors to display, works for 'Menu' style buttons.
* @method jibo.face.views.MenuButton#applyColors
* @private
*/

246
docs/rendering/gui/components/StandardButton.js Normal file
View File

@@ -0,0 +1,246 @@
/**
* Animates view according to its toggled state
* @callback jibo.face.views.StandardButton~ToggleAnimate
* @param {Boolean} toggleOn Value to assign to flag holding button's current toggle state
* @param {Boolean} [shouldAnimate = false] `true` to animate state change.
*/
/**
* @interface jibo.face.views.StandardButton~StandardButtonOptions
* @extends jibo.face.views.Element~ElementOptions
* @description Interface describing data provided in the config.
* @prop {Boolean} [willToggle] - Flag that indicates whether button will be toggleable or not.
* @prop {Boolean} [toggledOn] - Value indicating current state of the button
* @prop {jibo.face.views.StandardButton~ToggleAnimate} [toggleAnimate] - Function that performs animation for the changes of the toggling state
*/
/**
* StandardButton element.
* Describes general behavior for buttons when graphical asset responses to basic touch events.
*
* @class StandardButton
* @extends jibo.face.views.Button
* @memberof jibo.face.views
*/
/**
* The default class identifier.
* Generally used to register the class.
* @name jibo.face.views.StandardButton#DEFAULT_TYPE
* @type {String}
* @private
* @readOnly
*/
/**
* FOR OVERRIDE ONLY. DO NOT ALTER.
*
* The Class name as a string.
* @name jibo.face.views.StandardButton#_type
* @type {String}
* @protected
*/
/**
* Scale value for down state of button.
* @name jibo.face.views.StandardButton#downScale
* @type {number}
*/
/**
* Scale value for activate state of button.
* @name jibo.face.views.StandardButton#activateScale
* @type {number}
*/
/**
* Duration of tweens for button state changes.
* @name jibo.face.views.StandardButton#tweenTime
* @type {number}
*/
/**
* Flag that indicates whether button will be toggleable or not.
* @name jibo.face.views.StandardButton#willToggle
* @type {Boolean}
* @default false
*/
/**
* Flag that indicates whether button will do default down-state transitions
* @name jibo.face.views.StandardButton#disableStateAnimations
* @type {Boolean}
* @default false
*/
/**
* Flag determining current toggle state of the button
* @name jibo.face.views.StandardButton#_toggledOn
* @type {Boolean}
* @default false
* @private
*/
/**
* Create a StandardButton from a configuration Object derived from JSON.
* @method jibo.face.views.StandardButton.createFromConfig
* @param {Object} configData Object derived from JSON, must be a specific format refer to examples.
* @returns {jibo.face.views.StandardButton} The StandardButton created from the given configuration.
*/
/**
* Create a StandardButton object by passing the DisplayObject and specifying the {@link jibo.face.views.ActionData}.
* This allows for a more direct way to create Buttons that is not reliant on the configuration data.
* @method jibo.face.views.StandardButton.createFromDisplayObject
* @param {PIXI.DisplayObject} displayObject The DisplayObject with the button assets.
* @param {jibo.face.views.ActionData} [actionData] The action to be triggered on button click.
* @param {PIXI.Container} container Display container for the button.
* @returns {jibo.face.views.StandardButton} The created StandardButton.
*/
/**
* Optional function that implements animation switching of toggle state
* @name jibo.face.views.StandardButton#toggleAnimate
* @type {jibo.face.views.StandardButton~ToggleAnimate}
*/
/**
* Returns button's current toggle state value
* @method jibo.face.views.StandardButton#toggledOn
* @returns {Boolean} `true` if the button is currently toggled
* @readOnly
*/
/**
* The display containing the button assets.
* Additionaly this is the DisplayObject that transforms are applied to for button states.
* @name jibo.face.views.StandardButton#buttonDisplay
* @type {PIXI.Container}
* @readOnly
*/
/**
* 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.StandardButton#assignConfig
* @param {any} configData - Object derived from JSON containing values specific to StandardButton.
*/
/**
* Destroy display's children and stop tweens on content.
* @method jibo.face.views.StandardButton#emptyDisplay
*/
/**
* Set up the display.
* Assign assets, set timelines, etc.
* @method jibo.face.views.StandardButton#setupDisplay
* @param {Object} [assets] - Object passed back from loader namespace load method,
* refer to {@link jibo.loader} for details.
*/
/**
*
* Add asset to content container of button, content is effected by state change transitions (e.g. down, out, up)
* If the given asset is a PIXI.Sprite a center registration is applied,
* in all other cases it is expected that the assets has been given appropriate registration.
* @method jibo.face.views.StandardButton#addToContent
* @param {PIXI.DisplayObject} asset DisplayObject instance to be placed within content container.
* @param {PIXI.Container} [container] If not specified will uses default content container.
* @param {boolean} [emptyContent = false] If `true` will empty content of all children
*/
/**
* Method to change the state of the button and trigger visual change of the state
* @method jibo.face.views.StandardButton#toggle
* @param {Boolean} toggleOn Value to assign to flag holding button's current toggle state
* @param {Boolean} [animate = true] `true` to animate state change.
*/
/**
* Activate the button. Used for non-touch input.
* @method jibo.face.views.StandardButton#activate
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Handler for out-transition executed in {@link jibo.face.views.StandardButton#out}
* @method jibo.face.views.StandardButton#outTransition
* @protected
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Handler for toggleOut-transition executed in {@link jibo.face.views.StandardButton#out}
* @method jibo.face.views.StandardButton#toggleOutTransition
* @protected
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Handler for down-transition executed in {@link jibo.face.views.StandardButton#down}
* @method jibo.face.views.StandardButton#downTransition
* @protected
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Handler for toggleDown-transition executed in {@link jibo.face.views.StandardButton#down}
* @method jibo.face.views.StandardButton#toggleDownTransition
* @protected
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Handler for up-transition executed in {@link jibo.face.views.StandardButton#up}
* @method jibo.face.views.StandardButton#upTransition
* @protected
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Handler for toggleUp-transition executed in {@link jibo.face.views.StandardButton#up}
* @method jibo.face.views.StandardButton#toggleUpTransition
* @protected
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Animation for simple button behavior when it's pressed down
* @method jibo.face.views.StandardButton#animateDown
* @protected
*/
/**
* FOR OVERRIDE ONLY. DO NOT CALL.
*
* Animation for simple button behavior when touch event is released
* @method jibo.face.views.StandardButton#animateUp
* @protected
*/
/**
* This method takes array of functions and starts them asynchronously
* @method jibo.face.views.StandardButton#executeAsyncTransitions
* @param {any[]} [transitionArray] Array of transition functions to be executed in parallel
* @param {Function} [callback] Function to execute once execution is done
* @private
*/
/**
// * Handler for when transitions are all complete.
// * @method jibo.face.views.StandardButton#transitionComplete
// * @param {Function} callback The callback triggered once transitions are completed
// * @param {Error} [err] Error returns if there is an issue with the asynchronous method.
// * @param {any[]} [results] Results returned from asynchronous method, will be empty.
// * @private
// */

31
docs/rendering/gui/components/subcomponents/ListMember.js Normal file
View File

@@ -0,0 +1,31 @@
/**
* Subcomponent identifier.
* @name jibo.face.views.ListMember.ID
* @type {String}
* @default 'ListMember'
* @readOnly
*/
/**
* Target position of list member.
* @name jibo.face.views.ListMember.targetPosition
* @type {PIXI.Point}
*/
/**
* Velocity of list member.
* @name jibo.face.views.ListMember.velocity
* @type {PIXI.Point}
*/
/**
* Offset from target.
* @name jibo.face.views.ListMember.targetOffset
* @type {Number}
*/
/**
* If assets are loaded for owning Component.
* @name jibo.face.views.ListMember.loaded
* @type {Boolean}
*/

39
docs/rendering/gui/components/subcomponents/Subcomponent.js Normal file
View File

@@ -0,0 +1,39 @@
/**
* Subcomponent identifier.
* @name jibo.face.views.Subcomponent.TYPE
* @type {String}
* @default 'TouchInteractive'
* @readOnly
*/
/**
* Type of Subcomponnet, used for identification
* @name jibo.face.views.Subcomponent#type
* @type {String}
* @readOnly
*/
/**
* Owning Component.
* @name jibo.face.views.Subcomponent.component
* @type {Boolean}
* @protected
*/
/**
* Type of Subcomponent, used for mapping storage and retrieval.
* @name jibo.face.views.Subcomponent._type
* @type {String}
* @private
*/
/**
* Initialize Subcomponent.
* @method jibo.face.views.Subcomponent#init
* @param {jibo.face.views.Component} component - Component this Subcomponent is being added to.
*/
/**
* Destroy.
* @method jibo.face.views.Subcomponent#destroy
*/

64
docs/rendering/gui/components/subcomponents/TouchInteractive.js Normal file
View File

@@ -0,0 +1,64 @@
/**
* Subcomponent identifier.
* @name jibo.face.views.TouchInteractive.TYPE
* @type {String}
* @default 'TouchInteractive'
* @readOnly
*/
/**
* Whether interactivity is active or not.
* @name jibo.face.views.TouchInteractive.isActive
* @type {Boolean}
*/
/**
* Object of array of actions, with gesture type as key.
* @name jibo.face.views.TouchInteractive._gestureActions
* @type {Object.<string, jibo.face.views.ActionData>}
* @private
*/
/**
* Destroy
* @method jibo.face.views.TouchInteractive#destroy
*/
/**
* Add a {@link jibo.face.views.ActionData}. All actions with will be triggered on triggerActions.
* Generally these actions are triggered on a screen press (if a screen press is set up).
* @method jibo.face.views.TouchInteractive#addAction
* @param {jibo.face.views.ActionData} actionData - The action to be triggered on tap.
* @param {boolean} [clearPrevious = false] Flag to determine if we should clear out the existing actions.
* @param {boolean} [toFront = false] If `true` adds action to front of actions list, causing it to be called first when actions are triggered.
* @param {jibo.face.views.GESTURE} [gesture = 'tap'] Gesture actions are related to.
* @returns {jibo.face.views.ActionData} The ActionData added.
*/
/**
* Returns `true` if there are actions associated with given gesture type.
* @method jibo.face.views.TouchInteractive#hasActions
* @param {jibo.face.views.GESTURE} [gesture = 'tap'] Gesture actions are related to.
* @returns {boolean} `true` if there are actions associated with given gesture type.
*/
/**
* Get actions associated with given gesture type.
* @method jibo.face.views.TouchInteractive#getActions
* @param {jibo.face.views.GESTURE} [gesture = 'tap'] Gesture actions are related to.
* @return {jibo.face.views.ActionData[]} Actions associated with the given gesture type.
*/
/**
* Clear all actions associated with given gesture type.
* @method jibo.face.views.TouchInteractive#clearActions
* @param {jibo.face.views.GESTURE} [gesture = 'tap'] Gesture actions are related to.
*/
/**
* Trigger actions associated with given gesture type.
* Calls Component or the Component parent's actionHandler for each action.
* @method jibo.face.views.TouchInteractive#triggerActions
* @param {jibo.face.views.GESTURE} [gesture = 'tap'] Gesture actions are related to.
* @return {boolean} `true` if at least one action was triggered.
*/