Caph Class: Icon

new Icon(property)

A class which provides various basic icons in stripe theme. This component has intended to have fixed size according to resolution. If you change the size of this component, do not assure the appearance.

Parameters:

Name	Type	Description
`property`	Object	An object which initializes this component. Refer to the details in caph.ui.base.component.Icon constructor.

Since:

2.0.0

Example

var bgm = caph.stripe.ui.component.Icon.bgm(); // a predefined icon.

 var busy = new caph.stripe.ui.component.Icon({ // a user defined icon.
     prefix: 'my-icon-', // optional
     type: 'busy' // mandatory
 });

Extends

caph.ui.base.component.Icon

Methods

<static> bgm() → {caph.stripe.ui.component.Icon}

Returns a bgm icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.bgm();

<static> bgmOff() → {caph.stripe.ui.component.Icon}

Returns an off status bgm icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.bgmOff();

<static> del() → {caph.stripe.ui.component.Icon}

Returns a delete icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.del();

<static> equalizer() → {caph.stripe.ui.component.Icon}

Returns an equalizer icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.equalizer();

<static> exit() → {caph.stripe.ui.component.Icon}

Returns a exit icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.exit();

<static> favorite() → {caph.stripe.ui.component.Icon}

Returns a favorite icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.favorite();

<static> ff() → {caph.stripe.ui.component.Icon}

Returns a fast forward icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.ff();

<static> folder() → {caph.stripe.ui.component.Icon}

Returns a folder icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.folder();

<static> helpB() → {caph.stripe.ui.component.Icon}

Returns a blue button icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.helpB();

<static> helpG() → {caph.stripe.ui.component.Icon}

Returns a green button icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.helpG();

<static> helpR() → {caph.stripe.ui.component.Icon}

Returns a red button icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.helpR();

<static> helpY() → {caph.stripe.ui.component.Icon}

Returns a yellow button icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.helpY();

<static> lock() → {caph.stripe.ui.component.Icon}

Returns a lock icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.lock();

<static> movieClip() → {caph.stripe.ui.component.Icon}

Returns a movie clip icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.movieClip();

<static> music() → {caph.stripe.ui.component.Icon}

Returns a music icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.music();

<static> next() → {caph.stripe.ui.component.Icon}

Returns a next icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.next();

<static> pause() → {caph.stripe.ui.component.Icon}

Returns a pause icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.pause();

<static> photo() → {caph.stripe.ui.component.Icon}

Returns a photo icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.photo();

<static> play() → {caph.stripe.ui.component.Icon}

Returns a play icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.play();

<static> prev() → {caph.stripe.ui.component.Icon}

Returns a previous icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.prev();

<static> rating() → {caph.stripe.ui.component.Icon}

Returns a rating icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.rating();

<static> ratingHalf() → {caph.stripe.ui.component.Icon}

Returns a half rating icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.ratingHalf();

<static> record() → {caph.stripe.ui.component.Icon}

Returns a record icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.record();

<static> repeat() → {caph.stripe.ui.component.Icon}

Returns a repeat icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.repeat();

<static> repeatOff() → {caph.stripe.ui.component.Icon}

Returns an off status repeat icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.repeatOff();

<static> repeatOne() → {caph.stripe.ui.component.Icon}

Returns a repeat once icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.repeatOne();

<static> ret() → {caph.stripe.ui.component.Icon}

Returns a return icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.ret();

<static> rew() → {caph.stripe.ui.component.Icon}

Returns a rewind icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.rew();

<static> rotateLeft() → {caph.stripe.ui.component.Icon}

Returns a left rotation icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.rotateLeft();

<static> rotateRight() → {caph.stripe.ui.component.Icon}

Returns a right rotation icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.rotateRight();

<static> sb() → {caph.stripe.ui.component.Icon}

Returns a back icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.sb();

<static> search() → {caph.stripe.ui.component.Icon}

Returns a search icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.search();

<static> setting() → {caph.stripe.ui.component.Icon}

Returns a setting icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.setting();

<static> sf() → {caph.stripe.ui.component.Icon}

Returns a forward icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.sf();

<static> shuffle() → {caph.stripe.ui.component.Icon}

Returns a shuffle icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.shuffle();

<static> shuffleOff() → {caph.stripe.ui.component.Icon}

Returns an off status shuffle icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.shuffleOff();

<static> sound() → {caph.stripe.ui.component.Icon}

Returns a sound icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.sound();

<static> speaker() → {caph.stripe.ui.component.Icon}

Returns a speaker icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.speaker();

<static> usb() → {caph.stripe.ui.component.Icon}

Returns a usb icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.usb();

<static> voice() → {caph.stripe.ui.component.Icon}

Returns a voice icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.voice();

<static> zoomIn() → {caph.stripe.ui.component.Icon}

Returns a zoom in icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.zoomIn();

<static> zoomOut() → {caph.stripe.ui.component.Icon}

Returns a zoom out icon.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.zoomOut();

onblur()

A handler to listen for the blur event. When the icon loses a focus, the opacity value returns to original value. (0.8)

Since:

2.0.0

Example

No example available. This method is automatically called by "caph.module.event.Manager". See "caph.module.mixins.event.Observer" example for more details.

onclick()

A handler to listen for the click event. When the icon is clicked, icon becomes yellow color.

Since:

2.0.0

Example

No example available. This method is automatically called by "caph.module.event.Manager". See "caph.module.mixins.event.Observer" example for more details.

onfocus()

A handler to listen for the focus event. When the icon gets a focus, the opacity value sets to 1.

Since:

2.0.0

Example

No example available. This method is automatically called by "caph.module.event.Manager". See "caph.module.mixins.event.Observer" example for more details.

onkeydown(message)

A handler to listen for the key down event. When the enter key is pressed, icon becomes yellow color.

Parameters:

Name	Type	Description
`message`	caph.event.Message	A normalized event message.

Since:

2.0.0

Example

No example available. This method is automatically called by "caph.module.event.Manager". See "caph.module.mixins.event.Observer" example for more details.

setOption(property)

Sets this component properties. The default prefix is "caph-stripe-icon-".

Parameters:

Name	Type	Description
`property`	Object	Refer to the details in caph.ui.base.Component#setOption.

Since:

2.0.0

Example

var icon = new caph.stripe.ui.component.Icon({
     type: 'busy'
 });
 
 icon.setOpton({
     prefix: 'caph-stripe-icon-'
 });

setSelected(status) → {caph.stripe.ui.component.Icon}

Sets the selected status to the icon.

Parameters:

Name	Type	Description
`status`	Boolean	true is selected, false is not selected.

Since:

2.0.0

Returns:

Type: caph.stripe.ui.component.Icon

Example

var icon = caph.stripe.ui.component.Icon.bgm();
    icon.setSelected(true);