Class: Button

<!-- Play Media Button -->
<img id="uniqueid2"
    class="videoPlayButton button"
    data-widget="BUTTON"
    data-action="PLAY_MEDIA"
    data-target="uniqueid1"
    src="../assets/videoplay.png" />

<div data-widget="BUTTON" data-action="TOGGLE_POPUP,TOGGLE_MEDIA" data-target="popup_id,video_id">
  <img class="example_class" src="example_img.png" />
</div>

<!-- UniqueID1 - Audio widget -->
<div id="uniqueid1"
    data-widget="AUDIO"
    data-audio-type="inline"
    data-src="../assets/some-audio.mp3"
    style="position:absolute;left:-9999px;" >
</div>

<!-- UniqueID2 - Popup widget-->
<div id="uniqueid2"
    class="hiddenPopup"
    data-layer="popupLayer"
    data-widget="POPUP">
    <p>Some content inside the popup</p>
    <img src="../assets/popup-content-image.png />
</div>

<!-- UniqueID3 - Button to fire audio widget -->
<div id="uniqueid3"
    data-widget="BUTTON"
    data-action="PLAY_MEDIA,TOGGLE_POPUP"
    data-target="uniqueid1,uniqueID2"
    style="position:absolute;left:-9999px;">
</div>

<!-- UniqueID4 - Transformable - Triggers button on drop -->
<div id="uniqueid4"
     data-widget="TRANSFORMABLE"
     data-moveable="true"
     data-dropzone-target="dropzone-id"
     data-dropzone-action-target="uniqueid3">
    <img src="../assets/some-image.png" />
</div>

Extends

• PR.BaseWidget

Members

action_String

The action associated with the button. The value of the 'data-action' attribute is stored in this variable.

Source:

• widgets/Button.js, line 303

elHTMLDivElement

The HTML element for the button

Source:

• widgets/Button.js, line 329

idstring

The id of the HTML element

Source:

• widgets/Button.js, line 335

outsideProximityboolean

Has the interaction event moved outside of the proximity

Source:

• widgets/Button.js, line 315

proximitynumber

click/tap proximity

Source:

• widgets/Button.js, line 353

startXnumber

x coord of click/tap

Source:

• widgets/Button.js, line 341

startYnumber

y coord of click/tap

Source:

• widgets/Button.js, line 347

userInteractionboolean

Does the button respond to user interaction?

Source:

• widgets/Button.js, line 309

Methods

checkProximity( start, end ) → {boolean}

Checks to see whether two numbers are within the proximity setting (note: this is one-dimensional, params are numbers, not coords or points).
Proximity is set as a constant for this widget, referenced by this.proximity.

Parameters:

Name	Type	Description
start	number	the first number (usually referencing start location)
end	number	the last number (usually referencing end location)

Returns:

boolean

true if both params are within the proximity, false otherwise

Example:

undefined

Source:

• widgets/Button.js, line 722

To Do:

• this should probably be moved to core/utils

getDataAction( ) → {*}

Getter for the action_ variable.

Returns:

*

Source:

• widgets/Button.js, line 693

handleEvent( event )

Default handler that's triggered automatically, if interaction events are added with 'this' as a handler.
This way scope is automatically resolved without using bind(this).

Parameters:

Name	Type	Description
event

Source:

• widgets/Button.js, line 561

initialize( element )

Acts like a constructor, this function triggered by default when you create an object.

Parameters:

Name	Type	Description
element		The HTML DOM element which acts like a slideshow.

Throws:

Error HTML element not attached.

Source:

• widgets/Button.js, line 364

onTap_( event )

Event handler when a button is pressed

Parameters:

Name	Type	Description
event	event

Source:

• widgets/Button.js, line 397

setDataAction( action )

Setter for the action_ variable.

Parameters:

Name	Type	Description
action

Source:

• widgets/Button.js, line 701