<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title> Psychophysical Experiment: The role of fixation in visual perception </title>
<script type="text/javascript">
<!--
//Inside kangaroo
var image1=new Image()
image1.src="./images/fixationPt_for_object_config_1.png"
var image2=new Image()
image2.src="./images/object_config_1.png"
var image3=new Image()
image3.src="./images/mask.png"

//inside pig
var image4=new Image()
image4.src="./images/fixationPt_for_object_config_2.png"
var image5=new Image()
image5.src="./images/object_config_2.png"
var image6=new Image()
image6.src="./images/mask.png"

//inside Rabbit
var image7=new Image()
image7.src="./images/fixationPt_for_object_config_3.png"
var image8=new Image()
image8.src="./images/object_config_3.png"
var image9=new Image()
image9.src="./images/mask.png"

//inside duck
var image10=new Image()
image10.src="./images/fixationPt_for_object_config_4.png"
var image11=new Image()
image11.src="./images/object_config_4.png"
var image12=new Image()
image12.src="./images/mask.png"

//inside duck
var image13=new Image()
image13.src="./images/fixationPt_for_object_config_5.png"
var image14=new Image()
image14.src="./images/object_config_5.png"
var image15=new Image()
image15.src="./images/mask.png"


//-->
</script>
</head>

<body>
<div id="stimulus">
<img src="./images/fixationPt_for_object_config_1.png" name="slide" width="400" height="300" />
</div>

<div id="response">
<h3> Instructions </h3>
<p> Look at the black dot on the screen, and continue looking at it. After a while, a picture will appear for a brief period (~150ms). <br> 
After the picture disappears, you report what you saw by selecting one of multiple options given to you. But if you saw nothing because you were distracted <br>
or missed the picture because you closed your eyes right on time(really??), you can either reload the whole experiment or choose the option "none". <br> <br>

The test begins when you press the "start test" button. The black dot stays for just about 5 seconds, so you might have to look at it quickly. <br>
Once again, it is important that you look precisely at the dot or else the experiment won't be valid. Having said that, I must assure you <br>
that it is not a challenge or a trick. So Relax! We just want to know what you see. <br> <br>
So go ahead, and press the "start test" button below and tell us what you saw. Thanks!<br> </p>
<form> <input type="button" value="Start Test" onClick="slideit()"> </form>
</div>


<script language="javascript" type="text/javascript">
<!--
function ajaxFunction(){
	//document.objectResponse.submit();
		
	// The variable that makes Ajax possible!
	var ajaxRequest;  
	
	try{
		// Opera 8.0+, Firefox, Safari
		ajaxRequest = new XMLHttpRequest();
	} catch (e){
		// Internet Explorer Browsers
		try{
			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try{
				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e){
				// Something went wrong
				alert("Your browser broke!");
				return false;
			}
		}
	}

	// Create a function that will receive data sent from the server
	ajaxRequest.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
			  document.getElementById("response").innerHTML= ajaxRequest.responseText ; 
		}
	}
	var respVal=""
	for(i=0; i < document.objectResponse.resp.length; i++){
		if (document.objectResponse.resp[i].checked){
			respVal=document.objectResponse.resp[i].value;
		}
	}
	if (respVal==""){
		alert("chosse one");
		return;
	}
	ajaxRequest.open("GET", "formAction.php?resp="+respVal+"&index="+step/3, true);
	ajaxRequest.send(null); 	
	
}

var step=0
function slideit(){
if (!document.images)
return
step++
if (step > 15){
	window.location="finalReport.php"
}
		
document.images.slide.src=eval("image"+step+".src")

if (step%3 ==0){
	insertResponseForm();
	return
}

if(step%3 == 2){	
	setTimeout("slideit()",150)
}
else{
	setTimeout("slideit()",5000)
}

}

var objNames = new Array();
objNames[0] = "Kangaroo";
objNames[1] = "Rabbit";
objNames[2] = "Pig";
objNames[3] = "Horse";

objNames[4] = "Duck";
objNames[5] = "Pig";
objNames[6] = "Hen";
objNames[7] = "Cow";

objNames[8] = "Duck";
objNames[9] = "Goat";
objNames[10] = "Chick";
objNames[11] = "Kangaroo";

objNames[12] = "Hen";
objNames[13] = "Horse";
objNames[14] = "Pig";
objNames[15] = "Cow";

objNames[16] = "Duck";
objNames[17] = "Pig";
objNames[18] = "Cow";
objNames[19] = "Kangaroo";

var extraOptions = new Array();
extraOptions[0] = "None"

// Write the response form in division id "response"
function insertResponseForm(){
		var index = 4*Math.floor((step-1)/3);
		document.getElementById("response").innerHTML = "<p> What did you see? <br> (your most confident response!)</p>  <form name=\"objectResponse\" method=\"get\" > \
							<table width=\"200\" border=\"0\"> \
							<tr>\
							<td> <input type=\"radio\" name=\"resp\" value=" + objNames[index] + ">" + objNames[index] + "</td>\
							<td> <input type=\"radio\" name=\"resp\" value=" + objNames[index+1] + ">" + objNames[index+1] + "</td> \
							</tr>\
							<tr>\
							<td> <input type=\"radio\" name=\"resp\" value=" + objNames[index+2] + ">" + objNames[index+2] + "</td>\
							<td> <input type=\"radio\" name=\"resp\" value=" + objNames[index+3] + ">" +  objNames[index+3] + "</td> \
							</tr>\
							<tr>\
							<td> <input type=\"radio\" name=\"resp\" value=" + extraOptions[0] + ">" + extraOptions[0] + "</td>\
							</tr>\
							</table> <input type=\"button\" value=\"Submit\"  onclick=\"ajaxFunction()\"> </form>"							
}

//-->
</script>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-6800895-2");
pageTracker._trackPageview();
} catch(err) {}</script>
</body>
</html>
