window.onload = function() {

	document.addEventListener("keypress", function(e) {
		if(e.charCode == 46) {
			//Create the blanker if it doesn't exists
			blankDiv = document.getElementById("blanker")
			if( blankDiv == null ) {
				blankDiv = document.createElement("div")
				blankDiv.style.display = "block"
				blankDiv.style.position = "absolute"
				blankDiv.style.backgroundColor = "black"
				blankDiv.style.top = "0"
				blankDiv.style.left = "0"
				blankDiv.style.width = "100%"
				blankDiv.style.height = "100%"
				blankDiv.id = "blanker"
				
				document.body.appendChild(blankDiv)
				console.log("create")
			} else {
				//If the blanker exists, toggle it
				if(blankDiv.style.display == "block") { blankDiv.style.display = "none" } else { blankDiv.style.display = "block" }
			}
		}
	});

	window.setInterval( function() {
		var end = document.getElementById("thanks")
		var questions = document.getElementById("questions")
		var intro = document.getElementById("intro")

		if(end.classList.contains("active") || questions.classList.contains("active") || document.getElementById("result").classList.contains("active")) {
			intro.classList.add("bye");
		}

		if(intro.classList.contains("active")) {
			var allOthers = document.getElementsByClassName("step")
			var lids = document.getElementsByClassName("lid");
			for (var i = 0; i < allOthers.length; i++) {
				e = allOthers[i]
				if(e.id != "intro") {
					e.style.display = 'none'
				}
			}
			lids[0].style.display = "none"
			lids[1].style.display = "none"
		} else {
			console.log("else")
			var allOthers = document.getElementsByClassName("step")
			var lids = document.getElementsByClassName("lid")
			for (var i = 0; i < allOthers.length; i++) {
				e = allOthers[i]
				e.style.display = 'block';
			}
			lids[0].style.display = "block"
			lids[1].style.display = "block"
		}
	}, 10);

}