var gameOver=false;
var whichLetter;
var	unscrambleArray = new Array();
var letterSelected = new Array();
var whichDivClicked;
var listTopic;
var wordDrawn=false;
var letterMoving;

function setup(){
	support();
}

function selectTopic(clicked){
	listTopic = clicked.value;
	newGame();
}

function newGame(){
	gameOver=false;
	if (!initWordList()){
		hideBlankSpaces();
		return;
	}
	if (wordDrawn){
		hideBlankSpaces();
		clearBlankSpaces();
		clearScrambledLetters();
		wordDrawn=false;
	}
	newWord();
	calculateLetterLocations();
	initLetterSelected();
	showScramble();
	wordDrawn=true;
}

function giveHint(){
	alert ("give hint");
}

function initUnscrambleArray(){
	for (var x=0; x<text.length; x++){
		unscrambleArray[x]=true;
	}
}

function showScramble(){
	initUnscrambleArray();
	var num=99;
	var spaceCharacter=false;
 	for (var i=0; i<text.length; i++){
		if (i==(text.length-1) && spaceCharacter){
		}
		else{
			num=Math.round(Math.random()*text.length);
			while (!unscrambleArray[num] || (num>=text.length)){
				num=Math.round(Math.random()*text.length);
			}
			unscrambleArray[num]=false;
			letterColorOff(i);
			document.getElementById(""+i).innerHTML=text.charAt(num);
			if (text.charAt(num)==" "){
				hideBlankSpot(num);
				i--;
				spaceCharacter=true;
			}
		}
	}
	if (spaceCharacter){
		hideSpace((text.length-1));
	}
}
function hideBlankSpot(num){
	document.getElementById("blank"+num).style.visibility="hidden";
	document.getElementById("blank"+num).innerHTML=" ";
}
function hideSpace(num){
	document.getElementById("d"+num).style.visibility="hidden";
	letterSelected[num]=true;
}

function moveLettersLeft(num){
	for (var i=num; i<text.length-1; i++){
		var firstletter=document.getElementById(""+i).innerHTML;
		var secondletter=document.getElementById(""+(i+1)).innerHTML;
		alert ("1: "+firstletter+" 2: "+secondletter);
	}
}

function divClicked(clicked) {
	if (gameOver){
		return;
	}
	//check if the same letter clicked (then toggle off and letter not moving anymore)
	//if a different letter clicked (then toggle the other letter off and letter is still moving)
	//click on a letter & toggle the background color
	letterMoving = toggleLetterColor(clicked);
	whichDivClicked=clicked.id;
	whichLetter=document.getElementById(""+clicked.id).innerHTML;
}

function divClickedPut(clicked){
	if (!letterMoving || (document.getElementById(""+clicked.id).innerHTML != "")){
		return;
	}
	//clicked.id is "blank", then a number, we need only the number
	//saving the div associated with that letter allows an undo
	//could this cause problems if the id is >9?
	unscrambleArray[clicked.id[5]]=whichDivClicked;
	document.getElementById(""+clicked.id).innerHTML=""+whichLetter;
	letterMoving=false;
	if (checkWordFinished()){
		endWordCleanup();
	}
}

function endWordCleanup(){
	if (checkWordCorrect()){
		alert("Congratulations! You are correct!");
		gameOver=true;
		gameinprogress=false;
	}
	else{
		alert("Wrong... please try again.");
		clearBlankSpaces();
		clearScrambledLetters();
	}
}

function checkWordCorrect(){
	for (var x=0; x<text.length; x++){
		if ((document.getElementById("blank"+x).innerHTML)!=text.charAt(x)){
			return false;
		}
	}
	return true;
}

function checkWordFinished(){
	for (var x=0; x<text.length; x++){
		if (!letterSelected[x]){
			return false;
		}
	}
	return true;
}

function initLetterSelected(){
	for (var x=0; x<text.length; x++){
		letterSelected[x]=false;
	}
}

function hideBlankSpaces(){
	for (var x=0; x<text.length; x++){
		document.getElementById("blank"+x).style.visibility="hidden";
		document.getElementById("d"+x).style.visibility="hidden";
	}
}

function clearBlankSpaces(){
	for (var x=0; x<text.length; x++){
		document.getElementById("blank"+x).innerHTML="";
	}
}

function clearScrambledLetters(){
	for (var x=0; x<text.length; x++){
		letterColorOff(x);
	}
}

function letterColorOff(num){
	var thisDiv = document.getElementById("d"+num);
	thisDiv.style.backgroundColor=offLetterColor;
	letterSelected[num]=false;
}

function letterColorOn(num){
	var thisDiv = document.getElementById("d"+num);
	thisDiv.style.backgroundColor=onLetterColor;
	letterSelected[num]=true;
}

function toggleLetterColor(clicked){
	if (!letterSelected[clicked.id]){
		if (letterMoving){
			letterColorOff(whichDivClicked);
		}
		letterColorOn(clicked.id);
	}
	else{
		letterColorOff(clicked.id);
		//need to delete the letter
		for (var x=0; x<text.length; x++){
			if (unscrambleArray[x]==clicked.id){
				document.getElementById("blank"+x).innerHTML="";
			}
		}
		return false;
	}
	return true;
}

function calculateLetterLocations(){
	var distanceBtwnLetters=6;
	var startingPosition;	
	if (text.length<=8){
		var letterWidth=33;
	}
	else{
		//(320-startingPosition)-[(letterWidth*text.length)+((text.length-1)*distanceBtwnLetters)]>0
		var letterWidth=[320-((text.length-1)*distanceBtwnLetters)]/text.length;
		var widthDiff=320-[(letterWidth*text.length)+((text.length-1)*distanceBtwnLetters)];
		while (widthDiff>0){
			distanceBtwnLetters--;
			letterWidth=[320-((text.length-1)*distanceBtwnLetters)]/text.length;
		}
	}
	startingPosition = (320-((text.length*letterWidth)+((text.length-1)*distanceBtwnLetters)))/2;
	document.getElementById("d0").style.visibility=document.getElementById("blank0").style.visibility="visible";
	document.getElementById("d0").style.width = document.getElementById("blank0").style.width = ""+letterWidth+"px";
	document.getElementById("d0").style.left = document.getElementById("blank0").style.left = ""+startingPosition+"px";
	for (var x=1; x<text.length; x++){
		document.getElementById("d"+x).style.visibility=document.getElementById("blank"+x).style.visibility="visible";
		var theLeft = startingPosition+(x*letterWidth)+(distanceBtwnLetters*x);
		document.getElementById("d"+x).style.left = document.getElementById("blank"+x).style.left = ""+theLeft+"px";
		document.getElementById("d"+x).style.width = document.getElementById("blank"+x).style.width = ""+letterWidth+"px";
	}
}

function support() {
    showAdd();
}

function closeSupport() {
    hideAdd();
	document.getElementById("container").style.visibility="visible";
}

function orientationChanged(){
}