/*
* abacus.js – a script for running an online abacus
*/

// holds the value displayed by the abacus all the time
var amount = 0;
// holds the current value of each row
var vals = [0,0,0,0,0,0,0,0,0,0];
// indicates, if the modern view is switched on
var modernView = false;
// indicates, if the hints are switched on
var hints = false;
// determines the language set
var lang = 'de';

// does what the user (hopefully) expects clicking on a bead
function honourBead(rowIndex,beadIndex) {
	// the containing row : Element
	var container = $$('.exp'+rowIndex)[0];

	// the value to which the row was set before : int[0;10]
//	var prevValue = container.getAttribute('title');
	var prevValue = vals[rowIndex+3];
	
	// the user clicks on the bead, which is currently set, indicating that he wishes to move it back right
	if (prevValue >= beadIndex) beadIndex--;
	
	// set the row to the desired state and calculate the new overall value
	setRow(rowIndex,beadIndex);
	// prevents odd "-0.000" state
	if (amount < 0) amount *= -1;
	// writes the calculated value to the input field
	lang == 'en' ? $('amount').value = amount.toFixed(3) : $('amount').value = amount.toFixed(3).replace(/\./,',');
} 

// sets the row defined by the row index "rowIndex" to the value "value"
function setRow(rowIndex,value) {
	// error handling
	var error = '';
	if ((rowIndex<-3)||(rowIndex>6)) error += 'The rows to represent this number are not present in this abacus. ';
	if (value < 0 || value > 10 ) error += 'Somehow, the value to be assigned to row '+rowIndex+' was set incorrectly ('+value+'). ';
	if (error) {
		return error;
	}
	
	// the containing row : Element
	var container = $$('.exp'+rowIndex)[0];

	// the value to which the row was set before : int[0;10]
	var prevValue = vals[rowIndex+3];

	// is any action to be taken?
	if (!(value==prevValue)) {
		// does the user wish to see animations?
		var animation = $('animation').checked;

		if (prevValue > 0) {
			// the bead (if any) which has currently the margin : Element
			var prevBead = container.select('.bead'+prevValue)[0];
			animation ? prevBead.morph('margin-right:1px;', {duration: 0.2}) : prevBead.style.marginRight = '1px';
		}

		if (value > 0) {	
			// the bead to be shifted (if any) : Element
			var bead = container.select('.bead'+value)[0];
			animation ? bead.morph('margin-right:120px;', {duration: 0.2}) : bead.style.marginRight = '120px';
		}

		//logging the new row value
		vals[rowIndex+3] = value;

		// the math part
		// the difference between the old and new overall value
		var diff = (value - prevValue)*Math.pow(10,rowIndex);
		amount += diff;
	}
}

// sets the abacus
function setAbacus(value) {
	for (var i = 6; i > -4; i--) {
		setRow(i,getDigit(value,i));
	}
}

// toggles the hints
function honourHints() {
	var beadHints = $$('.beadLabel');
	if (hints) {
		hints = $('hints').checked;
		Effect.Fade('rowLabels');
		for (var i in beadHints) beadHints[i].style.visibility = 'hidden';
	} else {
		hints = $('hints').checked;
		Effect.Appear('rowLabels');
		for (var i in beadHints) beadHints[i].style.visibility = 'visible';
	}
}

// toggles the advanced controls
function honourView() {
	if (modernView) {
		Effect.SlideUp('modern', {duration: 0.5});
		switch (lang) {
			case 'en' :
				$('view').value = 'revamp abacus';
				break;
			case 'ru' :
				$('view').value = 'модернизировать счёты';
				break;
			default:
				$('view').value = 'Abakus modernisieren';
		}
		modernView = false;
	} else {
		Effect.SlideDown('modern', {duration: 0.5});
		switch (lang) {
			case 'en' :
				$('view').value = 'classic view';
				break;
			case 'ru' :
				$('view').value = 'Классический вид';
				break;
			default:
				$('view').value = 'klassische Ansicht';
		}
		modernView = true;
	}
}
// sets the abacus to the value set in the input
function honourSet() {
	var input = $('amount');
	// parse the input and do what the user expects
	setAbacus(input.value.replace(/,/,'.'));
	
	//clean up input
	lang == 'en' ? input.value = amount.toFixed(3) : input.value = amount.toFixed(3).replace(/\./,',');
	
	//set the clean value to amount
	amount = Number(input.value.replace(/,/,'.'));
					
	// prevents the page reload
	return false;
}

// resets the abacus
function honourReset() {
	setAbacus(0);
	amount = 0;
	lang == 'en' ? $('amount').value = '0.000' : $('amount').value = '0,000'
}

// adds the corresponding setRow()-invocation to each and every bead
function addBeadHandlers() {
	for (var rowIndex = -3; rowIndex < 7; rowIndex++) {
		for (var beadIndex = 1; beadIndex<11; beadIndex++) {
				$$('.exp'+rowIndex+' .bead'+beadIndex)[0].onmousedown = new Function('honourBead('+rowIndex+','+beadIndex+');');
		}
	}
}
// adds the event handlers
init = function () {
	// determines the language set by TYPO3	
	if ((window.location.search).indexOf('L=en') > -1) lang = 'en';
	if ((window.location.search).indexOf('L=ru') > -1) lang = 'ru';

	// adds the event handlers for each and every bead (loop)	
	addBeadHandlers();

	// makes the abakus display the entered number (returns false to prevent the page reload)
	$('setForm').onsubmit = honourSet;
	// resets the abacus
	$('reset').onclick = honourReset;
	// toggles the advanced controls
	$('view').onclick = honourView;
	// toggles the hints
	$('hints').onclick = honourHints;

	var input = $('amount');
	input.onfocus = input.select;
	//(re)sets the form field
	input.value = amount;
	
	// anticipates the users preferences
	$('animation').checked = true;
	$('hints').checked = false;
	
	//IE can't display non-"latin-1" signs
	if (Prototype.Browser.IE) $('set').value = '!';
}

window.onload = init;