MAF.element.TextGrid

Provides paging functionality on very long text through the use of a page or scroll indicator.

new MAF.element.TextGrid()

Example

createView: function () {
  this.controls.scrollIndication = new MAF.control.ScrollIndicator({
     styles: {
        width: 20,
        height: this.height,
        hAlign: 'right'
     }
  }).appendTo(this);

  this.controls.textGrid = new MAF.element.TextGrid({
     styles: {
        width: this.width - this.controls.scrollIndication.width,
        height: this.height
     }
  }).appendTo(this).attachAccessories(this.controls.scrollIndication);
}

Configs

anchorStyle : {String} inherited

Controls how the text is aligned in the component.

Defines if the grid needs to behave like a carousel. True will show the first view again after the last view has passed. Default false.

data : {String} inherited

The text that the component will display.

events : {Object} inherited

A object containing one or more event handlers to be added to this object during initialization.

The possible events are defined on each component.

Example
MAF.element.Core({
  events: {
     onAppend: function () {
     	// do something
     }
  }
}).appendTo(this);

firstLine : {Number} inherited

First line of text.

id : {String} inherited

The unique id of this class

styles : {Object} inherited

CSS styles for the component:

Name Type Description
truncation String

Indicate if the text will not fit inside the component box if it should truncate. Default it will not.

wrap Boolean

Display text in a single line or wrap the text. When setting the wrap property the styles.width config is required. Default is false.

totalLines : {Number} inherited

Total lines of text.

visibleLines : {Number} inherited

Number of text lines visible.

Methods

adopt(child) inherited mixin

Append a child or several children to this Class.

Parameters:

Name Type Argument Description
child MAF.Class repeatable 

Component or element you want to add.

animate(config) inherited

Parameters:

Name Type Description
config Object

A config object

Fires:

appendChild(child) → {MAF.Class} inherited mixin

This method appends a element as the last child of this Class.

Parameters:

Name Type Description
child ELement | MAF.Class

Component or element you want to add.

Fires:

  • event:onChildAppended
  • event:onAppend

Returns:

Returns this.

appendTo(parent) inherited mixin

Add this class element as a child to the specified class.

Parameters:

Name Type Description
parent MAF.Class

Which class to append to.

attachAccessories(arguments) → {Class}

This will take a array of components and will attach them to this component using the attachAccessory method.

Parameters:

Name Type Description
arguments Array

Array with classes able to attach to a source component.

Returns:

This component.

attachAccessory(accessory) → {Class}

This will take a single component and attach it to this component. This will trigger events to the class.

Parameters:

Name Type Description
accessory Class

Class which is able to attach to a source component.

Returns:

This component.

detachChild(child) → {Element} inherited mixin

Remove a child.

Parameters:

Name Type Description
child String | Number | Element

String can be first or last, Number is position of the child. Element is the child itself.

Returns:

The detached child element.

eliminate(key) inherited mixin

Removes a key from the storage.

Parameters:

Name Type Description
key String

Deletes the value if key exists.

empty() → {MAF.Class} inherited mixin

Remove all Children from this Class

Returns:

Returns this.

freeze() → {Class} inherited

Freezes this component. Screen renders no longer trigger until thawed.

Returns:

This component.

getAbsolutePosition() → {Object} inherited

Give back the position relative to its first positioned ancestor element

Returns:

{hOffset:Number, vOffset: Number}

getCurrentPage() → {Number}

Returns:

The page the component is currently on. Pages start at 0.

getPageCount() → {Number}

Returns:

The number of pages this component has.

getStartLine(pagenum) → {Number}

Parameters:

Name Type Description
pagenum Number

Pagenumber

Returns:

The first line of the page supplied by pagenum.

getStyle(key) → {Object} inherited mixin

This method returns the given CSS property value of element.

Parameters:

Name Type Description
key String

CSS property to fetch.

Returns:

CSS style requested.

getStylesCopy() → {Object} inherited mixin

Returns:

Cloned object with all the styles applied on this component.

getView() → {Class} inherited

Returns:

Returns the view this class is appended on.

hide() → {Class} inherited

Hides this component.

Returns:

This component.

initialize() inherited

Initialize the class

moveTo(parent) inherited mixin

Move the Class element to a different class.

Parameters:

Name Type Description
parent MAF.Class

Which class to move to.

removeChild(child) → {Element} inherited mixin

Remove a child.

Parameters:

Name Type Description
child String | Number | Element

String can be first or last, Number is position of the child. Element is the child itself.

Fires:

  • event:onChildRemoved

Returns:

The removed child element.

removeChildren() inherited mixin

Remove all children.

retrieve(key) inherited mixin

Retrieves a value from the storage.

Parameters:

Name Type Description
key String

Retrieves the value if key exists.

setStyle(key, value) → {MAF.Class} inherited mixin

Parameters:

Name Type Description
key String

CSS property to apply to on this element.

value Object

CSS value

Returns:

This

setStyles(styles) → {MAF.Class} inherited mixin

This method modifies element's CSS style properties. Styles are passed as a hash of property-value pairs in which the properties are specified in their camelized form.

Parameters:

Name Type Description
styles Object

Object with CSS styles to apply to the element.

Returns:

This

Example

.setStyles({
   backgroundColor: '#900',
   fontSize: '12px'
});

setText(text)

Set which text to display on this component.

Parameters:

Name Type Description
text String

The text

shift(direction) → {Class}

Parameters:

Name Type Description
direction String

A direction the page will change to. (left,right)

Returns:

This component.

show() → {Class} inherited

Shows this component.

Returns:

This component.

store(key, value) inherited mixin

Saves a value to be availeble on the instance this Library is placed.

Parameters:

Name Type Description
key String

Key needs to be string.

value Mixed

Supports the storing of Strings, Numbers, Objects, Arrays. basically any JSONeable value.

suicide() inherited mixin

Destroy and cleanup this Class and all its children.

thaw() → {Class} inherited

Thawes this component. Screen renders can trigger again.

Returns:

This component.

Events

onAnimationEnded

Fired when a animation on this component has ended.

onAppend

Fired when component has appended to a parent. Update visual appearances by applying a Theme style and rendering the skin.

onChange

Fired when a change happened.

onError

Fired when the source image had problems loading.

onLayoutChange

Fired when a the layout of the component has changed.

onLoaded

Fired when the source image finished loading.