Page highscores.php finie et ajoutée à l'accueil

code/button_displayer.js

@@ -9,6 +9,12 @@ var diffSelected=null;
 var btn_options=document.getElementById("btn_options");
 btn_options.width=size;
 
+document.getElementById("btn_play").width=size;
+document.getElementById("btn_play_des").width=size;
+document.getElementById("btn_play").style.display="none";
+
+document.getElementById("btn_high").width=size;
+
 modes.forEach(element => {
     eval("var btn"+element+"= document.getElementById('btn_"+element+"')");
     eval("btn_"+element+".width=size");
@@ -33,7 +39,8 @@ modes.forEach(element => {
             setCookie("modeSelected",modeSelected,30);
             if(modeSelected!=null && diffSelected!=null)
             {
-                document.getElementById("btn_play").disabled = false;
+                document.getElementById("btn_play").style.display="flex";
+            document.getElementById("btn_play_des").style.display="none";
             }
             dispHighscores();
         });
@@ -55,7 +62,8 @@ diffs.forEach(element => {
         document.getElementById(e.currentTarget.id).classList.add("selected");
         if(modeSelected!=null && diffSelected!=null)
         {
-            document.getElementById("btn_play").disabled = false;
+            document.getElementById("btn_play").style.display="flex";
+            document.getElementById("btn_play_des").style.display="none";
         }
         dispHighscores();
     });
@@ -82,4 +90,9 @@ function hideAll()
 function play()
 {
     window.location.replace("./game.html?mode="+modeSelected+"&diff="+diffSelected+"&pseudo="+document.getElementById("field_pseudo").value);
+}
+
+function goHigh()
+{
+    window.location.replace("./highscores.php");
 }

code/highscore_button_displayer.js

@@ -1,8 +1,18 @@
 var modes=["points","temps","survie"];
 var diffs=["easy","med","hard"];
+var diffSelected="";
+var modeSelected="";
 size=screen.height/6;
 hideAll();
 
+document.getElementById("btn_play").width=size;
+document.getElementById("btn_play_des").width=size;
+document.getElementById("btn_play").style.display="none";
+
+document.getElementById("btn_high").width=size;
+document.getElementById("btn_high_des").width=size;
+document.getElementById("btn_high").style.display="none";
+
 modes.forEach(element => {
 
     eval("var img_"+element+"= document.getElementById('img_"+element+"')");
@@ -17,16 +27,24 @@ modes.forEach(element => {
             for(var cpt=1;cpt<tab.length;cpt++)
             {
                 var tabChilds=document.getElementById(tab.item(cpt).id).children;
-                for(var cptChild=0;cptChild<tabChilds.length;cptChild++)
+                for(var cptChild=1;cptChild<tabChilds.length;cptChild+=2)
                 {
-                    tabChilds.item(cptChild).classList.remove("selected");
+                    //console.log("j'enlève selected à "+ tabChilds.item("img_"+cptChild));
+                    tabChilds.item(cptChild).children[0].classList.remove("selected");
                 }
             }
             
             modeSelected= e.currentTarget.id;
 
-            console.log("target= "+e.currentTarget.id);
             document.getElementById(e.currentTarget.id).classList.add("selected");
+            if(diffSelected!="" && modeSelected!="")
+        {
+            document.getElementById("btn_play").style.display="flex";
+            document.getElementById("btn_play_des").style.display="none";
+
+            document.getElementById("btn_high").style.display="flex";
+            document.getElementById("btn_high_des").style.display="none";
+        }
         });
     }
 });
@@ -38,11 +56,19 @@ diffs.forEach(element => {
     {
         diffSelected= e.currentTarget.id.substring(4);
         var tab=document.getElementById("diff").children;
-        for(var cpt=0;cpt<tab.length;cpt++)
+        for(var cpt=1;cpt<tab.length;cpt+=2)
         {
-            tab.item(cpt).classList.remove("selected");
+            tab.item(cpt).children[0].classList.remove("selected");
         }
         document.getElementById(e.currentTarget.id).classList.add("selected");
+        if(diffSelected!="" && modeSelected!="")
+        {
+            document.getElementById("btn_play").style.display="flex";
+            document.getElementById("btn_play_des").style.display="none";
+
+            document.getElementById("btn_high").style.display="flex";
+            document.getElementById("btn_high_des").style.display="none";
+        }
     });
 })
 
@@ -62,10 +88,26 @@ function hideAll()
     document.getElementById("survie").style.display="none";
 }
 
+// Dots amount
+
 var slider = document.getElementById("range_dots");
 var output = document.getElementById("dotsNumber");
+document.getElementById("range_dots").value= (getCookie("dotsAmount")!="" ? getCookie("dotsAmount") : 4 );
 output.innerHTML = slider.value;
 
 slider.oninput = function() {
   output.innerHTML = this.value;
+}
+
+// pause oui/non
+
+document.getElementById("pause"+ (getCookie("pause")!="" ? getCookie("pause") : 0)).checked=true;
+
+// play button
+
+function play()
+{
+    setCookie("dotsAmount",document.getElementById("range_dots").value,30);
+    setCookie("pause",(document.getElementById("pause0").checked ? 0 : 1),30);
+    window.location.replace("./game.html?mode="+modeSelected+"&diff="+diffSelected+"&pseudo="+document.getElementById("field_pseudo").value);
 }

code/highscores.php

@@ -58,17 +58,23 @@
 
     <div>
         <p>Mode pause activé : </p>
-        <input type="radio" id="yes_pause" value="1" name="pause">
+        <input type="radio" id="pause1" value="1" name="pause">
-        <label for="no_pause">Oui</label>
+        <label for="pause1">Oui</label>
-        <input type="radio" id="no_pause" value="0" name="pause">
+        <input type="radio" id="pause0" value="0" name="pause">
-        <label for="no_pause">Non</label>
+        <label for="pause0">Non</label>
     </div>
     <p>Changer le nombre de points</p>
         <input type="range" min="2" max="8" class="slider" name="dotsAmount" id="range_dots">
         <p>Nombre de points : <span id="dotsNumber"></span></p>
-<input type="image" src="ress/red.png" alt="Submit" width="48" height="48">
+<input type="image" src="ress/button_highscores.png" alt="Submit" id="btn_high">
+<img id="btn_high_des" src="ress/button_highscores_desac.png"/>
 </form>
+Entrez votre pseudo (optionnel, mais n&eacute;cessaire si vous voulez sauvegarder votre score): <br/>
+    <input type="text" id="field_pseudo" /><br/>
+<img id="btn_play" src="ress/button_play.png" onClick="play()"/>
+<img id="btn_play_des" src="ress/button_play_desac.png"/>
 
+<script src="bakery.js"></script>
 <script src="highscore_button_displayer.js"></script>
 <?php
 
@@ -76,7 +82,7 @@ $database = new SQLite3("data.db");
 
 
 
-if($_POST["game_mode"]!="" && $_POST["difficulty"]!="" && $_POST["dotsAmount"]!="" && $_POST["pause"]!="")
+if(isset($_POST["game_mode"]) && $_POST["game_mode"]!="" && $_POST["difficulty"]!="" && $_POST["dotsAmount"]!="" && $_POST["pause"]!="")
 {
     if(stristr($_POST['game_mode'], "p") === FALSE)
     {
@@ -103,4 +109,5 @@ if($_POST["game_mode"]!="" && $_POST["difficulty"]!="" && $_POST["dotsAmount"]!=
 }
 
     echo "<h1 id='aya'>".$phrase."</h1>";
-}
+}
+?>

code/index.php

@@ -41,9 +41,11 @@ Jouer la partie en : </br>
 
     Entrez votre pseudo (optionnel, mais n&eacute;cessaire si vous voulez sauvegarder votre score):
     <input type="text" id="field_pseudo" />
-
+<ul>
-    <button id="btn_play" onClick="play()" disabled>Jouer ?</button>
+    <img id="btn_play" src="ress/button_play.png" onClick="play()"/>
-
+    <img id="btn_play_des" src="ress/button_play_desac.png"/>
+    <img id="btn_high" src="ress/button_highscores.png" onClick="goHigh()"/>
+</ul>
 
 <div>
     Partie en points : la partie finit quand vous obtenez le nombre de points choisi. Mettez le moins de temps possible ! </br>

code/phpinfo.php

@@ -1,4 +1,23 @@
 <?php
+// Call PHP function from javascript without ajax
 
-phpinfo();
+function myphpfunction($b) {
-?>
+  echo "aa ".$b;
+  }
+?>
+<!doctype html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>PHP & Javascript</title>
+<script type="text/javascript">
+   console.log("<?php echo myphpfunction("aya")?>");
+</script>
+<?php
+
+var_dump($_COOKIE);
+?>
+</head>
+<body>
+</body>
+</html>