<HTML>
<HEAD>
<TITLE>Randomized Interval Game</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--Hides script from old browsers
//The intervals array is used to hold the correct spelling
// of each interval name. For use in user feedback.
var intervals=new Array(14);
intervals[0]="";
intervals[1]="P1";
intervals[2]="m2";
intervals[3]="M2";
intervals[4]="m3";
intervals[5]="M3";
intervals[6]="P4";
intervals[7]="tritone";
intervals[8]="P5";
intervals[9]="m6";
intervals[10]="M6";
intervals[11]="m7";
intervals[12]="M7";
intervals[13]="P8";
//The moviefilenames array is used to hold the names
// of the quicktime movie files containing the intervals.
var moviefilenames=new Array(14);
moviefilenames[0]="";
moviefilenames[1]="p1.mov";
moviefilenames[2]="min2.mov";
moviefilenames[3]="maj2.mov";
moviefilenames[4]="min3.mov";
moviefilenames[5]="maj3.mov";
moviefilenames[6]="p4.mov";
moviefilenames[7]="tritone.mov";
moviefilenames[8]="p5.mov";
moviefilenames[9]="min6.mov";
moviefilenames[10]="maj6.mov";
moviefilenames[11]="min7.mov";
moviefilenames[12]="maj7.mov";
moviefilenames[13]="p8.mov";
//The finalresponse array will hold the phrases that the user will
//see after they receive their score on the game.
var finalresponse = new Array(6)
finalresponse[0] = "How embarrassing for you.";
finalresponse[1] = "We have some lovely parting gifts for you.";
finalresponse[2] = "You could use a lot more practice.";
finalresponse[3] = "You could use a bit more practice..";
finalresponse[4] = "Not too shabby. Keep working to improve.";
finalresponse[5] = "Great Job! Your ears are improving nicely.";
//The answerindex array is used to hold the random numbers
//generated by the randinterval function.
//The answerindex array is used to keep track of
//the randomly chosen intervals to avoid duplication.
//These numbers also represent the correct answers to the questions.
var answerindex=new Array(6);
//The rand function takes a number as a parameter and returns
//a random number between 1 and that number.
//The Math.random method generates a random number between 0 and 1.
//That number is then multiplied by the passed parameter.
//1 is added to the product to avoid yielding a zero.
//The Math.floor method then deletes everything after the decimal point.
function rand(num){
var temp = Math.floor(Math.random() * num) + 1;
return temp;
}
//The checkdup function looks at each random number selected and compares
//it against the numbers found in the answerindex array.
//If a duplicate is found then another random number is chosen. It too is
//checked for uniqueness. The loop ends only when a unique number is found.
function checkdup(testpicker){
for (d=1; d<6; d++){
if (answerindex[d]==testpicker){
testpicker = rand(13);
d = 0;
}
}
return testpicker;
}
//The randinterval function calls the rand and checkdup functions above and
//puts a random number between 1 and 13 into an element of the pickers array.
//Since this function is called five times, there will eventually be five
//randomly selected numbers in the pickers array.
function randinterval(i){
testpicker = rand(13);
answerindex[i] = checkdup(testpicker);
return answerindex[i];
}
//These variable assignments are necessary so that randomly chosen
//movie file names can be placed in local variables.
//In the body section of this page you will see how they are placed on
//the page using the document.write method.
var question1=moviefilenames[randinterval(1)];
var question2=moviefilenames[randinterval(2)];
var question3=moviefilenames[randinterval(3)];
var question4=moviefilenames[randinterval(4)];
var question5=moviefilenames[randinterval(5)];
//The Validate function checks the answers and gives the user feedback.
function Validate() {
var score=0;
document.gamesheet.r1.value = "";
document.gamesheet.r2.value = "";
document.gamesheet.r3.value = "";
document.gamesheet.r4.value = "";
document.gamesheet.r5.value = "";
//the elements of this array will contain values of true or false
var correctanswers = new Array(6);
correctanswers[0]=""
correctanswers[1]=document.gamesheet.q1[answerindex[1]].selected
correctanswers[2]=document.gamesheet.q2[answerindex[2]].selected
correctanswers[3]=document.gamesheet.q3[answerindex[3]].selected
correctanswers[4]=document.gamesheet.q4[answerindex[4]].selected
correctanswers[5]=document.gamesheet.q5[answerindex[5]].selected
//Each element of the responses array will hold the response
//for one question.
var responses = new Array(6);
//This loop checks the answers and generates responses.
for (k=1; k<6; k++){
if (correctanswers[k]==true){
score += 1;
responses[k]="Correct";
}
else{
responses[k]="Sorry. The correct answer is " + intervals[answerindex[k]]+".";
}
}
//These statements assign the responses to the fields r1 through r5.
document.gamesheet.r1.value = responses[1]
document.gamesheet.r2.value = responses[2]
document.gamesheet.r3.value = responses[3]
document.gamesheet.r4.value = responses[4]
document.gamesheet.r5.value = responses[5]
//This statement puts the score into the results field.
document.gamesheet.results.value = score;
//Since the score variable will contain a value between 0 and 5
//we can use score as an index for the finalresponse array and
//assign its value to the feedback field on the gamesheet form.
document.gamesheet.feedback.value = finalresponse[score];
}
//--> end hiding script.
</SCRIPT>
</HEAD>
<body bgcolor="#FFFFFF">
<CENTER>
<H2>Randomized Interval Recognition with JavaScript</H2>
<H3>Each game is different</H3>
<P>Click each play button to hear an interval. Choose an answer using the popup menus.
<BR>When you are through, click new game to hear a different set of intervals.
<P>This game requires the <A href="http://www.quicktime.apple.com">QuickTime Plugin</A> from Apple Computer. It is a free download and well worth the time.
<BR>Netscape Navigator 3.0 and above usually comes with the QuickTime plugin already installed.
<P>
<FORM NAME="gamesheet">
<HR>
<TABLE>
<TR>
<TD>
ITEM 1
</TD>
<TD>
<SCRIPT LANGUAGE="JavaScript">
document.write('<EMBED SRC="'+question1+'" width=25 height=18 Volume=255 autoplay=false> ');
</SCRIPT>
</TD>
<TD>
<select name=q1>
<option SELECTED="SELECTED" value="">Choose interval
<option value="P1"> P1
<option value="m2"> m2
<option value="M2"> M2
<option value="m3"> m3
<option value="M3"> M3
<option value="P4"> P4
<option value="tritone"> tritone
<option value="P5"> P5
<option value="m6"> m6
<option value="M6"> M6
<option value="m7"> m7
<option value="M7"> M7
<option value="P8"> P8
</select>
</TD>
<TD>
<INPUT TYPE="TEXT" NAME="r1" VALUE="" SIZE=40>
</TD>
</TR>
</TABLE>
<HR>
<TABLE>
<TR>
<TD>
ITEM 2
</TD>
<TD>
<SCRIPT LANGUAGE="JavaScript">
document.write('<EMBED SRC="'+question2+'" width=25 height=18 Volume=255 autoplay=false> ');
</SCRIPT>
</TD>
<TD>
<select name=q2>
<option SELECTED="SELECTED" value="">Choose interval
<option value="P1"> P1
<option value="m2"> m2
<option value="M2"> M2
<option value="m3"> m3
<option value="M3"> M3
<option value="P4"> P4
<option value="tritone"> tritone
<option value="P5"> P5
<option value="m6"> m6
<option value="M6"> M6
<option value="m7"> m7
<option value="M7"> M7
<option value="P8"> P8
</select>
</TD>
<TD>
<INPUT TYPE="TEXT" NAME="r2" VALUE="" SIZE=40>
</TD>
</TR>
</TABLE>
<HR>
<TABLE>
<TR>
<TD>
ITEM 3
</TD>
<TD>
<SCRIPT LANGUAGE="JavaScript">
document.write('<EMBED SRC="'+question3+'" width=25 height=18 Volume=255 autoplay=false> ');
</SCRIPT>
</TD>
<TD>
<select name=q3>
<option SELECTED="SELECTED" value="">Choose interval
<option value="P1"> P1
<option value="m2"> m2
<option value="M2"> M2
<option value="m3"> m3
<option value="M3"> M3
<option value="P4"> P4
<option value="tritone"> tritone
<option value="P5"> P5
<option value="m6"> m6
<option value="M6"> M6
<option value="m7"> m7
<option value="M7"> M7
<option value="P8"> P8
</select>
</TD>
<TD>
<INPUT TYPE="TEXT" NAME="r3" VALUE="" SIZE=40>
</TD>
</TR>
</TABLE>
<HR>
<TABLE>
<TR>
<TD>
ITEM 4
</TD>
<TD>
<SCRIPT LANGUAGE="JavaScript">
document.write('<EMBED SRC="'+question4+'" width=25 height=18 Volume=255 autoplay=false> ');
</SCRIPT>
</TD>
<TD>
<select name=q4>
<option SELECTED="SELECTED" value="">Choose interval
<option value="P1"> P1
<option value="m2"> m2
<option value="M2"> M2
<option value="m3"> m3
<option value="M3"> M3
<option value="P4"> P4
<option value="tritone"> tritone
<option value="P5"> P5
<option value="m6"> m6
<option value="M6"> M6
<option value="m7"> m7
<option value="M7"> M7
<option value="P8"> P8
</select>
</TD>
<TD>
<INPUT TYPE="TEXT" NAME="r4" VALUE="" SIZE=40>
</TD>
</TR>
</TABLE>
<HR>
<TABLE>
<TR>
<TD>
ITEM 5
</TD>
<TD>
<SCRIPT LANGUAGE="JavaScript">
document.write('<EMBED SRC="'+question5+'" width=25 height=18 Volume=255 autoplay=false> ');
</SCRIPT>
</TD>
<TD>
<select name=q5>
<option SELECTED="SELECTED" value="">Choose interval
<option value="P1"> P1
<option value="m2"> m2
<option value="M2"> M2
<option value="m3"> m3
<option value="M3"> M3
<option value="P4"> P4
<option value="tritone"> tritone
<option value="P5"> P5
<option value="m6"> m6
<option value="M6"> M6
<option value="m7"> m7
<option value="M7"> M7
<option value="P8"> P8
</select>
</TD>
<TD>
<INPUT TYPE="TEXT" NAME="r5" VALUE="" SIZE=40>
</TD>
</TR>
</TABLE>
<HR>
<INPUT TYPE="BUTTON" NAME="submit" VALUE="Evaluate" onClick="return Validate();"> <INPUT TYPE="RESET" NAME="reset" VALUE="New Game" onClick="window.location.href='random.html';">
<BR>
Your score on this game is: <INPUT TYPE="TEXT" NAME="results" SIZE=4>
<INPUT TYPE="TEXT" NAME="feedback" SIZE=50>
<P>
</FORM>
</CENTER>
<CENTER><HR><Form><Input Type="button" Value="Back" onClick="history.back();"></Form>
<P>
<A HREF="../home.html">IM II Home</A>
</CENTER>
</body>
</html>