// soon to be JQUIZ plugin for jquery.
// Developed by Alex.
// reads html divs and presents them as multiple choise question.
// see example structure

/*
 * 
 * 
 * 
 * 	 example structure
 * 
 		<div id='question_1' title="Quiz">
		    What is the question?
			<ul>
				<li id='correct'>Option1</li>
				<li>Option2</li>
			</ul>
		</div>
		
		<div id='question_2' title="Quiz">
		    What is the question2?
			<ul>
				<li>Option 1</li>
				<li>Option 2</li>
				<li id='correct'>Option 3</li>
			</ul>
		</div>
		
		<div id='question_3' title="Quiz">
		    What is the question 3?
			<ul>
				<li>Option 1</li>
				<li>Option 2</li>
				<li id='correct'>Option 3</li>
			</ul>
		</div>	
 * 
 * 
 * 
 */

	var qid = 1;
	var score;	
	
	function startQuiz(){
		$(document).ready(function(){
			var totalQuestions = $("div[id^='question']").length;
			score = new Array(totalQuestions);
					
			$("#quiz > div > ul > li ").prepend("<input name='option' type='radio'/> ");
			$("#quiz > div[id^='question'] ").append("<div id='message'></div>");
			$("#quiz > div[id^='question'] ").append("<span id='nav'></span>");
					

			showQuestion(qid,totalQuestions);
		});	
	}

	var showQuestion = function(question,totalQuestions){
		var targetQuestion = "div[id='question_" + question +  "']";
		$(function() {
			if(!$(targetQuestion).dialog({
				bgiframe: true,
				autoOpen: true,
				modal: true,
				width: 680,
				buttons: {
					'Next ->' : function() {
						qid++;
						showQuestion(qid,totalQuestions);
						$(this).dialog('close');
					},		
					'<- Back' : function() {
						if(qid != 1)
						{
							qid--;
							showQuestion(qid,totalQuestions);
							$(this).dialog('close');
						}
					}
				
				}

			}).length)
			{
				theScore = calculateScore();
				$(targetQuestion).dialog('close');
				$('#quiz_end').dialog({bgiframe: true,autoOpen: true, modal: true, buttons:{'OK': function(){ $(this).dialog('close'); location.reload();} } });
				$('#quiz_end').append(theScore + " out of " + totalQuestions + " or " + calculatePercentage(theScore,totalQuestions) + "%" );
			}

			//open the dialog
			$(targetQuestion).dialog('open');


			// populate the nav
			$(targetQuestion + ' > span ').html(question+'/'+totalQuestions);
		

			// Change the buttons depending on question
			
			if(qid == 1)
			{
				$("button:contains('<- Back')").toggleClass('ui-state-disabled',true);
			}
			else
			{
				$("button:contains('<- Back')").toggleClass('ui-state-disabled',false);
			}

			if(qid == totalQuestions)
				$("button:contains('Next ->')").text('Finish');
			else
				$("button:contains('Finish')").text('Next ->');

			//add all behaviors
			$(targetQuestion + ' > ul > li').hover(
				      function(){
				          	$(this).addClass('highlight');
				        }, 
				        function(){
				        	$(this).removeClass('highlight');
				        }
			);

			$(targetQuestion + ' > ul > li').click(
					function(){ 

							$(this).children('input').attr('checked','checked');
							
							$(targetQuestion + ' > ul > li').removeClass('correct').removeClass('incorrect').removeClass('correct-message').removeClass('incorrect-message');
							$(targetQuestion + ' > div ').removeClass('correct-message').removeClass('incorrect-message');
							
							if($(this).attr('id') == 'correct')
							{
								$(this).addClass('correct');
								$(targetQuestion + ' > div ').html("That is correct!").fadeOut().fadeIn().fadeOut().fadeIn();
								$(targetQuestion + ' > div ').addClass('correct-message');
								score[question] = 1;
							}
							else
							{
								$(this).addClass('incorrect');
								$(targetQuestion + ' > div ').html("That is incorrect!").fadeOut().fadeIn().fadeOut().fadeIn();
								$(targetQuestion + ' > div ').addClass('incorrect-message');
								score[question] = 0;
							}
						}
			);	
			
		});

	};

	var calculateScore = function(){
		var total = 0;
		for(i=0; i<score.length; i++) { 
			   if(score[i])
				   total++;
			}
		return total;
	}

	var calculatePercentage = function(score,total){
		return percent = Math.round(score/total * 100);
	}