YAHOO.namespace('Plank.Client.Powderroom');

YAHOO.Plank.Client.Powderroom.Quiz = function () {
	var Dom = YAHOO.util.Dom, Event = YAHOO.util.Event;
	
	var answerKey = [1, 1, 0, 1, 0, 0, 0, 1, 0, 0];
	var input     = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
	
	Event.on(window, 'load', function() {
		
		// Hide result boxes
		hideAnswers();

		Event.on('bladder', 'click', function(ev) {
			var tar = Event.getTarget(ev);
			var components;
			
			var button = Dom.get('submit-quiz');
			var elClass = button.getAttribute("class");
			elClass = elClass ? elClass : button.getAttribute("className");

			var lang = elClass.split('_')[0];
			
			if (tar.tagName.toLowerCase() == 'input' && tar.id != 'submit-quiz') {
				
				components = tar.id.split('-'); // 0 -> irrelevant, 1-> id, 2-> button value (true, false)
				identifier = components[0] + '-' + components[1];
				
				// Perform style switching
				if (components[2] == 'true') {
					switchStyles(tar, identifier + '-false', lang);
					code = 1;
				}
				else if (components[2] == 'false') {
					switchStyles(tar, identifier + '-true', lang);
					code = 0;
				}
				
				// Set the quiz question response value
				input[components[1]] = code;
				
			}
		});
		
		Event.on('submit-quiz', 'click', function(el) {
			var button = Dom.get('submit-quiz');
			var elClass = button.getAttribute("class");
			elClass = elClass ? elClass : button.getAttribute("className");

			var lang = elClass.split('_')[0];
			showResults(lang);
		});
	});
	
	// Helper functions
	function switchStyles(clickedElement, associatedElement, language) {
		if (Dom.hasClass(associatedElement, language + '_button_true_up')) {
			Dom.replaceClass(associatedElement, language + '_button_true_up', language + '_button_true_down');
		}
		else if (Dom.hasClass(associatedElement, language + '_button_false_up')) {
			Dom.replaceClass(associatedElement, language + '_button_false_up', language + '_button_false_down');
		}
		
		// Whatever happens, the clicked button should always have the *_up class
		if (Dom.hasClass(clickedElement, language + '_button_true_down') || Dom.hasClass(clickedElement, language + '_button_false_down')) {
			if (Dom.hasClass(clickedElement, language + '_button_true_down'))  Dom.replaceClass(clickedElement, language +  '_button_true_down', language +  '_button_true_up');
			if (Dom.hasClass(clickedElement, language + '_button_false_down')) Dom.replaceClass(clickedElement, language + '_button_false_down', language + '_button_false_up');
		}
	}
	
	function showResults(language) {
		var score = calculateScore();
		var scoreElement = new YAHOO.util.Element('score');
		var answers = Dom.getElementsByClassName('answer', 'div', 'bladder');
		var blocks  = Dom.getElementsByClassName('result', 'span', 'bladder');
		
		for (var i=0; i<answers.length; i++) {
					
			var block	   = new YAHOO.util.Element(blocks[i]);
				
			if (answerKey[i] === input[i]) {
				if (language === 'fr') message = 'R&eacute;sit!';
				else message = 'Correct!';
				
				block.set('innerHTML', message);
			}
			else {
				if (language === 'fr') message = 'Mauvaise r&eacute;ponse.';
				else message = 'Incorrect';
				
				block.set('innerHTML', message);
			}

		}
		
		Dom.setStyle(answers, 'display', 'block');
		Dom.setStyle('results', 'display', 'block');
		
		scoreElement.set('innerHTML', score);
	}
	
	function hideAnswers() {
		answers = Dom.getElementsByClassName('answer', 'div', 'bladder');
		Dom.setStyle(answers, 'display', 'none');
		Dom.setStyle('results', 'display', 'none');
	}
	
	function calculateScore() {
		var score = 0;
		
		for (var i=0; i<answerKey.length; i++) {
			if (answerKey[i] == input[i]) score++;
		}
		return score;
	}

}();