var input = [document.getElementById("input1"),
	document.getElementById("input2"),
	document.getElementById("input3"),
	document.getElementById("input4")
];

var cross = [document.getElementById("cross1"),
	document.getElementById("cross2"),
	document.getElementById("cross3"),
	document.getElementById("cross4")
];

var check = [document.getElementById("check1"),
	document.getElementById("check2"),
	document.getElementById("check3"),
	document.getElementById("check4")
];

var PlaceHolder = [1, 2, 3, 4];

var incomplete = [document.getElementById("incomplete")];

var visible = [];

var inputStatus=[];

var score = 0;

var answer = ["4", "4", "6", "5"];
console.log(answer);

function submit() {
	reset();
	checkInputs();
	sort();
	console.log("Scoring Complete");
	console.log(visible);
}

function checkInputs() {
	console.log("----CHECKING INPUTS----")
	for (i = 0; i < 4; i++) {
	    console.log("Input "+i+": ")
		if (input[i].value ===answer[i]) {
			inputStatus.push(true);
			console.log(true);
		} else if (input[i].value ===""){
			inputStatus.push("empty");
			console.log("empty");
		}else{
		    inputStatus.push(false);
			console.log(false);
		}
	}
}
function sort(){
	console.log("---Sorting Images based on input status---");
	for (i = 0; i < 4; i++) {
		if (inputStatus[i]===true){
		   check[i].style.visibility="visible";
		   score++;
		   document.getElementById("score").innerHTML="Score: "+score+"/4";
		} else if (inputStatus[i]===false){
		  cross[i].style.visibility="visible";
		} else {
		  	   console.log("please answer all the questions");
		}
	}
}
function reset() {
		score = 0;
		console.log("Score reset");
		for (i = 0; i < 4; i++) {
			cross[i].style.visibility = "hidden";
			check[i].style.visibility = "hidden";
		}
		inputStatus=[];
}