//////////// end of setup


var AnswerIds= ['a','b','c','d','e','f','g','h'];

var UserAnswers = new Array();
for (j=0; j < Questions.length; j++){
	UserAnswers[j]= new Array();
	for (i=0; i < Questions[j]['answer'].length ; i++){
		UserAnswers[j][i]= 0;
	}
}

function clearForm(){
	for (j=0; j < Questions.length; j++){
		UserAnswers[j]= new Array();
		document.getElementById('msg'+j).innerHTML='';
		for (i=0; i < Questions[j]['answer'].length ; i++){
			UserAnswers[j][i]= 0;
			document.getElementById(j +'mark'+i).src= 'empty.gif';
			document.getElementById(j +'radio'+i).checked=false;
		
		}
	}

}


function selectAnswer(){
	if (UserAnswers[this.qid][this.aid] == 0){ // selecting
	
		if (! multiple_choice){
			for (i=0; i < Questions[this.qid]['answer'].length ; i++){
				UserAnswers[this.qid][i]= 0;
				document.getElementById(this.qid +'mark'+i).src= 'empty.gif';
			}
	
		}
	
		UserAnswers[this.qid][this.aid]=1;
	} else { // unselecting	
		UserAnswers[this.qid][this.aid]= 0;
		document.getElementById(this.qid +'mark'+this.aid).src= 'empty.gif';
		
				
		
	}	
}

function mouseOverAnswer (){
	this.className = 'mouseOver';
	
	
}
function mouseOutAnswer (){
	this.className = 'answer';
	
}

function validateAnswers(){
	
	for (j=0;j<Questions.length;j++){
		var wrong = false;
		var total= false;
		var correct_answer='';
		for (i=0; i < Questions[j]['answer'].length ; i++){
			if (UserAnswers[j][i]== 1){
				total = true;
			}
			var mark = document.getElementById (j +'mark'+i);
			if (UserAnswers[j][i] != Questions[j]['answer'][i]['correct']){
				
				mark.src = 'wrong-icon.gif';
				wrong = true;
				
			}
			if (Questions[j]['answer'][i]['correct'] == 1){
				correct_answer += ' ' + AnswerIds[i];
				mark.src = 'correct-icon.gif';
			}
		
		}
		
		var message;
		
		if (!total){
			message =  "<span class=\"wrong\">Please, answer this question. <br><br></span>";
			// unmark all
			for (i=0; i < Questions[j]['answer'].length ; i++){
				var mark = document.getElementById (j +'mark'+i);
				mark.src = 'empty.gif';
			
			}
			
			
			
		} else if (wrong){
			message ="<span class=\"wrong\">Your selection  is incorrect. Correct selection is "+ correct_answer +". <br><br></span>";	
		} else {		
			message ="<span class=\"correct\">Your answer is correct. <br><br></span>";
		}
		
	document.getElementById('msg'+j).innerHTML=message;
	}
	return false;
}




function displayQuestions(){

    var mybody = document.getElementsByTagName("body")[0];
	mytable     = document.createElement("table");
	mytablebody = document.createElement("tbody");
	mytable.className="table";
	mytable.setAttribute('id',"table1");
	


  	
 	for (i=0; i < Questions.length;i++){
		mycurrent_row = document.createElement("tr");
		mycurrent_cell = document.createElement("td");
	
		var newdiv = document.createElement('div');
		var id = i+1;
		
		newdiv.setAttribute('id','q'+id);
		newdiv.className="question";
		newdiv.innerHTML = '<span class="number">'+id+'. &nbsp;</span><b>' +Questions[i]['value']+'</b>' ;
		mycurrent_cell.appendChild(newdiv);
		mycurrent_row.appendChild(mycurrent_cell);
		mytablebody.appendChild(mycurrent_row);
		var Answers = Questions[i]['answer'];
		for (j=0; j < Answers.length;j++){
			mycurrent_row = document.createElement("tr");
			var mark = document.createElement('img');
			mark.src= 'empty.gif';
			mark.height=17;
			mark.width=17;
			mark.id= i+'mark' + j;
			newdiv = document.createElement('div');
			newdiv.setAttribute('id','ans'+i+"_"+j );
			newdiv.className = "answer";
			newdiv.onmouseover= mouseOverAnswer;
			newdiv.onmouseout= mouseOutAnswer;
			newdiv.appendChild(mark);
			var input = document.createElement('input');
			
			input.name = 'a' +i;
			input.id = i+'radio' + j;
			if (multiple_choice){
				input.name +=  '_'+  j;
				input.type = 'checkbox';
			} else {
				input.type = 'radio';
			}
			input.qid = i;
			input.aid = j;
			input.onclick = selectAnswer;
			
			var text = document.createTextNode (AnswerIds[j] + ') ' + Answers[j]['value']);		
			newdiv.appendChild(input);
			newdiv.appendChild(text);
			
			
			mycurrent_cell = document.createElement("td");
			mycurrent_cell.appendChild(newdiv);
			mycurrent_row.appendChild(mycurrent_cell);
			mytablebody.appendChild(mycurrent_row);
			
			
		
		}
		
		
		var msgdiv = document.createElement('div');
		msgdiv.setAttribute('id','msg'+i);
		mycurrent_row = document.createElement("tr");
		mycurrent_cell = document.createElement("td");
		mycurrent_cell.setAttribute('align','center');

		mycurrent_cell.appendChild(msgdiv);
		mycurrent_row.appendChild(mycurrent_cell);
		mytablebody.appendChild(mycurrent_row);
		
	
	}
  	mytable.appendChild(mytablebody);
	
	mytable2     = document.createElement("table");
	mytable2.className="table2";
	mytable2.setAttribute('id',"table2");
	mytable2.setAttribute('align',"center");
	mytablebody2 = document.createElement("tbody");
	mycurrent_row2 = document.createElement("tr");
	mycurrent_cell2 = document.createElement("td");
	mycurrent_cell2.appendChild(mytable);
	mycurrent_row2.appendChild(mycurrent_cell2);
	mytablebody2.appendChild(mycurrent_row2);
	mytable2.appendChild(mytablebody2);
	mybody.appendChild(mytable2);

}