// pre-select first 4 icons
function init(el) {
	var arr = new Array('b01','c01','g01','e01');
	for( var i = 0;i < 4;i++ ) {
		enable(document.getElementById(arr[i]));
	}
	prepareForm();
}

// unique selection of first 4
function selectOne(el) {
	var elements = el.parentNode.childNodes;
	for( var i = 0;i < elements.length;i++ ) {
		if ( elements[i].nodeType == 1 && elements[i].className != 'label' && elements[i].className != 'clear') {
			disable(elements[i]);
		}
	}
	enable(el);
	prepareForm();
}

// multiple selection, limit 6
var limit = 6;
var cnt = 0;
function selectMultiple(el) {
	var elements = el.parentNode.childNodes;
	if ( el.className == 'enabled' ) {
		disable(el);
		cnt--;
	} else {
		if ( cnt < limit ) {
			enable(el);
			cnt++;
		} else {
			alert('De Yooph-bar kan maximaal 10 iconen bevatten');
		}
	}
	prepareForm();
}

// enable icon
function enable(el) {
	el.src = el.src.replace('yoophbar_icons','yoophbar_icons_selected');
	el.className = 'enabled';
}
// disable icon
function disable(el) {
	el.src = el.src.replace('yoophbar_icons_selected','yoophbar_icons');
	el.className = '';
}

// prepare form data
function prepareForm() {
	var elements = document.getElementsByTagName('img');
	var icons = document.getElementById('yoophbar_form')['icons'];
	icons.value = '';
	for( var i = 0;i < elements.length;i++ ) {
		var el = elements[i];
		if ( el.className == 'enabled' ) {
			icons.value += el.id + ',';
		}
	}
	var val = icons.value;
	var lastchar = val.substring(val.length,(val.length-1));
	if ( lastchar == ',' ) val = val.slice(0, -1);
	icons.value = val;
}
// end