From f0f46b4617325947cb1689747f9470e8b17f1434 Mon Sep 17 00:00:00 2001
From: adplantade <adrien.plantade@etu.uca.fr>
Date: Tue, 11 Aug 2020 16:11:29 +0200
Subject: [PATCH] le nombre de dots affiche mainteannt des gemmes

---
 code/button_displayer.js | 44 +++++++++++++++++++++++++++++++---------
 code/index.php           | 26 ++++++++++++++++--------
 code/options.js          | 28 ++-----------------------
 3 files changed, 53 insertions(+), 45 deletions(-)

diff --git a/code/button_displayer.js b/code/button_displayer.js
index 9ab2183..876616a 100644
--- a/code/button_displayer.js
+++ b/code/button_displayer.js
@@ -83,10 +83,8 @@ function disp(what, short=false)
 
 // Dots amount
 
-var output = document.getElementById("dotsNumber");
 var outputHi = document.getElementById("amountHi");
 var amount = (getCookie("dotsAmount")=="" ? 4 : getCookie("dotsAmount"));
-output.innerHTML = amount;
 outputHi.value= amount;
 
 document.getElementById("+").width=size/4;
@@ -98,7 +96,6 @@ function less()
   {
     amount--;
   }
-  output.innerHTML = amount;
   outputHi.value=amount;
   dispDots();
 }
@@ -110,7 +107,6 @@ function more()
   {
     amount++;
   }
-  output.innerHTML = amount;
   outputHi.value=amount;
   dispDots();
 }
@@ -149,7 +145,6 @@ if(document.getElementById("diffSel")!=null)
     document.getElementById(diffSelected).checked=true;
     document.getElementById(modeSelected).checked=true;
 
-    output.innerHTML = amount;
     outputHi.value= amount;
 }
 else
@@ -169,18 +164,47 @@ for(var cpt=1;cpt<9;cpt++)
     {
         document.getElementById("col"+cpt+"D").style.height=size/6;
         document.getElementById("col"+cpt+"D").style.width=size/6;
+        document.getElementById("gem"+cpt+"D").style.height=size/6;
+        document.getElementById("gem"+cpt+"D").style.width=size/6;
     }
 
 function dispDots()
 {
     var amountI = parseInt(amount);
-    for(var cpt=1;cpt<amountI+1;cpt++)
+    console.log(displ);
+    if(displ=="points")
     {
-        document.getElementById("col"+cpt+"D").style.visibility="visible";
-        document.getElementById("col"+cpt+"D").style.backgroundColor=getCookie("color_"+cpt);
+        for(var cpt=1;cpt<9;cpt++)
+        {
+            document.getElementById("gem"+cpt+"D").style.display="none";
+            document.getElementById("col"+cpt+"D").style.display="";
+        }
+        for(var cpt=1;cpt<amountI+1;cpt++)
+        {
+            document.getElementById("col"+cpt+"D").style.visibility="visible";
+            document.getElementById("col"+cpt+"D").style.backgroundColor=getCookie("color_"+cpt);
+        }
+        for(var cpt=amountI+1;cpt<9;cpt++)
+        {
+            document.getElementById("col"+cpt+"D").style.visibility="hidden";
+        }
     }
-    for(var cpt=amountI+1;cpt<9;cpt++)
+    else// if(displ=="gems")
     {
-        document.getElementById("col"+cpt+"D").style.visibility="hidden";
+        for(var cpt=1;cpt<9;cpt++)
+        {
+            document.getElementById("col"+cpt+"D").style.display="none";
+            document.getElementById("gem"+cpt+"D").style.display="";
+        }
+
+        for(var cpt=1;cpt<amountI+1;cpt++)
+        {
+            document.getElementById("gem"+cpt+"D").style.visibility="visible";
+            document.getElementById("gem"+cpt+"D").src="ress/"+gemsSelected[cpt-1]+".png";
+        }
+        for(var cpt=amountI+1;cpt<9;cpt++)
+        {
+            document.getElementById("gem"+cpt+"D").style.visibility="hidden";
+        }
     }
 }
diff --git a/code/index.php b/code/index.php
index 0ef3d3c..b3a5735 100644
--- a/code/index.php
+++ b/code/index.php
@@ -91,15 +91,23 @@
                     <p class="texte">Nombre de dots
                     <img src="ress/-" onClick="less()" id="-"/>
                     <span class="slot" id="dotsDisplayer">
-                <span id="col1D" class="dot"></span>
-                <span id="col2D" class="dot"></span>
-                <span id="col3D" class="dot"></span>
-                <span id="col4D" class="dot"></span>
-                <span id="col5D" class="dot"></span>
-                <span id="col6D" class="dot"></span>
-                <span id="col7D" class="dot"></span>
-                <span id="col8D" class="dot"></span></span>
-                    <span id="dotsNumber" class="texte"></span>
+                        <span id="col1D" class="dot"></span>
+                        <span id="col2D" class="dot"></span>
+                        <span id="col3D" class="dot"></span>
+                        <span id="col4D" class="dot"></span>
+                        <span id="col5D" class="dot"></span>
+                        <span id="col6D" class="dot"></span>
+                        <span id="col7D" class="dot"></span>
+                        <span id="col8D" class="dot"></span>
+                        <img id="gem1D" class=" slot" />
+                        <img id="gem2D" class=" slot" />
+                        <img id="gem3D" class=" slot" />
+                        <img id="gem4D" class=" slot" />
+                        <img id="gem5D" class=" slot" />
+                        <img id="gem6D" class=" slot" />
+                        <img id="gem7D" class=" slot" />
+                        <img id="gem8D" class=" slot" />
+                    </span>
                     <img src="ress/+" onClick="more()" id="+"/>
                     <input type="hidden" name="dotsAmount" id="amountHi"/></p>
                 </div>
diff --git a/code/options.js b/code/options.js
index 9fc80a4..5edee23 100644
--- a/code/options.js
+++ b/code/options.js
@@ -28,21 +28,12 @@ window.onclick = function(event) {
 }
 
 
-var output = document.getElementById("dotsNumber");
-var amount = (getCookie("dotsAmount")=="" ? 4 : getCookie("dotsAmount"));
-output.innerHTML = amount;
-
-document.getElementById("+").width=size/4;
-document.getElementById("-").width=size/4;
-
 document.getElementById("displays").addEventListener("click", function(){
     document.getElementById("color_pickers").style.display= (displ!="points" ? "none" : "inline");
     document.getElementById("gems_picker").style.display= (displ=="points" ? "none" : "inline");
 })
 
 function saveOptions() {
-    setCookie("dotsAmount",amount,30);
-    setCookie("pause",(document.getElementById("no_pause").checked ? 0 : 1),30);
     modal.style.display = "none";
 }
 
@@ -67,6 +58,7 @@ function selectDisplay(e)
     document.getElementById("both_di").classList.remove("selected");
     document.getElementById(e+"_di").classList.add("selected");
     backgroundBoth();
+    dispDots();
 }
 
 function backgroundBoth()
@@ -136,7 +128,6 @@ function allowDrop(ev) {
 function drag(ev) {
     ev.dataTransfer.setData("text", ev.target.id);
     dragFrom=ev.currentTarget.parentElement;
-    //console.log("je prends de "+ev.dataTransfer.getData("text") + " et "+ ev.currentTarget.parentElement.id);
 }
 
 var dragFrom;
@@ -145,30 +136,15 @@ function drop(ev) {
     ev.preventDefault();
     var data = ev.dataTransfer.getData("text");
     var color;
-    //console.log("je lâche sur "+ev.target.id + " et "+dragFrom.hasChildNodes() + "|"+ev.currentTarget.id);
-    /*
-    if(!ev.target.hasChildNodes() && ev.target.tagName=="DIV")
-    {
-        ev.target.appendChild(document.getElementById(data));
-        //gemsSelected[ev.target.id.substring(4)-1]=document.getElementById(data)
-        
-        //console.log(data + " | " + ev.target.id + " | " + document.getElementById(data).src.substring(document.getElementById(data).src.search("/ress")+6));
-        
-        color=document.getElementById(data).src.substring(document.getElementById(data).src.search("/ress")+6);
-        gemsSelected[ev.target.id.substring(4)-1]=color;
-        console.log(gemsSelected);
-    }
-    else */
     if(dragFrom.hasChildNodes() && ev.currentTarget.hasChildNodes() && dragFrom!=ev.currentTarget)
     {
         [gemsSelected[dragFrom.id.substring(4)-1],gemsSelected[ev.currentTarget.id.substring(4)-1]]=[gemsSelected[ev.currentTarget.id.substring(4)-1],gemsSelected[dragFrom.id.substring(4)-1]];
         dragFrom.appendChild(ev.currentTarget.firstChild);
         ev.currentTarget.appendChild(dragFrom.firstChild);
-        //console.log(ev.currentTarget.firstChild.src.substring(document.getElementById(data).src.search("/ress")+6) + "|"+dragFrom.firstChild.src.substring(document.getElementById(data).src.search("/ress")+6));
         
         setCookie("gem"+ev.currentTarget.id.substring(4),ev.currentTarget.firstChild.src.substring(document.getElementById(data).src.search("/ress")+6),30);
         setCookie("gem"+dragFrom.id.substring(4),dragFrom.firstChild.src.substring(document.getElementById(data).src.search("/ress")+6),30);
-        //console.log(dragFrom.id.substring(4)+"/"+ev.currentTarget.id.substring(4));
+        
     }
 }