Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

Please find below the code that I use to make a MasterMind like game. For now people can see the PC selection so I can check if my algorithm works. Further more colors are only as visual part and don't have any functionality in the code.

My main problem is that my algorithm populates the matched array correctly but when it's time to count variable "a" it always brings me "zero"

I have tried to explain with details what every part of my code does but if you have further questions please don't hesitate to post.

    <!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<style>
#red {background-color : red;}
#yellow {background-color : yellow;}
#blue {background-color : blue;}
#green {background-color : green;}
</style>
</head>
<body>
<div id="firstcolor" name="firstcolor">
<script>
var x1 = Math.floor((Math.random()*4)+1); // here PC selects the first random number (color)
document.write(x1);
if(x1==1){
$("#firstcolor").css({'background-color': 'red'});
}
else if (x1==2){
$("#firstcolor").css({'background-color': 'yellow'});
}
else if (x1==3){
$("#firstcolor").css({'background-color': 'blue'});
}
else if (x1==4){
$("#firstcolor").css({'background-color': 'green'});
}
</script>
</div>
<div id="secondcolor">
<script>
var x2 = Math.floor((Math.random()*4)+1);  // here PC selects the second random number (color)
document.write(x2);
if(x2==1){
$("#secondcolor").css({'background-color': 'red'});
}
else if (x2==2){
$("#secondcolor").css({'background-color': 'yellow'});
}
else if (x2==3){
$("#secondcolor").css({'background-color': 'blue'});
}
else if (x2==4){
$("#secondcolor").css({'background-color': 'green'});
}
</script>
</div>
<div id="thirdcolor">
<script>
var x3 = Math.floor((Math.random()*4)+1);  // here PC selects the third random number (color)
document.write(x3);
if(x3==1){
$("#thirdcolor").css({'background-color': 'red'});
}
else if (x3==2){
$("#thirdcolor").css({'background-color': 'yellow'});
}
else if (x3==3){
$("#thirdcolor").css({'background-color': 'blue'});
}
else if (x3==4){
$("#thirdcolor").css({'background-color': 'green'});
}
</script>
</div>
<div id="fourthcolor">
<script>
var x4 = Math.floor((Math.random()*4)+1);  // here PC selects the fourth random number (color)
document.write(x4);
if(x4==1){
$("#fourthcolor").css({'background-color': 'red'});
}
else if (x4==2){
$("#fourthcolor").css({'background-color': 'yellow'});
}
else if (x4==3){
$("#fourthcolor").css({'background-color': 'blue'});
}
else if (x4==4){
$("#fourthcolor").css({'background-color': 'green'});
}
</script>
</div>
<form name="myForm" action="" method="post" onsubmit="return false">
<select id="firstselection" name="first" onchange="saveSelections(this)">
  <option >Choose</option>
  <option id="red">1</option>
  <option id="yellow">2</option>
  <option id="blue">3</option>
  <option id="green">4</option>
  </select>
<select id="secondselection" name="second" onchange="saveSelections(this)">
  <option >Choose</option>
  <option id="red">1</option>
  <option id="yellow">2</option>
  <option id="blue">3</option>
  <option id="green">4</option>
</select>
<select id="thirdselection" name="third" onchange="saveSelections(this)">
  <option >Choose</option>
  <option id="red">1</option>
  <option id="yellow">2</option>
  <option id="blue">3</option>
  <option id="green">4</option>
</select>
<select id="fourthselection" name="forth" onchange="saveSelections(this)">
  <option >Choose</option>
  <option id="red">1</option>
  <option id="yellow">2</option>
  <option id="blue">3</option>
  <option id="green">4</option>
</select>
<button onclick="showSelections()">Show choices</button>
</form>
<script>
var choices = []; // in this array i save the options that the player choosed from the drop down lists
function saveSelections(info) { // that's the function that stores the options that the player did did
 if (info.value != '') {
   choices.push(info.options[info.selectedIndex].text);
 }
}
function showSelections(){
var matched =[]; // In this array i store the selections of the player that are correct numbers (colors) and are in the correct positions.
var colors = [x1,x2,x3,x4]; // In this array i store the random number (color) selections that the PC did.
var a=0; // Variable "a" is a variable that counts how many numbers are correct but in the wrong place.
for (var i=0 ; i < choices.length ; i++) // with this for loop i check "choices array" with "colors array" position by position 
if (choices[i] == colors[i]){ // and if their value match 
matched.push(choices[i]); // i populate the "matched array" with this value otherwise i populate the matched array with the value "zero"
choices[i]=0 // Also i change the value of "color and choices array" to zero for these positions so i know and won't check these positions again.
colors[i]=0} //
else if (choices[i] != colors[i]){ // here as i said if the values of "choices array" and "colors array" don't match i put a value "zero" in this position
matched.push(0);} // by doing this i can count later on how many values in this array are NOT "zero" and get the number of correct number (colors) in the correct position.
for ( var j=0 ; j<choices.length ; j++) // with this for loop i can check which selected number (colors) are correct but in the wrong place
if ((choices[j] != 0) && (colors.indexOf(choices[j]) != -1)){ // if this position has NOT value "zero AND the value of choices is contained in the colors array
var a =a+1; // THEN the variable "a" is increased by +1
colors[colors.indexOf(choices[j])]=0;} // and the position that was found in "colors array" is getting value "zero" so i won't count this position again.
alert("matched "+matched); // pop ups an alert with the "matched array"
alert("variable a "+a); // pop ups an alert with the count of "a" variable
};
</script>
 </body>
</html>
share|improve this question

closed as too localized by Byte56, Jonathan Hobbs, Trevor Powell, jco, Josh Petrie Oct 1 '12 at 15:33

This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center.If this question can be reworded to fit the rules in the help center, please edit the question.

1  
Holy Christ, edit it, indent it, post only the relevant parts. Trying to parse it hurts. –  jco Jul 30 '12 at 9:49

1 Answer 1

  • Please indent JS properly, would've appreciated if you used jsFiddle or something.
  • You're redeclaring a in the same scope, please avoid that. (it might just solve your problem)
  • Use ids and classes.
share|improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.