Message d'erreur suite à un "head"

Fermé
DrSlump75 Messages postés 2 Date d'inscription lundi 16 janvier 2012 Statut Membre Dernière intervention 16 janvier 2012 - Modifié par DrSlump75 le 16/01/2012 à 11:26
Bonjour,

depuis quelques jours j'essaie de coder un bejeweled en javascript et j'ai finalement réussi :

<html> 
    <style> 
        #GemmeRose 
        { 
   position : absolute; 
            width: 50px; 
            height: 50px; 
            margin-auto; 
            background-image: url('450v2.png'); 
   z-index: 10; 
        } 
        #GemmeBleu 
        { 
   position : absolute; 
            width: 50px; 
            height: 50px; 
            margin-auto; 
            background-image: url('350v2.png'); 
   z-index: 10; 
        } 
        #GemmeVerte 
        { 
   position : absolute; 
            width: 50px; 
            height: 50px; 
            margin-auto; 
            background-image: url('150v2.png'); 
   z-index: 10; 
        } 
        #GemmeViolette 
        { 
   position : absolute; 
            width: 50px; 
            height: 50px; 
            margin-auto; 
            background-image: url('250v2.png'); 
   z-index: 10; 
        } 
        #GemmeOrange 
        { 
   position : absolute; 
            width: 50px; 
            height: 50px; 
            background-image: url('550v2.png'); 
   z-index: 10; 
        } 
        #GemmeJaune 
        { 
   position : absolute; 
            width: 50px; 
            height: 50px; 
            background-image: url('650v2.png'); 
   z-index: 10; 
        } 
        #playground 
        { 
   position: relative; 
            width: 500px; 
            margin-auto; 
   z-index: 5; 
        } 
  #toto 
  { 
  top: 489px; 
  left: -280px; 
  position : relative; 
  z-index: 15; 
  } 
  #compt 
        { 
   position : relative; 
   z-index: 15; 
   font-family: 'Quantico', cursive; 
   color: #f45461; 
   font-size: 50px; 
  } 
   
    </style> 
    <link href='http://fonts.googleapis.com/css?family=Quantico' rel='stylesheet' type='text/css'> 
    <body onclick="clik();" onload="decompte();" style="background-color:#e8e8e8; background-image:url('background.png');  
    background-repeat:no-repeat; background-position:center top;" > 
    <div id='playground' style='margin : auto; margin-top : 70px;'></div> 
 <div id='toto'><span id="compt"></span></div> 
  
 <script language="javascript" type="text/javascript"> 

var compte = 100; 
var compte2 = 0; 
var a = 0; 
var pclick = false; 

function clik() 
{ 
    pclick = true; 
} 

function decompte() 
{ 
    document.getElementById("compt").innerHTML = compte 
  
        if(compte == 0 || compte < 0) { 
        compte = 0; 
  alert("Tu as tenu " + compte2 + " secondes, c'est nul."); 
        clearInterval(timer); 
        } 
  
    compte-=1; 
} 

function decompte2() 
{ 
    compte2+=1; 
} 

var timer2 = setInterval('decompte2()',1000); 
var timer = setInterval('decompte()',250); 

var premiereGemme; 
var PremiereGemmeClique = false; 
var deuxiemeGemme; 
var DeuxiemeGemmeClique = false; 
var SauvegardeGemme; 
var id = 0; 

while (id < 64)  
{ 
    var div = document.createElement('div'); 
     
    div.style.width = '60px'; 
    div.style.height = '60px'; 
    div.style.border = '1px solid #fff'; 
    div.style.cssFloat = 'left'; 
    div.id = id; 
     
    var p = document.getElementById('playground'); 
     
    p.appendChild(div); 
    var Gemme = document.createElement('div'); 
    generationGemme(id, Gemme); 
    div.addEventListener('click', EchangeGemme, true); 
    id++; 
} 

function generationGemme(idCase, Gemme)  
{ 
    var caseGemme = document.getElementById(idCase); 
    var generation = 0; 
     
    Gemme.style.marginTop = '4px'; 
    Gemme.style.marginLeft = '5px'; 
     
    generation = Math.random(); 
    generation = generation * 5; 
    generation = Math.round(generation); 
     
    if (generation == 0)  
    { 
        Gemme.id = "GemmeBleu"; 
        caseGemme.appendChild(Gemme); 
    } 
    if (generation == 1)  
    { 
        Gemme.id = "GemmeRose"; 
        caseGemme.appendChild(Gemme); 
    } 
    if (generation == 2)  
    { 
        Gemme.id = "GemmeVerte"; 
        caseGemme.appendChild(Gemme); 
    } 
    if (generation == 3)  
    { 
        Gemme.id = "GemmeViolette"; 
        caseGemme.appendChild(Gemme); 
    } 
    if (generation == 4)  
    { 
        Gemme.id = "GemmeOrange"; 
        caseGemme.appendChild(Gemme); 
    } 
    if (generation == 5)  
    { 
        Gemme.id = "GemmeJaune"; 
        caseGemme.appendChild(Gemme); 
    } 
} 

setInterval(DescenteGemme, 150); 
GemmeDestruction(); 

function EchangeGemme(event)  
{ 
    var Gemme = event.currentTarget.childNodes[0].id; 
    if (PremiereGemmeClique == false && Gemme != 'GemmeNone')  
    { 
        PremiereGemme = event.currentTarget; 
        PremiereGemmeClique = true; 
    }  
    else if (Gemme != 'GemmeNone')  
    { 
        DeuxiemeGemme = event.currentTarget; 
        if (((parseInt(PremiereGemme.id) + 1) == parseInt(DeuxiemeGemme.id)) || ((parseInt(PremiereGemme.id) - 1) ==  
        parseInt(DeuxiemeGemme.id)) || ((parseInt(PremiereGemme.id) - 8)  
        == parseInt(DeuxiemeGemme.id)) || ((parseInt(PremiereGemme.id) + 8) == parseInt(DeuxiemeGemme.id)))  
        { 
            SauvegardeGemme = PremiereGemme.childNodes[0].id 
            PremiereGemme.childNodes[0].id = DeuxiemeGemme.childNodes[0].id 
            DeuxiemeGemme.childNodes[0].id = SauvegardeGemme 
            PremiereGemmeClique = false; 
        }  
        else  
        { 
            alert("L'échange ne peut être effectué."); 
            PremiereGemmeClique = false; 
        } 
    }  
    else  
    { 
     
    } 
     
    GemmeDestruction(); 
} 

function GemmeDestruction()  
{ 
    var line = 1; 
    var GemmeID = 0; 
    var GemmeIDBonus = 0; 
    var nbGemmeIDBonus = 0; 

    // Scanner horizontale 
    while (GemmeID < 64)  
    { 
        if (GemmeID == (8 * line))  
        { 
            line++; 
        } 
         
        if ((GemmeID == 0) || (GemmeID + 1 >= 64) || (GemmeID == (8 * line) - 1) || (GemmeID == (((8 * line) - 1) - (8 - 1))))  
        { 
            GemmeID++; 
        }  
        else  
        { 
            if ((document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeID].childNodes[0].id ==  
            document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeID - 1].childNodes[0].id) &&  
            (document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeID].childNodes[0].id ==  
            document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeID + 1].childNodes[0].id))  
            { 
                GemmeIDBonus = GemmeID + 1 
                 
                while ((GemmeIDBonus != 0) && (GemmeIDBonus + 1 < 64) && (GemmeIDBonus != (8 * line) - 1) &&  
    (GemmeIDBonus != (((8 * line) - 1) - (8 - 1))) &&  
                (document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeIDBonus].childNodes[0].id ==  
                document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeIDBonus + 1].childNodes[0].id))  
                { 
                    nbGemmeIDBonus++; 
                    GemmeIDBonus++; 
                } 
                 
                while (nbGemmeIDBonus > 0)  
                { 
                    DetruireGemme(GemmeID + 1 + nbGemmeIDBonus); 
                    nbGemmeIDBonus--; 
                } 
                DetruireGemme(GemmeID - 1); 
                DetruireGemme(GemmeID); 
                DetruireGemme(GemmeID + 1); 
            } 
             
            GemmeID++; 
        } 
    } 
     
    GemmeID = 0; 

    // Scanner verticale 
    while (GemmeID < 64)  
    { 
        if (((GemmeID >= 0) && (GemmeID <= 8 - 1)) || ((GemmeID >= (64 - 8)) && (GemmeID <= 64)))  
        { 
            GemmeID++; 
        }  
        else  
        { 
            if ((document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeID].childNodes[0].id ==  
            document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeID - 8].childNodes[0].id) &&  
            (document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeID].childNodes[0].id ==  
            document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeID + 8].childNodes[0].id))  
            { 
                DetruireGemme(GemmeID - 8); 
                DetruireGemme(GemmeID); 
                DetruireGemme(GemmeID + 8); 
            } 
             
            GemmeID++; 
        } 
    } 
} 

function DetruireGemme(GemmeDetruite)  
{ 
    document.childNodes[0].childNodes[1].childNodes[1].childNodes[GemmeDetruite].childNodes[0].id = 'GemmeNone'; 
        if (pclick == true)  
    { 
     compte += 1; 
      } 
} 

function DescenteGemme(event)  
{ 
    var caseGemmeID = 63; 
    var Descente = false; 
     
    while (caseGemmeID >= 0)  
    { 
        if ((caseGemmeID >= 0) && (caseGemmeID < 8))  
        { 
            if (document.childNodes[0].childNodes[1].childNodes[1].childNodes[caseGemmeID].childNodes[0].id == 'GemmeNone')  
            { 
                generationGemme(caseGemmeID, document.childNodes[0].childNodes[1].childNodes[1].childNodes[caseGemmeID].childNodes[0]); 
                caseGemmeID--; 
                Descente = true; 
            }  
            else  
            { 
                caseGemmeID--; 
            } 
        }  
        else  
        { 
            if (document.childNodes[0].childNodes[1].childNodes[1].childNodes[caseGemmeID].childNodes[0].id == 'GemmeNone')  
            { 
                document.childNodes[0].childNodes[1].childNodes[1].childNodes[caseGemmeID].childNodes[0].id =  
                document.childNodes[0].childNodes[1].childNodes[1].childNodes[caseGemmeID - 8].childNodes[0].id; 
                document.childNodes[0].childNodes[1].childNodes[1].childNodes[caseGemmeID - 8].childNodes[0].id = 'GemmeNone'; 
                 
                caseGemmeID--; 
                Descente = true; 
             
            }  
            else  
            { 
                caseGemmeID--; 
            } 
        } 
    } 
     
    if (Descente == false)  
    { 
        GemmeDestruction(); 
    } 
} 

</script> 

    </body> 
</html>


Le bejeweled est fonctionnel tel quel, sauf que dès que j'ajoute un simple Head il ne fonctionne plus et me donne le message d'erreur :
"Cannot read property 'childNodes' of undefined"
Une idée d'ou proviendrait ce problème ? :/
Merci !