/*
http://www.memorise.org

File: shapeprogram.js
Author: Metin Hassan
© Copyright 2003 memorise.org, All Rights Reserved.

*/
var offsetX = 0
var offsetY = 0
var selectedObj
var selectedObjIndex
var enableAnsArea = false

var deckPointer = 45

var shuffledOrder = new Array(44)
var correctOrder = new Array(44)
var userAnswer = new Array(44)

var image1 = new Image()
image1.src = "./images/s_shape1.jpg"
var image2 = new Image()
image2.src = "./images/s_shape2.jpg"
var image3 = new Image()
image3.src = "./images/s_shape3.jpg"
var image4 = new Image()
image4.src = "./images/s_shape4.jpg"
var image5 = new Image()
image5.src = "./images/s_shape5.jpg"
var image6 = new Image()
image6.src = "./images/s_shape6.jpg"
var image7 = new Image()
image7.src = "./images/s_shape7.jpg"
var image8 = new Image()
image8.src = "./images/s_shape8.jpg"
var image9 = new Image()
image9.src = "./images/s_shape9.jpg"
var image10 = new Image()
image10.src = "./images/s_shape10.jpg"
var image11 = new Image()
image11.src = "./images/s_shape11.jpg"
var image12 = new Image()
image12.src = "./images/s_shape12.jpg"
var image13 = new Image()
image13.src = "./images/s_shape13.jpg"
var image14 = new Image()
image14.src = "./images/s_shape14.jpg"
var image15 = new Image()
image15.src = "./images/s_shape15.jpg"
var image16 = new Image()
image16.src = "./images/s_shape16.jpg"
var image17 = new Image()
image17.src = "./images/s_shape17.jpg"
var image18 = new Image()
image18.src = "./images/s_shape18.jpg"
var image19 = new Image()
image19.src = "./images/s_shape19.jpg"
var image20 = new Image()
image20.src = "./images/s_shape20.jpg"
var image21 = new Image()
image21.src = "./images/s_shape21.jpg"
var image22 = new Image()
image22.src = "./images/s_shape22.jpg"
var image23 = new Image()
image23.src = "./images/s_shape23.jpg"
var image24 = new Image()
image24.src = "./images/s_shape24.jpg"
var image25 = new Image()
image25.src = "./images/s_shape25.jpg"
var image26 = new Image()
image26.src = "./images/s_shape26.jpg"
var image27 = new Image()
image27.src = "./images/s_shape27.jpg"
var image28 = new Image()
image28.src = "./images/s_shape28.jpg"
var image29 = new Image()
image29.src = "./images/s_shape29.jpg"
var image30 = new Image()
image30.src = "./images/s_shape30.jpg"
var image31 = new Image()
image31.src = "./images/s_shape31.jpg"
var image32 = new Image()
image32.src = "./images/s_shape32.jpg"
var image33 = new Image()
image33.src = "./images/s_shape33.jpg"
var image34 = new Image()
image34.src = "./images/s_shape34.jpg"
var image35 = new Image()
image35.src = "./images/s_shape35.jpg"
var image36 = new Image()
image36.src = "./images/s_shape36.jpg"
var image37 = new Image()
image37.src = "./images/s_shape37.jpg"
var image38 = new Image()
image38.src = "./images/s_shape38.jpg"
var image39 = new Image()
image39.src = "./images/s_shape39.jpg"
var image40 = new Image()
image40.src = "./images/s_shape40.jpg"
var image41 = new Image()
image41.src = "./images/s_shape41.jpg"
var image42 = new Image()
image42.src = "./images/s_shape42.jpg"
var image43 = new Image()
image43.src = "./images/s_shape43.jpg"
var image44 = new Image()
image44.src = "./images/s_shape44.jpg"


var imageL1 = new Image()
imageL1.src = "./images/s_shape1.jpg"
var imageL2 = new Image()
imageL2.src = "./images/s_shape2.jpg"
var imageL3 = new Image()
imageL3.src = "./images/s_shape3.jpg"
var imageL4 = new Image()
imageL4.src = "./images/s_shape4.jpg"
var imageL5 = new Image()
imageL5.src = "./images/s_shape5.jpg"
var imageL6 = new Image()
imageL6.src = "./images/s_shape6.jpg"
var imageL7 = new Image()
imageL7.src = "./images/s_shape7.jpg"
var imageL8 = new Image()
imageL8.src = "./images/s_shape8.jpg"
var imageL9 = new Image()
imageL9.src = "./images/s_shape9.jpg"
var imageL10 = new Image()
imageL10.src = "./images/s_shape10.jpg"
var imageL11 = new Image()
imageL11.src = "./images/s_shape11.jpg"
var imageL12 = new Image()
imageL12.src = "./images/s_shape12.jpg"
var imageL13 = new Image()
imageL13.src = "./images/s_shape13.jpg"
var imageL14 = new Image()
imageL14.src = "./images/s_shape14.jpg"
var imageL15 = new Image()
imageL15.src = "./images/s_shape15.jpg"
var imageL16 = new Image()
imageL16.src = "./images/s_shape16.jpg"
var imageL17 = new Image()
imageL17.src = "./images/s_shape17.jpg"
var imageL18 = new Image()
imageL18.src = "./images/s_shape18.jpg"
var imageL19 = new Image()
imageL19.src = "./images/s_shape19.jpg"
var imageL20 = new Image()
imageL20.src = "./images/s_shape20.jpg"
var imageL21 = new Image()
imageL21.src = "./images/s_shape21.jpg"
var imageL22 = new Image()
imageL22.src = "./images/s_shape22.jpg"
var imageL23 = new Image()
imageL23.src = "./images/s_shape23.jpg"
var imageL24 = new Image()
imageL24.src = "./images/s_shape24.jpg"
var imageL25 = new Image()
imageL25.src = "./images/s_shape25.jpg"
var imageL26 = new Image()
imageL26.src = "./images/s_shape26.jpg"
var imageL27 = new Image()
imageL27.src = "./images/s_shape27.jpg"
var imageL28 = new Image()
imageL28.src = "./images/s_shape28.jpg"
var imageL29 = new Image()
imageL29.src = "./images/s_shape29.jpg"
var imageL30 = new Image()
imageL30.src = "./images/s_shape30.jpg"
var imageL31 = new Image()
imageL31.src = "./images/s_shape31.jpg"
var imageL32 = new Image()
imageL32.src = "./images/s_shape32.jpg"
var imageL33 = new Image()
imageL33.src = "./images/s_shape33.jpg"
var imageL34 = new Image()
imageL34.src = "./images/s_shape34.jpg"
var imageL35 = new Image()
imageL35.src = "./images/s_shape35.jpg"
var imageL36 = new Image()
imageL36.src = "./images/s_shape36.jpg"
var imageL37 = new Image()
imageL37.src = "./images/s_shape37.jpg"
var imageL38 = new Image()
imageL38.src = "./images/s_shape38.jpg"
var imageL39 = new Image()
imageL39.src = "./images/s_shape39.jpg"
var imageL40 = new Image()
imageL40.src = "./images/s_shape40.jpg"
var imageL41 = new Image()
imageL41.src = "./images/s_shape41.jpg"
var imageL42 = new Image()
imageL42.src = "./images/s_shape42.jpg"
var imageL43 = new Image()
imageL43.src = "./images/s_shape43.jpg"
var imageL44 = new Image()
imageL44.src = "./images/s_shape44.jpg"


var shapes = new Array()
shapes[0] = new shape("shape1",20,105,1)
shapes[1] = new shape("shape2",50,105,2)
shapes[2] = new shape("shape3",80,105,3)
shapes[3] = new shape("shape4",110,105,4)
shapes[4] = new shape("shape5",140,105,5)
shapes[5] = new shape("shape6",170,105,6)
shapes[6] = new shape("shape7",200,105,7)
shapes[7] = new shape("shape8",230,105,8)
shapes[8] = new shape("shape9",260,105,9)
shapes[9] = new shape("shape10",290,105,10)
shapes[10] = new shape("shape11",320,105,11)
shapes[11] = new shape("shape12",350,105,12)
shapes[12] = new shape("shape13",380,105,13)
shapes[13] = new shape("shape14",410,105,14)
shapes[14] = new shape("shape15",440,105,15)
shapes[15] = new shape("shape16",470,105,16)
shapes[16] = new shape("shape17",500,105,17)
shapes[17] = new shape("shape18",530,105,18)
shapes[18] = new shape("shape19",560,105,19)
shapes[19] = new shape("shape20",590,105,20)
shapes[20] = new shape("shape21",620,105,21)
shapes[21] = new shape("shape22",650,105,22)
shapes[22] = new shape("shape23",20,204,23)
shapes[23] = new shape("shape24",50,204,24)
shapes[24] = new shape("shape25",80,204,25)
shapes[25] = new shape("shape26",110,204,26)
shapes[26] = new shape("shape27",140,204,27)
shapes[27] = new shape("shape28",170,204,28)
shapes[28] = new shape("shape29",200,204,29)
shapes[29] = new shape("shape30",230,204,30)
shapes[30] = new shape("shape31",260,204,31)
shapes[31] = new shape("shape32",290,204,32)
shapes[32] = new shape("shape33",320,204,33)
shapes[33] = new shape("shape34",350,204,34)
shapes[34] = new shape("shape35",380,204,35)
shapes[35] = new shape("shape36",410,204,36)
shapes[36] = new shape("shape37",440,204,37)
shapes[37] = new shape("shape38",470,204,38)
shapes[38] = new shape("shape39",500,204,39)
shapes[39] = new shape("shape40",530,204,40)
shapes[40] = new shape("shape41",560,204,41)
shapes[41] = new shape("shape42",590,204,42)
shapes[42] = new shape("shape43",620,204,43)
shapes[43] = new shape("shape44",650,204,44)

var plates = new Array()
plates[1] = false
plates[2] = false
plates[3] = false
plates[4] = false
plates[5] = false
plates[6] = false
plates[7] = false
plates[8] = false
plates[9] = false
plates[10] = false
plates[11] = false
plates[12] = false
plates[13] = false
plates[14] = false
plates[15] = false
plates[16] = false
plates[17] = false
plates[18] = false
plates[19] = false
plates[20] = false
plates[21] = false
plates[22] = false
plates[23] = false
plates[24] = false
plates[25] = false
plates[26] = false
plates[27] = false
plates[28] = false
plates[29] = false
plates[30] = false
plates[31] = false
plates[32] = false
plates[33] = false
plates[34] = false
plates[35] = false
plates[36] = false
plates[37] = false
plates[38] = false
plates[39] = false
plates[40] = false
plates[41] = false
plates[42] = false
plates[43] = false
plates[44] = false
//================================================================================================================
function getCards()
{
	var cardPack = new Array(44)

	cardPack[0] ="shape1"
	cardPack[1] ="shape2"
	cardPack[2] ="shape3"
	cardPack[3] ="shape4"
	cardPack[4] ="shape5"
	cardPack[5] ="shape6"
	cardPack[6] ="shape7"
	cardPack[7] ="shape8"
	cardPack[8] ="shape9"
	cardPack[9] ="shape10"
	cardPack[10] ="shape11"
	cardPack[11] ="shape12"
	cardPack[12] ="shape13"
	cardPack[13] ="shape14"
	cardPack[14] ="shape15"
	cardPack[15] ="shape16"
	cardPack[16] ="shape17"
	cardPack[17] ="shape18"
	cardPack[18] ="shape19"
	cardPack[19] ="shape20"
	cardPack[20] ="shape21"
	cardPack[21] ="shape22"
	cardPack[22] ="shape23"
	cardPack[23] ="shape24"
	cardPack[24] ="shape25"
	cardPack[25] ="shape26"
	cardPack[26] ="shape27"
	cardPack[27] ="shape28"
	cardPack[28] ="shape29"
	cardPack[29] ="shape30"
	cardPack[30] ="shape31"
	cardPack[31] ="shape32"
	cardPack[32] ="shape33"
	cardPack[33] ="shape34"
	cardPack[34] ="shape35"
	cardPack[35] ="shape36"
	cardPack[36] ="shape37"
	cardPack[37] ="shape38"
	cardPack[38] ="shape39"
	cardPack[39] ="shape40"
	cardPack[40] ="shape41"
	cardPack[41] ="shape42"
	cardPack[42] ="shape43"
	cardPack[43] ="shape44"

	return cardPack
}
//================================================================================================================
function shuffle(iterations)
{
	var i = 0
	var leftToDo = iterations
	var randNum = 0
	correctOrder = getCards()

	for(i=0;i<iterations;i++)
	{
		randNum = Math.floor(Math.random() * leftToDo)
		shuffledOrder[i] = correctOrder[randNum]
		leftToDo--
		correctOrder = removeFromArray(correctOrder,randNum)
	}
//	printArray(shuffledOrder)
}
//================================================================================================================
function removeFromArray(arr,randNum)
{
	var arr1 = new Array()
	var arr2 = new Array()

	arr1 = arr.slice(0,randNum)
	arr2 = arr.slice((randNum+1),arr.length)
	jointArr = arr1.concat(arr2)

	return jointArr
}
//================================================================================================================
function printArray(arr)
{
	var str = ""
	for(var i = 0;i<arr.length;i++)
	{
		str += arr[i] + "\n" 
	}
	alert(str)
}
//===========================================================================================================
function shape(name,x,y,zin,plateNo)
{
	this.name = name
	this.x = x
	this.y = y
	this.zin = zin
	this.plateNo = plateNo
}
//================================================================================================================
function getSelectedCard(e)
{
	if(e.srcElement) {
		selectedObj = (e.srcElement).parentElement
	}
	else
	{
		var node = e.target
		while(node.nodeType != node.ELEMENT_NODE) {
			node = node.parentNode
		}
		selectedObj = node.parentNode
	}

	if (selectedObj) {
		var cardName = selectedObj.id
		selectedObj = selectedObj.style
		for (var i = 0; i < shapes.length; i++) {
			if (shapes[i].name == cardName ) {
				selectedObj.zIndex = 53
				selectedObjIndex = i
		return
			}
		}
		selectedObj = null
	}
	return
}
//================================================================================================================
function dragIt(e)
{
	if(!e){
		e=window.event
	}

	if (selectedObj) {
		if(window.event) {
			selectedObj.pixelLeft = (e.clientX - offsetX)
			selectedObj.pixelTop = (e.clientY - offsetY)
		}
		else {
			selectedObj.left = (e.clientX - offsetX)
			selectedObj.top =  (e.clientY - offsetY)
		}
	}
}
//================================================================================================================
function toggleEngage(e)
{
	if(!e){
		e=window.event
	}

	if (selectedObj) {
		release()
	} else {
		engage(e)
	}
}
//================================================================================================================
function engage(e)
{
	getSelectedCard(e)
	if (selectedObj)
	{
		if(e.offsetX) {
			offsetX = parseInt(e.offsetX) - parseInt(document.body.scrollLeft) + parseInt(132)
			offsetY = parseInt(e.offsetY) - parseInt(document.body.scrollTop) + parseInt(3)
		}
		else {
			offsetX = parseInt(e.layerX) - parseInt(document.body.scrollLeft) + parseInt(132)
			offsetY = parseInt(e.layerY) - parseInt(document.body.scrollTop) + parseInt(3)
		}
	}
}
//================================================================================================================
if(window.event) {
	function release()
	{
		var str
		for(var i = 1; i <= 52; i++)
		{
			str = "plate" + i
			if((selectedObj.pixelLeft >= document.getElementById(str).style.pixelLeft - 40 && selectedObj.pixelLeft <= document.getElementById(str).style.pixelLeft + 40) && (selectedObj.pixelTop >= document.getElementById(str).style.pixelTop - 60 && selectedObj.pixelTop <= document.getElementById(str).style.pixelTop + 60))
			{
				if(!spotTaken(i))
				{
					selectedObj.pixelTop = document.getElementById(str).style.pixelTop+2
					selectedObj.pixelLeft = document.getElementById(str).style.pixelLeft+2
					selectedObj.zIndex = 100
					if(shapes[selectedObjIndex].plateNo != null)
					{
						spotTaken(shapes[selectedObjIndex].plateNo,"no")
					}
					shapes[selectedObjIndex].plateNo = i
					spotTaken(i,"yes")
					selectedObj = null
					selectedObjIndex = null
					return
				}
			}
		}
		selectedObj.pixelLeft = shapes[selectedObjIndex].x
		selectedObj.pixelTop = shapes[selectedObjIndex].y
		selectedObj.zIndex = shapes[selectedObjIndex].zin
		spotTaken(shapes[selectedObjIndex].plateNo,"no")
		shapes[selectedObjIndex].plateNo = null
		selectedObj = null
		selectedObjIndex = null
		return

	} //end func
} //end if
else {
	function release()
	{
		var xpos = selectedObj.left.slice(0,-2);
		var ypos = selectedObj.top.slice(0,-2);
		var str

		for(var i = 1; i <= 52; i++)
		{
			str = "plate" + i
			if((xpos >= document.getElementById(str).offsetLeft - 40 && xpos <= document.getElementById(str).offsetLeft + 40) && (ypos >= document.getElementById(str).offsetTop - 60 && ypos <= document.getElementById(str).offsetTop + 60))
			{
				if(!spotTaken(i))
				{
					selectedObj.top = document.getElementById(str).offsetTop+2 + 'px'
					selectedObj.left = document.getElementById(str).offsetLeft+2 + 'px'
					selectedObj.zIndex = 100
					if(shapes[selectedObjIndex].plateNo != null)
					{
						spotTaken(shapes[selectedObjIndex].plateNo,"no")
					}
					shapes[selectedObjIndex].plateNo = i
					spotTaken(i,"yes")
					selectedObj = null
					selectedObjIndex = null
					return
				}
			}
		}
		selectedObj.left = shapes[selectedObjIndex].x + 'px'
		selectedObj.top = shapes[selectedObjIndex].y + 'px'
		selectedObj.zIndex = shapes[selectedObjIndex].zin
		spotTaken(shapes[selectedObjIndex].plateNo,"no")
		shapes[selectedObjIndex].plateNo = null
		selectedObj = null
		selectedObjIndex = null
		return

	} //end func
} // end else
//================================================================================================================
function clearGrid()
{
	var i = 1
	var str
	for(i = 1; i <= 44; i++)
	{
		str = "shape" + i
		document.getElementById(str).style.pixelLeft = shapes[i-1].x
		document.getElementById(str).style.pixelTop = shapes[i-1].y
		document.getElementById(str).style.zIndex = shapes[i-1].zin
		spotTaken(shapes[i-1].plateNo,"no")
		shapes[i-1].plateNo = null
		str = "plate" + i
		document.getElementById(str).style.borderColor = '#0000FF'
	}
}
//================================================================================================================
function spotTaken(ind,mark)
{
	if(!mark)
	{
		return plates[ind]
	}
	else if(mark == "yes")
	{
		plates[ind] = true
	}
	else if(mark == "no")
	{
		plates[ind] = false
	}
}
//================================================================================================================
function runCorrection()
{
	var i = 0
	var plateId = ""
	var correctCardsImg = ""
	var wrongCards = 0
	var report = ""
	numCorrectRecalled = 0
	var noneWrongYet = true
	var consecutiveRecall = 0
	var rowCount = 0

	arrangeUserAnswer(null)
	arrangeUserAnswer("setup")

	for(i=0;i<shuffledOrder.length;i++)
	{
		if(shuffledOrder[i] == userAnswer[i])
		{
			plateId = "plate"+(i+1)
			document.getElementById(plateId).style.borderColor = '#00FF00'
			numCorrectRecalled++
			if(noneWrongYet)
			{
				consecutiveRecall++
			}
		}
		else
		{
			plateId = "plate"+(i+1)
			document.getElementById(plateId).style.borderColor = '#FF0000'
			wrongCards++
			noneWrongYet = false
		}
	}
	for(i=0;i<shuffledOrder.length;i++)
	{
		correctCardsImg += "<IMG SRC=./images/s_shap"+ shuffledOrder[i].substring(4,shuffledOrder[i].length) +
			".jpg></IMG>"

		rowCount++
		if(rowCount == 11)
		{
			correctCardsImg += "<BR>"
			rowCount = 0
		}
	}


	document.getElementById('correctAnswer').innerHTML = correctCardsImg
	report = "<TABLE class = mainFontText border = 0><TR><TD>"
	report += "Correctly Recalled:</TD><TD WIDTH=60 ALIGN=right>"+ numCorrectRecalled + "</TD></TR>"
	report += "<TR><TD>Consecutively recalled:</TD><TD WIDTH=60 ALIGN=right>"+consecutiveRecall+"</TD></TR>"
	report += "<TR><TD>Incorrect:</TD><TD WIDTH=60 ALIGN=right>"+ wrongCards + "</TD></TR>"
	report += "<TR><TD colspan=2><INPUT TYPE=button ONCLICK=showAns() VALUE='Show Answer'></INPUT>"
	report += "<INPUT TYPE=button ONCLICK=hideAns() VALUE='Hide Answer'></TD></TR></TABLE>"
	document.getElementById("report").innerHTML = report

	if(wrongCards > 0)
	{
		//document.getElementById("panchoMsg").innerHTML = "<B>Nice try, but no cigar!</B>"
	}
	else
	{
		//document.getElementById("panchoMsg").innerHTML = "<B>That was a fluke!</B>"
	}
}
//================================================================================================================
function arrangeUserAnswer(action)
{
	var i = 0

	if(action == null)
	{
		for(i = 0; i < userAnswer.length; i++)
		{
			userAnswer[i] = null
		}
	}
	else if(action == "setup")
	{
		for(i = 0; i < shapes.length; i++)
		{
			userAnswer[shapes[i].plateNo-1] = shapes[i].name
		}
	}
}
//================================================================================================================
function showAns()
{
	document.getElementById('correctAnswer').style.visibility = 'visible'
}
//================================================================================================================
function hideAns()
{
	document.getElementById('correctAnswer').style.visibility = 'hidden'
}
//================================================================================================================
function toggleArea(area)
{
	if(area == "ans" && enableAnsArea)
	{
		document.getElementById('questionArea').style.visibility = 'hidden'
		document.getElementById('begin').style.visibility = 'hidden'
		document.getElementById('middleSect').style.visibility = 'hidden'
		document.getElementById('recallArea').style.visibility = 'visible'
		//document.getElementById("panchoMsg").innerHTML = "Good Luck recalling"
	}
	else if(area == "quest")
	{
		document.getElementById('questionArea').style.visibility = 'visible'
		document.getElementById('begin').style.visibility = 'visible'
		document.getElementById('middleSect').style.visibility = 'visible'
		document.getElementById('recallArea').style.visibility = 'hidden'
		document.getElementById('correctAnswer').style.visibility = 'hidden'
	}
	if(shuffledOrder[0] == null)
	{
		document.getElementById("box").bgColor = 'FFFFFF'
		document.getElementById("noway").innerHTML="<font size = 3><b>Memorise Cards First!</b></font>"
	}
}
//================================================================================================================
function showHelp(ind)
{
	var helpString = ""

	if(ind == "ansPage")
	{
		helpString += "1. Click on a card to pick it up"
		helpString += "\n2. Drag it into one of the blue boxes and click again"
		helpString += "\n3. Repeat steps 1. and 2. until you think the cards are in correct order"
		helpString += "\n4. Click \"Check Answer\" on bottom of the page to see how many you"
		helpString += "\n   recalled correctly. Click \"Show Answer\" to view the correct answer."
		alert(helpString)
	}
}
//================================================================================================================
function beginDeck()
{
	deckPointer = 0
	changeTime = document.getElementById("chngeTime").value;
	flashTime = document.getElementById("dispTime").value * changeTime;
	numCards = document.getElementById("simCards").value;
	document.getElementById("box").bgColor = 'FFFFFF'

	shuffle(44)
	document.getElementById("startButton").disabled = true
	cardFlashID = setInterval("showCards("+numCards+","+44+")",changeTime)
}
//================================================================================================================
function showCards(numCards,totalCards)
{
	var i = 0
	var str = ""

	enableAnsArea = false
	for(i=0;i < numCards;i++)
	{
		if(deckPointer < totalCards)
		{
			str += "<IMG SRC=./images/s_"+shuffledOrder[deckPointer]+".jpg ></IMG>"
			setTimeout("document.getElementById('noway').innerHTML=''",flashTime)
			deckPointer++
		}
		else
		{
			stopCards()
		}
	}

	document.getElementById('noway').innerHTML = str;
}
//================================================================================================================
function stopCards()
{
	if(deckPointer != 53)
	{
		clearInterval(cardFlashID)
		enableAnsArea = true
		clearBox()
	}
}
//================================================================================================================
function clearBox()
{
	document.getElementById("box").bgColor = 'FFFFFF'
	document.getElementById("startButton").disabled = false
	document.getElementById("noway").innerHTML = ""
	deckPointer = 53
}
//==============================================END=OF=FiLE=======================================================
