topical media & game development

talk show tell print

game-javascript-casual-reaction-background-game.htm / htm



  
  <!-- TWO STEPS TO INSTALL REACTION - BG:
  
     1.  Put the designated coding into the HEAD of your HTML document
     2.  Put the last coding into the BODY of your HTML document  -->
  
  <!-- STEP ONE: Copy this code into the BODY of your HTML document  -->
  
  <HEAD>
  
  <SCRIPT LANGUAGE="JavaScript">
  <!-- Original:  Jasper van Zandbeek -->
  
  <!-- This script and many more are available free online at -->
  <!-- The JavaScript Source!! http://javascript.internet.com -->
  
  <!-- Begin
  var startTime=new Date();
  var endTime=new Date();
  var startPressed=false;
  var bgChangeStarted=false;
  var maxWait=20;
  var timerID;
  function startTest() {
  document.bgColor=document.response.bgColorChange.options[document.response.bgColorChange.selectedIndex].text;
  bgChangeStarted=true;
  startTime=new Date();
  }
  function remark(responseTime) {
  var responseString="";
  if (responseTime < 0.10)
  responseString="Well done!";
  if (responseTime >= 0.10 && responseTime < 0.20)
  responseString="Nice!";
  if (responseTime >=0.20 && responseTime < 0.30)
  responseString="Could be better...";
  if (responseTime >=0.30 && responseTime < 0.60)
  responseString="Keep practicing!";
  if (responseTime >=0.60 && responseTime < 1)
  responseString="Have you been drinking?";
  if (responseTime >=1)
  responseString="Did you fall asleep?";
  return responseString;
  }
  function stopTest() {
  if(bgChangeStarted) {
  endTime=new Date();
  var responseTime=(endTime.getTime()-startTime.getTime())/1000;
  document.bgColor="white";       
  alert("Your response time is: " + responseTime + " seconds " + "\n" + remark(responseTime));
  startPressed=false;
  bgChangeStarted=false;
  }
  else
  {
  if (!startPressed) {
  alert("press start first to start test");
  }
  else
  {       
  clearTimeout(timerID);
  startPressed=false;             
  alert("cheater! you pressed too early!");
        }               
     }
  }
  var randMULTIPLIER=0x015a4e35;
  var randINCREMENT=1;
  var today=new Date();
  var randSeed=today.getSeconds();
  function randNumber() {
  randSeed = (randMULTIPLIER * randSeed + randINCREMENT) % (1 << 31);
  return((randSeed >> 15) & 0x7fff) / 32767;
  }
  function start() {
  if(startPressed) {
  alert("Already started. Press stop to stop");
  return;
  }
  else
  {
  startPressed=true; 
  timerID=setTimeout('startTest()', 20000*randNumber());
     }
  }
  // End --> 
  </SCRIPT>
  
  <!-- STEP TWO:  Put this last coding into the BODY of your HTML document -->
  
  <BODY>
  
  <CENTER>
  <FORM name="response">
  Change background color to: 
  <SELECT name="bgColorChange">
  <option selected>deeppink
  <option>aliceblue
  <option>crimson
  <option>darkkhaki
  <option>cadetblue
  <option>darkorchid
  <option>coral
  <option>chocolate
  <option>mediumslateblue
  <option>tomato
  <option>darkslategray
  <option>limegreen
  <option>cornflowerblue
  <option>darkolivegreen
  </SELECT>
  <input type="button" value="start" onClick="start()">
  <input type="button" value="stop" onClick="stopTest()">
  </FORM>
  </CENTER>
  
  <p><center>
  <font face="arial, helvetica" size="-2">Free JavaScripts provided<br>
  by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
  </center><p>
  
  <!-- Script Size:  2.91 KB  -->
  
  


(C) Æliens 20/2/2008

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.