Javascript problem: Memory game

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Humakt
    New Member
    • Aug 2008
    • 42
    #1

    Javascript problem: Memory game

    Hey all. I'm doing a memory game with Javascript using innerhtml to generate table where memory "cards" are depending on difficulty. The work for the code is still in progress as I have to make functions for gameplay as well. Though there's no sense to proceed if I can't get making the table to work.

    Currently I've made tablecode for easy difficulty (helppo) however, when I click into image which should generate the code into div (id = pelialue), nothing happens. I'm not very experienced in javascript so there might be some simple thing I haven't noticed. Hope some of you can help me. Variables and function names are in my native language (finnish).

    (PHP or Flash ain't option)

    Here's the unfinished code entirely:

    [HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt d">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>
    Muistipeli
    </title>
    <link rel="stylesheet " type="text/css"
    href="tyyli.css " />
    <script language=">
    function Pala(nimi, kuva, monta){
    this.nimi = nimi;
    this.kuva = kuva;
    this.monta = monta;
    }
    function valittu(nimi){

    }
    function kokoa(paloja){
    var pelipalat = "";
    var kerta = 0;
    var valittuja = 0;
    while (paloja > 0){
    random = Math.ceil(Math. random() * (paloja/2));
    if(palat[random-1].monta==2){vali ttuja++;}
    if(!palat[random-1].monta===0 && !(valittuja>=(p aloja/2))){
    pelipalat = pelipalat + "<td><img src='Tausta.bmp ' name='"+palat[random-1].nimi+"' onclick='valitt u("+palat[random-1].nimi+");'></td>";
    palat[random-1].monta--;
    paloja--;
    kerta++;
    if(kerta==4){
    pelipalat= pelipalat + "</tr><tr>";
    kerta=0;
    }
    }
    }
    return pelipalat;
    }

    var palat = [];
    palat[0] = new Pala("Kakku","K akku.bmp", 2);
    palat[1] = new Pala("Kummitus" ,"Kummitus.bmp" , 2);
    palat[2] = new Pala("Kyna","Ky na.bmp", 2);
    palat[3] = new Pala("Kirja","K irja.bmp", 2);
    palat[4] = new Pala("Kukka","K ukka.bmp", 2);
    palat[5] = new Pala("Talo","Ta lo.bmp", 2);
    function helppo(){
    var helppous = "<table><tr >";
    helppous = helppous + kokoa(12);
    helppous = helppous + "</tr></table>";
    document.getEle mentById('pelia lue').innerHTML = helppous;
    }
    </script>
    </head>
    <body>
    <table class="vaikeust aso">
    <tr>
    <th colspan="3">VAL ITSE UUSI PELI</th>
    </tr>
    <tr>
    <td class="vaikeus" width="113px">< img class="vaikea" src="Helppo.bmp " alt="Aloita helppo peli" onMouseUp="docu ment.helpponapp i.src='Helppo.b mp'; helppo();" onMouseDown="do cument.helppona ppi.src='Helppo pain.bmp'; " onMouseOut="doc ument.helpponap pi.src='Helppo. bmp';" name="helpponap pi"></td>
    <td class="vaikeus" width="142px">< img class="vaikea" src="Normaali.b mp" alt="Aloita normaali peli" onMouseUp="docu ment.norminappi .src='Normaali. bmp'; normaali();" onMouseDown="do cument.norminap pi.src='Normaal ipain.bmp'; " onMouseOut="doc ument.norminapp i.src='Normaali .bmp';" name="norminapp i"></td>
    <td class="vaikeus" width="108px">< img class="vaikea" src="Vaikea.bmp " alt="Aloita vaikea peli" onMouseUp="docu ment.vaikeanapp i.src='vaikea.b mp'; vaikea();" onMouseDown="do cument.vaikeana ppi.src='Vaikea pain.bmp'; " onMouseOut="doc ument.vaikeanap pi.src='Vaikea. bmp';" name="vaikeanap pi"></td>
    </tr>
    </table>

    <div id="pelialue" align="center" class="pelialue ">Pelialue
    </div>

    </body>
    </html>[/HTML]
    Last edited by acoder; Aug 12 '08, 11:41 AM. Reason: Added [code] tags
    Tags: None
    • acoder
      Recognized Expert MVP
      • Nov 2006
      • 16032
      #2
      The first problem is this line:
      [html]<script language=">[/html]Replace that with:
      [html]<script type="text/javascript">[/html]

      PS. please use code tags when posting code. Thanks!

        Comment

        • rnd me
          Recognized Expert Contributor
          • Jun 2007
          • 427
          #3
          document.helppo nappi.src is not the propert way to point to a tag by id.

          use document.getEle mentById("id") instead.

            Comment

            • Humakt
              New Member
              • Aug 2008
              • 42
              #4
              Thanks for the help, and now I've managed to make it print some table cells with test clauses but it still doesn't get quite finished with the table. The problem is in function kokoa(), I believe.

              In other words, it seems to stuck in eternal loop somehow.

                Comment

                • acoder
                  Recognized Expert MVP
                  • Nov 2006
                  • 16032
                  #5
                  That's probably because it doesn't meet the if condition to decrease the paloja value (to end the loop). What exactly is the while loop supposed to do, i.e. what are you expecting it to do, step by step?

                    Comment

                    • Humakt
                      New Member
                      • Aug 2008
                      • 42
                      #6
                      I think I solved it for now. Thanks for the help people. Indeed cause was in the if statement in kokoa function.

                      I'll ask here if I encounter new problems.

                        Comment

                        • acoder
                          Recognized Expert MVP
                          • Nov 2006
                          • 16032
                          #7
                          No problem. Glad to hear that you managed to solve it. Can you post the solution?

                            Comment

                            • Humakt
                              New Member
                              • Aug 2008
                              • 42
                              #8
                              Well, it didn't function properly actually after I did the fix. But now it works after I started to make a detailed post about the problem with code comments of it here (which made me double check and rethink most bits).

                              (Fixed) code for the function:

                              Code:
                              function kokoa(paloja){
	var pelipalat = "";
	var kerta = 0;
	var tosipala = paloja;
	var valittuja = 0;
	var random;
	while (paloja > 0){
		random = Math.floor(Math.random() * palat.length);
		while (palat[random].monta==0){random = Math.floor(Math.random() * palat.length);}
		if(!(palat[random].monta==2 && valittuja>(tosipala/2))){
			if(palat[random].monta==2){valittuja++;}
			pelipalat = pelipalat + "<td><img src='Tausta.bmp' name='"+palat[random].nimi+"' onclick='valittu("+palat[random].nimi+");'></td>";
			palat[random].monta = palat[random].monta - 1;
			paloja--;
			kerta++;
			if(kerta==5){
				pelipalat= pelipalat + "</tr><tr>";
				kerta=0;
			}
		}
	}
	return pelipalat;
}
                              I had changed it a bit but the real stupid oversight was this:

                              if(!(palat[random].monta==2 && valittuja>(palo ja/2))){

                              Notice what was the problem?

                                Comment

                                • acoder
                                  Recognized Expert MVP
                                  • Nov 2006
                                  • 16032
                                  #9
                                  Thanks for posting. It'd make it easier if you could translate the variable names for me to answer that question.

                                    Comment

                                    • Humakt
                                      New Member
                                      • Aug 2008
                                      • 42
                                      #10
                                      Originally posted by acoder
                                      Thanks for posting. It'd make it easier if you could translate the variable names for me to answer that question.
                                      I don't think strict translations would be enough in that case, I'd have to explain them as well. But it isn't important. What is important is that I've completed this pairs game.

                                      But the reason why it got stuck on the loop was valittuja > paloja / 2.
                                      You see that I decrease paloja in the loop. This was the oversight that made it stuck in loop. That's why I added another variable tosipala, to replace paloja / 2, which doesn't get decreased.

                                        Comment

                                        • acoder
                                          Recognized Expert MVP
                                          • Nov 2006
                                          • 16032
                                          #11
                                          Thanks for the explanation. There wasn't even a need for the translation - I could've just replaced the variables with x/y; just being a bit lazy ;)

                                            Comment

                                            Previous template Next
                                            Working...