Web Design

Assignment 5/logo.js

/*var flashcards = [ {question: img src="images/acura.jpg" height="200px" align="center", answers: "Acura"} {question: img src="images/buick.jpg" height="200px" align="center", answers: "Buick"} {question: img src="images/chevy.jpg" height="200px" align="center", answers: "Chevrolet"} {question: img src="images/chrysler.png" height="200px" align="center", answers: "Chrysler"} {question: img src="images/honda.jpg" height="200px" align="center", answers: "Honda"} {question: img src="images/hyndai.jpg" height="200px" align="center", answers: "Hyndai"} {question: img src="images/infinity.jpg" height="200px" align="center", answers: "Infinity"} {question: img src="images/jaguar.jpg" height="200px" align="center", answers: "Jaguar"} {question: img src="images/lexus.jpg" height="200px" align="center", answers: "Lexus"} {question: img src="images/lincoln.png" height="200px" align="center", answers: "Lincoln"} {question: img src="images/mazda.jpg" height="200px" align="center", answers: "Mazda"} {question: img src="images/mercedes.jpg" height="200px" align="center", answers: "Mercedes"} {question: img src="images/mitsubishi.png" height="200px" align="center", answers: "Mitsubishi"} {question: img src="images/pontiac.jpg" height="200px" align="center", answers: "Pontiac"} {question: img src="images/subaru.jpg" height="200px" align="center", answers: "Subara"} {question: img src="images/toyota.jpg" height="200px" align="center", answers: "toyota"} {question: img src="images/volkswagen.jpg" height="200px" align="center", answers: "Volkswagen"} ]*/ var flashcards=new Array(); flashcards[0]="images/acura.jpg"; flashcards[1]="images/buick.jpg"; flashcards[2]="images/cadillac.jpg"; flashcards[3]="images/chevy.jpg"; flashcards[4]="images/chrysler.png"; flashcards[5]="images/honda.jpg"; flashcards[6]="images/hyndai.jpg"; flashcards[7]="images/infinity.jpg"; flashcards[8]="images/jaguar.jpg"; flashcards[9]="images/lexus.jpg"; flashcards[10]="images/lincoln.png"; flashcards[11]="images/mazda.jpg"; flashcards[12]="images/mercedes.jpg"; flashcards[13]="images/mitsubishi.png"; flashcards[14]="images/pontiac.jpg"; flashcards[15]="images/subaru.jpg"; flashcards[16]="images/toyota.jpg"; flashcards[17]="images/volkswagen.jpg"; var answers=new Array(); answers[0]= "Acura"; answers[1]= "Buick"; answers[2]= "Cadillac"; answers[3]= "Chevrolet"; answers[4]= "Chrysler"; answers[5]= "Honda"; answers[6]= "Hyndai"; answers[7]= "Infinity"; answers[8]= "Jaguar"; answers[9]= "Lexus"; answers[10]= "Lincoln"; answers[11]= "Mazda"; answers[12]= "Mercedes"; answers[13]= "Mitsubishi"; answers[14]= "Pontiac"; answers[15]= "Subaru"; answers[16]= "Toyota"; answers[17]= "Volkswagen"; /* These variables hold indexes to be used for random orderings */ /* Create a random order for going through the pictures */ var counter=0; var index=0; var correctAns=0; var counter = 0; var order = []; /* Randomize indexes for the 4 choices. To show choices, * * swap the correct choice with 0, then just use the first 4 */ var map = []; /* Since correct choice is always 0, randomize the order of buttons */ var btnMap = [0, 1, 2, 3]; var positions=[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17] //there are 18 images function nextButton() { choose(); document.getElementById("logos").src=flashcards[index]; document.getElementById("1").removeAttribute('disabled'); document.getElementById("2").removeAttribute('disabled'); document.getElementById("3").removeAttribute('disabled'); document.getElementById("4").removeAttribute('disabled'); document.getElementById("correct").removeAttribute('disabled'); document.getElementById("1").style.backgroundColor='transparent'; document.getElementById("2").style.backgroundColor='transparent'; document.getElementById("3").style.backgroundColor='transparent'; document.getElementById("4").style.backgroundColor='transparent'; document.getElementById("correct").style.backgroundColor='transparent'; document.getElementById("nxt").style.backgroundColor='transparent'; document.getElementById("ans").innerHTML=""; counter++; document.getElementById("score").innerHTML="You scored: "+correctAns +" out of "+counter; } function choose(){ shuffle(positions); //shuffle the numbers index=positions[0]; //image number to be displayed map=[answers[positions[0]],answers[positions[1]],answers[positions[2]],answers[positions[3]]]; //choices shuffle(map); //shuffle choices document.getElementById("1").value=map[0]; document.getElementById("2").value=map[1]; document.getElementById("3").value=map[2]; document.getElementById("4").value=map[3]; } /*shows correct answer*/ function correctButton() { document.getElementById("1").setAttribute('disabled', true); document.getElementById("2").setAttribute('disabled', true); document.getElementById("3").setAttribute('disabled', true); document.getElementById("4").setAttribute('disabled', true); document.getElementById("ans").innerHTML="Correct answer is " + answers[index]; } /*shows button clicked */ function clicked1(){ document.getElementById("2").setAttribute('disabled', true) document.getElementById("3").setAttribute('disabled', true) document.getElementById("4").setAttribute('disabled', true) if (answers[index]==document.getElementById("1").value) { correctAns++; document.getElementById("correct").setAttribute('disabled', true); document.getElementById("1").style.backgroundColor='#0f0'; } else{ document.getElementById("1").style.backgroundColor='red'; } } function clicked2(){ document.getElementById("1").setAttribute('disabled', true) document.getElementById("3").setAttribute('disabled', true) document.getElementById("4").setAttribute('disabled', true) if (answers[index]==document.getElementById("2").value) { correctAns++; document.getElementById("correct").setAttribute('disabled', true); document.getElementById("2").style.backgroundColor='#0f0'; } else{ document.getElementById("2").style.backgroundColor='#f00'; } } function clicked3(){ document.getElementById("2").setAttribute('disabled', true) document.getElementById("1").setAttribute('disabled', true) document.getElementById("4").setAttribute('disabled', true) if (answers[index]==document.getElementById("3").value) { correctAns++; document.getElementById("correct").setAttribute('disabled', true); document.getElementById("3").style.backgroundColor='#0f0'; } else{ document.getElementById("3").style.backgroundColor='#f00'; } } function clicked4(){ document.getElementById("2").setAttribute('disabled', true) document.getElementById("3").setAttribute('disabled', true) document.getElementById("1").setAttribute('disabled', true) if (answers[index]==document.getElementById("4").value) { correctAns++; document.getElementById("correct").setAttribute('disabled', true); document.getElementById("4").style.backgroundColor='#0f0'; } else{ document.getElementById("4").style.backgroundColor='#f00'; } } /* Shuffle an array */ function shuffle(flashcards) { for (i = 0; i < flashcards.length; i++){ var j = Math.floor(Math.random() * flashcards.length); var temp = flashcards[i]; flashcards[i] = flashcards[j]; flashcards[j] = temp; } }