window.onload = initAllQuizzes;

var initHTML = ["","",""]
var containerCount = [10,11,8];
var containerScore = [10,11,8];
var correctCount = [0,0,0];
var attemptCount = [0,0,0];

function initAllQuizzes()
{
	for (var i = 0; i < containerCount.length; i++)
	{
		initQuiz(i + 1);
	}
}

function initQuiz(containerId)
{
	// INIT SPECIFIC CONTAINER
	initHTML[(containerId - 1)] = xGetElementById("container" + containerId).innerHTML

	for (var i = 0; i < containerCount[(containerId - 1)]; i++)
	{
		var elem;
		
		// Set up drag capability
		elem = xGetElementById("c" + containerId + "-drag_" + ( i + 1));
		xEnableDrag("c" + containerId + "-drag_" + (i + 1), fnDragStart, fnDrag, fnDragEnd);
		elem.initX = xLeft(elem);
		elem.initY = xTop(elem);
		
		if (containerId == 1)
		{
			// Remove clones from picture
			elem = xGetElementById("c" + containerId + "-drag_" + ( i + 1) + "_clone");
			if (elem)
				document.body.removeChild(elem);
		}
	}
}

function fnDragStart(ele, mdx, mdy)
{
  var container =  ele.offsetParent;
	while (container.parentNode && (container.id.indexOf('container')==-1)) container = container.offsetParent;
	ele.offL = 0;
	ele.offR = 0;
	ele.offT = 0;
	ele.offB = 0;
	ele.bL = xPageX(container)-xPageX(ele);
	ele.bT = xPageY(container)-xPageY(ele);
	ele.bR = ele.bL+xWidth(container)-xWidth(ele);
	ele.bB = ele.bT+xHeight(container)-xHeight(ele);
	ele.style.clear = "left";
	ele.style.zIndex = 10;
}

function fnDrag(ele, mdx, mdy)
{
  ele.offL+=mdx;
  ele.offT+=mdy;
	var x = Math.min(ele.bR,Math.max(ele.bL,ele.offL));
	var y = Math.min(ele.bB,Math.max(ele.bT,ele.offT));

	
	xMoveTo(ele, x, y);
}

function fnDragEnd(ele, mx, my)
{
	var ret;
	var containerId = ele.id.substring(2, 1);
	
	attemptCount[(containerId - 1)]++;

	ret = fnValidTarget(ele.id, mx, my);

	if (ret == null)
	{
		ele.className = "quiz_drag";
		xSlideTo(ele, ele.initX, ele.initY, 250);
	}
	else
	{
		if (ret.coords)
		{
			var image = xGetElementById("bodyImage");
			var inner = image.offsetParent;
			var coords = ret.coords.split(",");
			xDisableDrag(ele);
			var newEle = xGetElementById(ele.id).cloneNode(true); 
			newEle.id = newEle.id + "_clone";
			inner.appendChild(newEle);
			xMoveTo(newEle, parseInt(coords[0])-xPageX(inner)+xPageX(image), parseInt(coords[1])-xPageY(inner)+xPageY(image));
			//newEle.style.width = parseInt(coords[2]) - parseInt(coords[0]);
			//newEle.style.height = ele.style.height;
			newEle.className = "quiz_drop_correct_image";
			//var x = document.body.appendChild(newEle);
			ele.style.visibility = "hidden";
			// Centre vertically
			newEle.style.marginTop = ((parseInt(coords[3]) - parseInt(coords[1])) - xHeight(newEle)) / 2;
		}
		else
		{
			ret.innerHTML = ele.innerHTML;
			ret.className = "quiz_drop_correct";
			xDisableDrag(ele);
			ele.style.visibility = "hidden";
		}
		correctCount[(containerId - 1)]++;
	}

	if (correctCount[(containerId - 1)] == containerScore[(containerId - 1)])
	{
		fnShowScore(containerId);
	}
}

function fnValidTarget(id, mx, my)
{
	var elem;
	var ret = null;
	var sep = id.indexOf("_");
	var num = id.substring(sep + 1);
	var dropPrefix = "c" + id.substring(2, 1) + "-"
	
	if (id.substring(2, 1) == 1)
	{
		// CHECK AGAINST MAP ELEMENTS
		// CALCULATE OFFET OF AREA ELEMENT TO THE OWNING IMAGE
		var image = xGetElementById("bodyImage");
		var imageX = xPageX(image);
		var imageY = xPageY(image);
		var imageWidth = xWidth(image);
		var imageHeight = xHeight(image);

		var att = (IsIE() ? "classname" : "class");
		var maps = document.getElementsByTagName("area"); 
		for (var i = 0; i < maps.length; i++)
		{ 
			var map = maps[i]; 
			if ((map.getAttribute(att) != null) && (map.getAttribute(att) != ""))
			{
				var coords = map.coords.split(",");
				
				if (mx >= (parseInt(coords[0]) + imageX) && mx <= (parseInt(coords[2]) + imageX))
				{
					if (my >= (parseInt(coords[1]) + imageY) && my <= (parseInt(coords[3]) + imageY))
					{
						sep = map.getAttribute(att).indexOf("_");

						if (map.getAttribute(att).substring(sep + 1) == num)
						{
							ret = map;
							break;
						}
					}
				}
			}
		} 
	}
	else
	{
		for (var i = 0; i < containerCount[id.substring(2, 1) - 1]; i++)
		{
			elem = xGetElementById(dropPrefix + "drop_" + ( i + 1));
			if (mx >= xPageX(elem) && mx <= (xPageX(elem) + xWidth(elem)))
			{
				if (my >= xPageY(elem) && my <= (xPageY(elem) + xHeight(elem)))
				{
					sep = elem.id.indexOf("_");
					if (fnValidCombo(id.substring(2, 1), num, elem.id.substring(sep + 1)))
					{
						ret = elem;
						break;
					}
				}
			}
		}
	}
	return ret;
}

function fnValidCombo(container, drag, drop)
{
	if (drag == drop)
	{
		return true;
	}

	if (container == 2)
	{
		if ((drag == 1 || drag == 8) && (drop == 1 || drop == 8))
		{
			return true;
		}
		else if ((drag == 3 || drag == 7) && (drop == 3 || drop == 7))
		{
			return true;
		}
		else if ((drag == 4 || drag == 9 || drag == 10 || drag == 11) && (drop == 4 || drop == 9 || drop == 10 || drop == 11))
		{
			return true;
		}
	}
}

function fnResetQuestion(containerId)
{
	xGetElementById("container" + containerId).innerHTML = initHTML[(containerId - 1)];
	correctCount[(containerId - 1)] = 0;
	attemptCount[(containerId - 1)] = 0;
	initQuiz(containerId);
}


function fnShowScore(containerId)
{
	var popup;
	var message;
	var score;
	var attCount = attemptCount[(containerId - 1)];
	var threshold = containerScore[(containerId - 1)];
	var wrap = xGetElementById("wrapper");
	var warp2 = xGetElementById("MainCol_inner");
	var cont = xGetElementById("container"+containerId);

	message = "your quiz ranking is: <br/>";
	
	if (attCount == threshold)
	{
		score = "A* - An excellent score!";
	}
	else if (attCount <= (threshold + 2))
	{
		score = "A - Very well done!";
	}
	else if (attCount <= (threshold + 4))
	{
		score = "B - Well done!";
	}
	else if (attCount > (threshold + 4))
	{
		score = "C - Try the quiz again after re-reading the section pages.";
	}

	xGetElementById("quiz_result_text").innerHTML = message;
	xGetElementById("quiz_result_score").innerHTML = score;
	xGetElementById("quiz_result_title").innerHTML = "Congratulations!";		
	popup = xGetElementById("quiz_result_popup");
	popup.style.display = "block";
	xMoveTo(popup, (xWidth(wrap) - xWidth(popup)) / 2, xOffsetTop(wrap)+xOffsetTop(cont)+ 100);
}



function fnHideScore()
{
	var popup;
	popup = xGetElementById("quiz_result_popup");
	popup.style.display = "none";
	return false;
}