jeu de pions en javascript
Bonjour tout le monde,
comme vous le savez je suis entrain de créer un jeu de pions en javascript. Par contre mon code est un peu désordonné, mal structuré et cela par manque d'expérience. J'ai essayé de le réecrire en insérant un boucle for mais ça ne marche pas. Je voudrai profiter de votre expérience pour bien insérer le boucle for dans le code. Merci d'avance
Voici le code source:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>JEU DE PIONS A DISTANCE - LP SAR </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="spectateur.css" />
</head>
<body bgcolor="#C4D7ED" text="#000000">
<script type="text/javascript" src="jquery-1.3.1.min/jquery-1.3.1.min.js"></script>
<script type="text/javascript">
var cpt = 1;
var commence = 0;
var timer;
function changer(elt_id,imageFile){ $(elt_id).attr("src",imageFile); }
/*******cette fonction permet d'affecter la couleur jaune ou bleu quand on clique dessus *********/
function affecte(elt_id,couleur){
elt_id = "#i"+elt_id;
switch(couleur){
case 1 : imageFile = "bleu.gif" ;break; // image pion jaune
case -1 : imageFile = "jaune.gif" ;break; // image pion bleu
case 0 : imageFile = "blanc.gif" ;
}
changer(elt_id,imageFile); // permet de récupérer l'id de l'image qui doit etre affecter
}
/**** cette fonction en Ajax utilise la méthode POST pour envoyer la requête à l'url lire_case.php******/
function lecture(){
$.ajax({
type: "POST",
url: "lire_cases.php",
data: "cpt="+cpt,
success: function(msg){
if(msg[1]=='e') alert( msg + ": l'ordre à échoué" );// 'e' est le premier caractère du mot erreur contenu dans les msgs d'erreur; Alert=printf
else{
eval(msg); //Evalue et exécute le code javascript contenu dans msg.
}
}
});
}
/********** cette fonction permet de gérer le démmarage et l'arrêt du timer ******/
function start_stop(){
if( commence == 0 ) {
commence =1;
timer = setInterval("lecture()", 5500);
document.getElementById("bouton").value="pause";
}else{
commence =0;
clearInterval(timer);
document.getElementById("bouton").value="lecture";
}
}
//Création des lignes qui vont etre utilisées dans le plateau final
var lig=new Array; lig[0]="A1"; lig[1]="A2"; lig[2]="A3"; lig[3]="A4"; lig[4]="A5"; lig[5]="A6"; lig[6]="A7"; lig[7]="A8"; lig[8]="A9"; lig[9]="A10";
var lig1=new Array; lig1[0]="B1"; lig1[1]="B2"; lig1[2]="B3"; lig1[3]="B4"; lig1[4]="B5"; lig1[5]="B6"; lig1[6]="B7"; lig1[7]="B8"; lig1[8]="B9"; lig1[9]="B10";
var lig2=new Array; lig2[0]="C1"; lig2[1]="C2"; lig2[2]="C3"; lig2[3]="C4"; lig2[4]="C5"; lig2[5]="C6"; lig2[6]="C7"; lig2[7]="C8"; lig2[8]="C9"; lig2[9]="C10";
var lig3=new Array; lig3[0]="D1"; lig3[1]="D2"; lig3[2]="D3"; lig3[3]="D4"; lig3[4]="D5"; lig3[5]="D6"; lig3[6]="D7"; lig3[7]="D8"; lig3[8]="D9"; lig3[9]="D10";
var lig4=new Array; lig4[0]="E1"; lig4[1]="E2"; lig4[2]="E3"; lig4[3]="E4"; lig4[4]="E5"; lig4[5]="E6"; lig4[6]="E7"; lig4[7]="E8"; lig4[8]="E9"; lig4[9]="E10";
var lig5=new Array; lig5[0]="F1"; lig5[1]="F2"; lig5[2]="F3"; lig5[3]="F4"; lig5[4]="F5"; lig5[5]="F6"; lig5[6]="F7"; lig5[7]="F8"; lig5[8]="F9"; lig5[9]="F10";
var lig6=new Array; lig6[0]="G1"; lig6[1]="G2"; lig6[2]="G3"; lig6[3]="G4"; lig6[4]="G5"; lig6[5]="G6"; lig6[6]="G7"; lig6[7]="G8"; lig6[8]="G9"; lig6[9]="G10";
var lig7=new Array; lig7[0]="H1"; lig7[1]="H2"; lig7[2]="H3"; lig7[3]="H4"; lig7[4]="H5"; lig7[5]="H6"; lig7[6]="H7"; lig7[7]="H8"; lig7[8]="H9"; lig7[9]="H10";
var lig8=new Array; lig8[0]="I1"; lig8[1]="I2"; lig8[2]="I3"; lig8[3]="I4"; lig8[4]="I5"; lig8[5]="I6"; lig8[6]="I7"; lig8[7]="I8"; lig8[8]="I9"; lig8[9]="I10";
var lig9=new Array; lig9[0]="J1"; lig9[1]="J2"; lig9[2]="J3"; lig9[3]="J4"; lig9[4]="J5"; lig9[5]="J6"; lig9[6]="J7"; lig9[7]="J8"; lig9[8]="J9"; lig9[9]="J10";
//Création du plateau final auquel on attribue chaque ligne afin d'obtenir un tableau dimensionnel
var plateau=new Array; plateau[0]=lig; plateau[1]=lig1; plateau[2]=lig2; plateau[3]=lig3; plateau[4]=lig4; plateau[5]=lig5; plateau[6]=lig6; plateau[7]=lig7; plateau[8]=lig8; plateau[9]=lig9;
document.write("<center><br>"); //Centrage du plateau
for(var i= 0; i < 99; i++){
function X(i){;
var xhr_object = null; //Initialisation de la variable xhr_object
if(window.XMLHttpRequest) // Firefox, Google Chrome, dOpera, de Safari
xhr_object = new XMLHttpRequest(); // l'objet xhr reçoit l'outil de requete propre à Firefox
else if(window.ActiveXObject) // Internet Explorer utilise window.ActiveXObject dans le cas d'une requete
xhr_object = new ActiveXObject("Microsoft.XMLHTTP"); // Donc si c'est le cas l'objet xhr reçoit l'outil de requete propre à Internet Explorer
else { // XMLHttpRequest non support? par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); //Sinon le navigateur utilisé ne supporte aucune de ces 2 méthodes de requetes
return;
}
document.write("<img id=\"i\" src='blanc.gif' onclick=X(i) width=50 height=50 height="+plateau[x][y]+">");
document.write("<img id=\"i\" src='noir.gif' onclick=X(i) width=50 height=50 height="+plateau[y][x]+">");
Alert(i);
</script>
<div style="left:50px; top:200px; position:absolute" >
<input type="submit" name="Submit" value="lecture" id="bouton" onClick="start_stop();"></input>
</div>
<div id="bandeau" style="left:50px; top:200px; position:absolute" ></div>
</body>
</html> |