You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
62 lines
1.6 KiB
62 lines
1.6 KiB
define(function () {
|
|
|
|
'use strict';
|
|
|
|
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 (var 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;
|
|
|
|
});
|