MAF.control.MetadataDisplay

This is a component that can be attached to a grid to display metadata when a cell is selected. Default it will look for label or text key in the cell data item.

new MAF.control.MetadataDisplay()

Example

var metaData = new MAF.control.MetadataDisplay({}).appendTo(this);
metaData.attachToSource(grid);

Configs

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);

focus : {Boolean} inherited

Initializes the component with the ability to focus or not. Default is true (enabled focus).

id : {String} inherited

The unique id of this class

metadataMap : {Object}

When the metadata you want to be displayed is stored on a different key then the default values (label, text) you can use this.

Example
var metaData = new MAF.control.MetadataDisplay({
  metadataMap: {
     label: 'description'
  }
}).appendTo(this);
metaData.attachToSource(grid);

secure : {Boolean} inherited

Indicates if the button is locked with an Admin PIN. Default is false.

styles : {Object} inherited

CSS styles for the component:

Name Type Argument Default Description
width Number

The width of this component in pixels.

height Number

The height of this component in pixels.

hAlign String optional  left

Horizontal alignment of this component. (left, center, right)

vAlign String optional  top

Vertical alignment of this component. (top, center, bottom)

hOffset Number optional 

Horizontal offset of this component in pixels.

vOffset Number optional 

Vertical offset of this component.

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() → {Class} inherited

Appends this component to a parent.

Returns:

This component.

attachToSource()

Attach this to a component to listen to state update events.

createContent() virtual inherited

After the component has appended to the view this method can be used to create some more content to be added to this component. This can be implemented (or overridden) by objects that inherit the member.

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.

focus() inherited

This will try and focus this component. If it cannot recieve focus, this focus will stay on the currently focused component.

freeze() → {Class} inherited

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

Returns:

This component.

generateStatePacket() private inherited

Gives a object containing values needed for keeping the state of this component between different views.

getAbsolutePosition() → {Object} inherited

Give back the position relative to its first positioned ancestor element

Returns:

{hOffset:Number, vOffset: Number}

getSourceDataItem(index) → {Object}

Get the data object of a cell.

Parameters:

Name Type Description
index Number

Cell index.

Returns:

Data object of the cell identified by the index.

getSourceFocusIndex() → {Number}

Get the index of the cell that has focused on the attached source.

Returns:

Cell index number

getSourceStartIndex() → {Number}

Get the start index of the cell on the attached source.

Returns:

Cell index number

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

inspectStatePacket() inherited

Handle the state of this component for example when returning on the view it is on.

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.

removeSkin() → {MAF.Class} inherited mixin

Remove all skins from the Class

Returns:

This

renderSkin(name, state, agrs) inherited mixin

If a renderskin method is defined in the Theme of the class, that methods result gets injected onto the component.

Parameters:

Name Type Argument Description
name String

Skin name to render

state String optional 

State of the skin.

agrs Object optional 

Optional arguments

retrieve(key) inherited mixin

Retrieves a value from the storage.

Parameters:

Name Type Description
key String

Retrieves the value if key exists.

setDisabled(disabled) inherited

Change the disabled state of the component. A disabled component will not be able to recieve focus.

If not changed in extended component it will also set opacity to 05 when disabled.

Parameters:

Name Type Argument Default Description
disabled boolean optional  false

True will disable the component, false will enable it.

setSecure(secure) → {Class} inherited

Parameters:

Name Type Description
secure boolean

Returns:

This component.

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

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.

toggleDisabled() → {Class} inherited

Toggle between the disable states of the component.

Returns:

This component.

toggleSecure() → {Class} inherited

Toggle between the secure states of the component.

Returns:

This component.

verifySecure() inherited

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.

onBlur

Fired when the component is blurred.

onFocus

Fired when the component recieves focus.

onNavigate

Fired when a navigation happens when the component has focus.

onSecureFailed

Fired when the component is secured and it fails to verify the security after a select.

onSelect

Fired when the component is selected.