%META:TOPICPARENT{name="OATDOCIndex"}%
---+ combobutton.js

Creates a combobutton, which is a multi-functional button. It enables user to specify a callback action to be performed when it is clicked.

%TOC%

---++ Objects

---+++ OAT.Combobutton()

Creates a combobutton. Its main div is accessible as <tt>OAT.Combobutton::div</tt>.

---++ Methods

---+++ OAT.Combobutton::addOption(imagePath, textValue, callback)

Adds a new option, described as <tt>textValue</tt> with image located at <tt>imagePath</tt>. When this option is clicked, <tt>callback</tt> is called.

---+++ OAT.Combobutton::removeOption(index)

Removes <tt>index-th</tt> option.

---++ CSS classes

---+++ .combo_button

CSS class of the button options list.

---+++ .combo_image

CSS class of the dropdown clicker image.

---+++ .<nowiki>combo_button_option</nowiki>

CSS class of the button option div.

---+++ .<nowiki>combo_button_text</nowiki>

CSS class of the div with textual description of the option.

---+++ .<nowiki>combo_button_down</nowiki>

CSS class that is added/removed to option whenever the button is clicked/released.

---++ Example

<verbatim>
var cb = new OAT.Combobutton();
document.body.appendChild( cb.div );
cb.addOption("img1.gif", "option 1", function(){});
cb.addOption("img2.gif", "option 2", function(){});
cb.removeOption(0);
</verbatim>

CategoryDocumentation CategoryOAT CategoryOpenSource