diff options
author | Cristhofer Travieso <cristhofert97@gmail.com> | 2013-11-02 17:15:49 (GMT) |
---|---|---|
committer | Cristhofer Travieso <cristhofert97@gmail.com> | 2013-11-02 17:15:49 (GMT) |
commit | 90a4b10d3d3bb7f0576bd19c675b7b83aa11958b (patch) | |
tree | fb077ddb68a9330436da0be4f214e74083a2e9d5 /lib/sugar-web/graphics/radiobuttonsgroup.js | |
parent | 99e261d5c2f483842f76d479bd668c6f133ab777 (diff) |
Add css directory ,lib directory and index2.html file. Create toolbar and stop button
Signed-off-by: Cristhofer Travieso <cristhofert97@gmail.com>
Diffstat (limited to 'lib/sugar-web/graphics/radiobuttonsgroup.js')
-rw-r--r-- | lib/sugar-web/graphics/radiobuttonsgroup.js | 59 |
1 files changed, 59 insertions, 0 deletions
diff --git a/lib/sugar-web/graphics/radiobuttonsgroup.js b/lib/sugar-web/graphics/radiobuttonsgroup.js new file mode 100644 index 0000000..712681b --- /dev/null +++ b/lib/sugar-web/graphics/radiobuttonsgroup.js @@ -0,0 +1,59 @@ +define(function () { + var radioButtonsGroup = {}; + + // ## RadioButtonsGroup + // + // A group of elements where only one can be active at the same + // time. + // + // When an element is clicked, it becomes the active one. The + // active element gains the 'active' CSS class. + // + // Parameters: + // + // * **elems** Array of elements of the group. + radioButtonsGroup.RadioButtonsGroup = function (elems) { + this.elems = elems; + var active; + + for (i = 0; i < elems.length; i++) { + var elem = elems[i]; + elem.addEventListener("click", clickHandler); + + // The first element that has 'active' CSS class is made + // the active of the group on startup. + if (active === undefined && elem.classList.contains('active')) { + active = elem; + } + } + + // If no element has 'active' CSS class, the first element of + // the array is made the active. + if (active === undefined) { + active = elems[0]; + updateClasses(); + } + + function clickHandler(evt) { + active = evt.target; + updateClasses(); + } + + function updateClasses() { + for (i = 0; i < elems.length; i++) { + var elem = elems[i]; + elem.classList.remove('active'); + } + active.classList.add('active'); + } + + // Get the active element. + this.getActive = function () { + return active; + }; + + }; + + return radioButtonsGroup; + +}); |