Compare commits
No commits in common. 'master' and 'inclusion-bdd' have entirely different histories.
master
...
inclusion-
@ -1,3 +0,0 @@
|
|||||||
|
|
||||||
code/data.db
|
|
||||||
code/data.db
|
|
@ -1,22 +0,0 @@
|
|||||||
function setCookie(cname, cvalue, exdays) {
|
|
||||||
var d = new Date();
|
|
||||||
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
|
|
||||||
var expires = "expires="+d.toUTCString();
|
|
||||||
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
|
|
||||||
}
|
|
||||||
|
|
||||||
function getCookie(cname) {
|
|
||||||
var name = cname + "=";
|
|
||||||
var ca = document.cookie.split(';');
|
|
||||||
for(var i = 0; i < ca.length; i++) {
|
|
||||||
var c = ca[i];
|
|
||||||
while (c.charAt(0) == ' ') {
|
|
||||||
c = c.substring(1);
|
|
||||||
}
|
|
||||||
if (c.indexOf(name) == 0) {
|
|
||||||
return c.substring(name.length, c.length);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return "";
|
|
||||||
}
|
|
||||||
|
|
@ -1,272 +0,0 @@
|
|||||||
var modes=["points","temps","survie"];
|
|
||||||
var diffs=["easy","med","hard"];
|
|
||||||
var pauses=["0","1"];
|
|
||||||
var div=document.getElementById('buttons');
|
|
||||||
size=screen.height/6;
|
|
||||||
hideAll();
|
|
||||||
var modeSelected;
|
|
||||||
var diffSelected;
|
|
||||||
var pauseSelected;
|
|
||||||
|
|
||||||
var selectedTheme="selectedDay";
|
|
||||||
|
|
||||||
var btn_options=document.getElementById("btn_options");
|
|
||||||
btn_options.width=size/2;
|
|
||||||
|
|
||||||
var btn_patchnote=document.getElementById("btn_patchnote");
|
|
||||||
btn_patchnote.width=size;
|
|
||||||
|
|
||||||
document.getElementById("btn_play").width=size/1.25;
|
|
||||||
document.getElementById("btn_play").style.display="inline";
|
|
||||||
|
|
||||||
|
|
||||||
modes.forEach(element => {
|
|
||||||
|
|
||||||
eval("var img_"+element+"= document.getElementById('img_"+element+"')");
|
|
||||||
eval("img_"+element+".width=size/1.25");
|
|
||||||
eval("img_"+element).addEventListener("mousedown",function(e)
|
|
||||||
{
|
|
||||||
disp(e);
|
|
||||||
modes.forEach(element => {
|
|
||||||
document.getElementById("img_"+element).classList.remove(selectedTheme);
|
|
||||||
})
|
|
||||||
document.getElementById(e.currentTarget.id).classList.add(selectedTheme);
|
|
||||||
});
|
|
||||||
|
|
||||||
var tab=document.getElementById(element).children;
|
|
||||||
for(var i=1;i<tab.length;i+=2){
|
|
||||||
tab.item(i).children[0].width=size/1.25;
|
|
||||||
tab.item(i).children[0].addEventListener("mousedown",function(e)
|
|
||||||
{
|
|
||||||
var tab=document.getElementById("modeSelection").children;
|
|
||||||
for(var cpt=1;cpt<tab.length;cpt++)
|
|
||||||
{
|
|
||||||
var tabChilds=document.getElementById(tab.item(cpt).id).children;
|
|
||||||
for(var cptChild=1;cptChild<tabChilds.length;cptChild+=2)
|
|
||||||
{
|
|
||||||
tabChilds.item(cptChild).children[0].classList.remove(selectedTheme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
modeSelected= e.currentTarget.id.substring(4,e.currentTarget.id.length);
|
|
||||||
|
|
||||||
document.getElementById(e.currentTarget.id).classList.add(selectedTheme);
|
|
||||||
if(diffSelected!="" && modeSelected!="" && pauseSelected!="")
|
|
||||||
{
|
|
||||||
document.getElementById(modeSelected).checked=true;
|
|
||||||
|
|
||||||
document.getElementById("high_form").submit();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
diffs.forEach(element => {
|
|
||||||
eval("var img_"+element+"= document.getElementById('img_"+element+"')");
|
|
||||||
eval("img_"+element+".width=size/1.25");
|
|
||||||
eval("img_"+element).addEventListener("mousedown",function(e)
|
|
||||||
{
|
|
||||||
diffSelected= e.currentTarget.id.substring(4);
|
|
||||||
var tab=document.getElementById("diff").children;
|
|
||||||
for(var cpt=1;cpt<tab.length;cpt+=2)
|
|
||||||
{
|
|
||||||
tab.item(cpt).children[0].classList.remove(selectedTheme);
|
|
||||||
}
|
|
||||||
document.getElementById(e.currentTarget.id).classList.add(selectedTheme);
|
|
||||||
if(diffSelected!="" && modeSelected!="" && pauseSelected!="")
|
|
||||||
{
|
|
||||||
document.getElementById(diffSelected).checked=true;
|
|
||||||
document.getElementById("high_form").submit();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
})
|
|
||||||
|
|
||||||
pauses.forEach(element => {
|
|
||||||
eval("var img_pause_"+element+"= document.getElementById('img_pause_"+element+"')");
|
|
||||||
eval("img_pause_"+element+".width=size/1.25");
|
|
||||||
eval("img_pause_"+element).addEventListener("mousedown",function(e)
|
|
||||||
{
|
|
||||||
pauseSelected= e.currentTarget.id.substring(e.currentTarget.id.length-1);
|
|
||||||
var tab=document.getElementById("diff").children;
|
|
||||||
for(var cpt=1;cpt<tab.length;cpt+=2)
|
|
||||||
{
|
|
||||||
tab.item(cpt).children[0].classList.remove(selectedTheme);
|
|
||||||
}
|
|
||||||
document.getElementById(e.currentTarget.id).classList.add(selectedTheme);
|
|
||||||
if(diffSelected!="" && modeSelected!="" && pauseSelected!="")
|
|
||||||
{
|
|
||||||
console.log("pause "+pauseSelected);
|
|
||||||
document.getElementById("pause_"+pauseSelected).checked=true;
|
|
||||||
document.getElementById("high_form").submit();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
})
|
|
||||||
|
|
||||||
function disp(what, short=false)
|
|
||||||
{
|
|
||||||
what=(short ? what : what.currentTarget.id.substring(4));
|
|
||||||
modes.forEach(element => {
|
|
||||||
document.getElementById(element).style.display=what==element ? "flex":"none";
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// Dots amount
|
|
||||||
|
|
||||||
var outputHi = document.getElementById("amountHi");
|
|
||||||
var amount = (getCookie("dotsAmount")=="" ? 4 : getCookie("dotsAmount"));
|
|
||||||
outputHi.value= amount;
|
|
||||||
|
|
||||||
document.getElementById("+").width=size/4;
|
|
||||||
document.getElementById("-").width=size/4;
|
|
||||||
|
|
||||||
function less()
|
|
||||||
{
|
|
||||||
if(amount > 2)
|
|
||||||
{
|
|
||||||
amount--;
|
|
||||||
}
|
|
||||||
outputHi.value=amount;
|
|
||||||
setCookie("dotsAmount",amount,30);
|
|
||||||
document.getElementById("high_form").submit();
|
|
||||||
}
|
|
||||||
|
|
||||||
function more()
|
|
||||||
{
|
|
||||||
|
|
||||||
if(amount<8)
|
|
||||||
{
|
|
||||||
amount++;
|
|
||||||
}
|
|
||||||
outputHi.value=amount;
|
|
||||||
setCookie("dotsAmount",amount,30);
|
|
||||||
document.getElementById("high_form").submit();
|
|
||||||
}
|
|
||||||
|
|
||||||
// pause oui/non
|
|
||||||
|
|
||||||
//document.getElementById("pause"+ (getCookie("pause")!="" ? getCookie("pause") : 0)).checked=true;
|
|
||||||
|
|
||||||
|
|
||||||
function hideAll()
|
|
||||||
{
|
|
||||||
document.getElementById("temps").style.display="none";
|
|
||||||
document.getElementById("points").style.display="none";
|
|
||||||
document.getElementById("survie").style.display="none";
|
|
||||||
}
|
|
||||||
|
|
||||||
function play()
|
|
||||||
{
|
|
||||||
var pseudo = prompt("Saisissez votre pseudo", getCookie("pseudo"));
|
|
||||||
setCookie("pause",(document.getElementById("pause_1").checked ? "1" : "0"),30);
|
|
||||||
if(pseudo!="")
|
|
||||||
{
|
|
||||||
setCookie("pseudo",pseudo,30);
|
|
||||||
}
|
|
||||||
|
|
||||||
window.location.replace("./game.html?mode="+modeSelected+"&diff="+diffSelected+"&pseudo="+ (pseudo==null ? "" : pseudo));
|
|
||||||
}
|
|
||||||
|
|
||||||
if(document.getElementById("diffSel")!=null)
|
|
||||||
{
|
|
||||||
diffSelected=document.getElementById("diffSel").value;
|
|
||||||
modeSelected=document.getElementById("modeSel").value;
|
|
||||||
amount=document.getElementById("dotsAmountSel").value;
|
|
||||||
pauseSelected=document.getElementById("pauseSel").value;
|
|
||||||
gameSelected = (modeSelected.includes("s") ? "survie" : (modeSelected.includes("p") ? "points" : "temps"));
|
|
||||||
|
|
||||||
disp(gameSelected, true);
|
|
||||||
document.getElementById("img_"+diffSelected).classList.add(selectedTheme);
|
|
||||||
document.getElementById("img_"+gameSelected).classList.add(selectedTheme);
|
|
||||||
document.getElementById("img_"+modeSelected).classList.add(selectedTheme);
|
|
||||||
document.getElementById("img_pause_"+pauseSelected).classList.add(selectedTheme);
|
|
||||||
|
|
||||||
document.getElementById(diffSelected).checked=true;
|
|
||||||
document.getElementById(modeSelected).checked=true;
|
|
||||||
document.getElementById("pause_"+pauseSelected).checked=true;
|
|
||||||
|
|
||||||
outputHi.value= amount;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
diffSelected="easy";
|
|
||||||
modeSelected="5p";
|
|
||||||
pauseSelected="1";
|
|
||||||
disp("points",true);
|
|
||||||
document.getElementById(diffSelected).checked=true;
|
|
||||||
document.getElementById(modeSelected).checked=true;
|
|
||||||
document.getElementById("pause_"+pauseSelected).checked=true;
|
|
||||||
document.getElementById("img_points").classList.add(selectedTheme);
|
|
||||||
document.getElementById("img_5p").classList.add(selectedTheme);
|
|
||||||
document.getElementById("img_easy").classList.add(selectedTheme);
|
|
||||||
document.getElementById("img_pause_1").classList.add(selectedTheme);
|
|
||||||
}
|
|
||||||
|
|
||||||
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);
|
|
||||||
if(displ=="points")
|
|
||||||
{
|
|
||||||
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";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
for(var cpt=1;cpt<9;cpt++)
|
|
||||||
{
|
|
||||||
document.getElementById("col"+cpt+"D").style.display="none";
|
|
||||||
document.getElementById("gem"+cpt+"D").style.display="";
|
|
||||||
|
|
||||||
console.log(gemsSelected[cpt-1]+"|"+cpt);
|
|
||||||
|
|
||||||
document.getElementById("img_gem"+cpt).src="ress/"+gemsSelected[cpt-1]+".png";
|
|
||||||
|
|
||||||
document.getElementById("gem"+cpt+"D").appendChild(document.getElementById("img_gem"+cpt));
|
|
||||||
document.getElementById("img_gem"+cpt).style.height=size/6;
|
|
||||||
document.getElementById("img_gem"+cpt).style.width=size/6;
|
|
||||||
|
|
||||||
if(displ=="both")
|
|
||||||
{
|
|
||||||
document.getElementById("gem"+cpt+"D").classList.add("dot");
|
|
||||||
document.getElementById("gem"+cpt+"D").style.backgroundColor=gemsSelected[cpt-1];
|
|
||||||
|
|
||||||
document.getElementById("img_gem"+cpt).style.height=size/8;
|
|
||||||
document.getElementById("img_gem"+cpt).style.width=size/8;
|
|
||||||
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
document.getElementById("gem"+cpt+"D").classList.remove("dot");
|
|
||||||
document.getElementById("gem"+cpt+"D").style.backgroundColor="";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
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";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -0,0 +1,50 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<title>On The Dot</title>
|
||||||
|
<link rel="stylesheet" type="text/css" href="game.css"/>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<?php
|
||||||
|
echo $_POST['mode'];
|
||||||
|
?>
|
||||||
|
<ul id="all-container" class="all-container" style="border:2px solid orangered">
|
||||||
|
<ul id="obj-container" class="obj-container" style="border:2px solid yellow">
|
||||||
|
<p id="temps"></p>
|
||||||
|
<span id="chronotime">0:00:00:00</span>
|
||||||
|
<form name="chronoForm">
|
||||||
|
<input type="button" name="startstop" value="start!" onClick="chronoStart()" />
|
||||||
|
<input type="button" name="reset" value="reset!" onClick="chronoReset()" />
|
||||||
|
</form>
|
||||||
|
<p id="stats"></p>
|
||||||
|
<h1>Objectif</h1>
|
||||||
|
<canvas id="canvasObj" class="vitrail-plein"></canvas>
|
||||||
|
<h1>Résultat</h1>
|
||||||
|
<canvas id="canvasTotal" class="vitrail-plein"></canvas>
|
||||||
|
</ul>
|
||||||
|
<ul id="vitraux" class="vitraux" style="border:2px solid purple">
|
||||||
|
<canvas id="canvas1" class="vitrail-plein"></canvas>
|
||||||
|
|
||||||
|
<canvas id="canvas2" class="vitrail-plein"></canvas>
|
||||||
|
|
||||||
|
<canvas id="canvas3" class="vitrail-plein"></canvas>
|
||||||
|
|
||||||
|
<canvas id="canvas4" class="vitrail-plein"></canvas>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul id="canvasR" class="flex-container" style="border:1px solid violet">
|
||||||
|
<h1>Réserve</h1>
|
||||||
|
<canvas id="canvasR1" class="vitrail-vide"></canvas>
|
||||||
|
<canvas id="canvasR2" class="vitrail-vide"></canvas>
|
||||||
|
<canvas id="canvasR3" class="vitrail-vide"></canvas>
|
||||||
|
<canvas id="canvasR4" class="vitrail-vide"></canvas>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
<script src="chrono.js"></script>
|
||||||
|
<script src="vitraux.js"></script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
@ -1,170 +0,0 @@
|
|||||||
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;
|
|
||||||
|
|
||||||
modes.forEach(element => {
|
|
||||||
|
|
||||||
eval("var img_"+element+"= document.getElementById('img_"+element+"')");
|
|
||||||
eval("img_"+element+".width=size");
|
|
||||||
eval("img_"+element).addEventListener("mousedown",function(e)
|
|
||||||
{
|
|
||||||
disp(e);
|
|
||||||
modes.forEach(element => {
|
|
||||||
document.getElementById("img_"+element).classList.remove("selected");
|
|
||||||
})
|
|
||||||
document.getElementById(e.currentTarget.id).classList.add("selected");
|
|
||||||
});
|
|
||||||
|
|
||||||
var tab=document.getElementById(element).children;
|
|
||||||
for(var i=1;i<tab.length;i+=2){
|
|
||||||
tab.item(i).children[0].width=size;
|
|
||||||
tab.item(i).children[0].addEventListener("mousedown",function(e)
|
|
||||||
{
|
|
||||||
var tab=document.getElementById("modeSelection").children;
|
|
||||||
for(var cpt=1;cpt<tab.length;cpt++)
|
|
||||||
{
|
|
||||||
var tabChilds=document.getElementById(tab.item(cpt).id).children;
|
|
||||||
for(var cptChild=1;cptChild<tabChilds.length;cptChild+=2)
|
|
||||||
{
|
|
||||||
tabChilds.item(cptChild).children[0].classList.remove("selected");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
modeSelected= e.currentTarget.id.substring(4,e.currentTarget.id.length);
|
|
||||||
|
|
||||||
document.getElementById(e.currentTarget.id).classList.add("selected");
|
|
||||||
if(diffSelected!="" && modeSelected!="")
|
|
||||||
{
|
|
||||||
document.getElementById(modeSelected).checked=true;
|
|
||||||
|
|
||||||
document.getElementById("high_form").submit();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
diffs.forEach(element => {
|
|
||||||
eval("var img_"+element+"= document.getElementById('img_"+element+"')");
|
|
||||||
eval("img_"+element+".width=size");
|
|
||||||
eval("img_"+element).addEventListener("mousedown",function(e)
|
|
||||||
{
|
|
||||||
diffSelected= e.currentTarget.id.substring(4);
|
|
||||||
var tab=document.getElementById("diff").children;
|
|
||||||
for(var cpt=1;cpt<tab.length;cpt+=2)
|
|
||||||
{
|
|
||||||
tab.item(cpt).children[0].classList.remove("selected");
|
|
||||||
}
|
|
||||||
document.getElementById(e.currentTarget.id).classList.add("selected");
|
|
||||||
if(diffSelected!="" && modeSelected!="")
|
|
||||||
{
|
|
||||||
document.getElementById(diffSelected).checked=true;
|
|
||||||
document.getElementById("high_form").submit();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
})
|
|
||||||
|
|
||||||
function disp(what,short=false)
|
|
||||||
{
|
|
||||||
what=(short ? what : what.currentTarget.id.substring(4));
|
|
||||||
console.log(what);
|
|
||||||
modes.forEach(element => {
|
|
||||||
document.getElementById(element).style.display=what==element ? "flex":"none";
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function hideAll()
|
|
||||||
{
|
|
||||||
document.getElementById("temps").style.display="none";
|
|
||||||
document.getElementById("points").style.display="none";
|
|
||||||
document.getElementById("survie").style.display="none";
|
|
||||||
}
|
|
||||||
|
|
||||||
// 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;
|
|
||||||
document.getElementById("-").width=size/4;
|
|
||||||
|
|
||||||
function less()
|
|
||||||
{
|
|
||||||
if(amount > 2)
|
|
||||||
{
|
|
||||||
amount--;
|
|
||||||
}
|
|
||||||
output.innerHTML = amount;
|
|
||||||
outputHi.value=amount;
|
|
||||||
}
|
|
||||||
|
|
||||||
function more()
|
|
||||||
{
|
|
||||||
if(amount<8)
|
|
||||||
{
|
|
||||||
amount++;
|
|
||||||
}
|
|
||||||
output.innerHTML = amount;
|
|
||||||
outputHi.value=amount;
|
|
||||||
}
|
|
||||||
|
|
||||||
// pause oui/non
|
|
||||||
|
|
||||||
document.getElementById("pause"+ (getCookie("pause")!="" ? getCookie("pause") : 0)).checked=true;
|
|
||||||
|
|
||||||
// play button
|
|
||||||
|
|
||||||
function play()
|
|
||||||
{
|
|
||||||
setCookie("dotsAmount",amount,30);
|
|
||||||
setCookie("pause",(document.getElementById("pause0").checked ? 0 : 1),30);
|
|
||||||
var pseudo = prompt("Saisissez votre pseudo", '');
|
|
||||||
window.location.replace("./game.html?mode="+modeSelected+"&diff="+diffSelected+"&pseudo="+ (pseudo==null ? "" : pseudo));
|
|
||||||
}
|
|
||||||
|
|
||||||
function index()
|
|
||||||
{
|
|
||||||
window.location.replace("./");
|
|
||||||
}
|
|
||||||
|
|
||||||
if(document.getElementById("diffSel")!=null)
|
|
||||||
{
|
|
||||||
console.log("LOADING");
|
|
||||||
diffSelected=document.getElementById("diffSel").value;
|
|
||||||
modeSelected=document.getElementById("modeSel").value;
|
|
||||||
amount=document.getElementById("dotsAmountSel").value;
|
|
||||||
gameSelected = (modeSelected.includes("s") ? "survie" : (modeSelected.includes("p") ? "points" : "temps"));
|
|
||||||
|
|
||||||
console.log("LOADED "+diffSelected+" " + modeSelected+ " "+ amount + " ");
|
|
||||||
|
|
||||||
disp(gameSelected, true);
|
|
||||||
document.getElementById("img_"+diffSelected).classList.add("selected");
|
|
||||||
document.getElementById("img_"+gameSelected).classList.add("selected");
|
|
||||||
document.getElementById("img_"+modeSelected).classList.add("selected");
|
|
||||||
document.getElementById("pause"+ document.getElementById("pauseSel").value).checked=true;
|
|
||||||
|
|
||||||
document.getElementById(diffSelected).checked=true;
|
|
||||||
document.getElementById(modeSelected).checked=true;
|
|
||||||
|
|
||||||
output.innerHTML = amount;
|
|
||||||
outputHi.value= amount;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
diffSelected="easy";
|
|
||||||
modeSelected="5p";
|
|
||||||
disp("points",true);
|
|
||||||
document.getElementById(diffSelected).checked=true;
|
|
||||||
document.getElementById(modeSelected).checked=true;
|
|
||||||
document.getElementById("img_points").classList.add("selected");
|
|
||||||
document.getElementById("img_5p").classList.add("selected");
|
|
||||||
document.getElementById("img_easy").classList.add("selected");
|
|
||||||
}
|
|
||||||
|
|
@ -1,158 +0,0 @@
|
|||||||
@font-face {
|
|
||||||
font-family: Segoe; src: url('ress/Segoepr.ttf');
|
|
||||||
}
|
|
||||||
|
|
||||||
.all-container {
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mode-container {
|
|
||||||
text-align: center;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button {
|
|
||||||
padding: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rad {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.selected {
|
|
||||||
-webkit-box-shadow:inset 0px 0px 0px 5px black;
|
|
||||||
-moz-box-shadow:inset 0px 0px 0px 5px black;
|
|
||||||
box-shadow:inset 0px 0px 0px 5px black;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slider {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
width: 100%;
|
|
||||||
height: 15px;
|
|
||||||
border-radius: 5px;
|
|
||||||
background: #d3d3d3;
|
|
||||||
outline: none;
|
|
||||||
opacity: 0.7;
|
|
||||||
-webkit-transition: .2s;
|
|
||||||
transition: opacity .2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slider::-webkit-slider-thumb {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
appearance: none;
|
|
||||||
width: 25px;
|
|
||||||
height: 25px;
|
|
||||||
border-radius: 50%;
|
|
||||||
background: #4CAF50;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slider::-moz-range-thumb {
|
|
||||||
width: 25px;
|
|
||||||
height: 25px;
|
|
||||||
border-radius: 50%;
|
|
||||||
background: #4CAF50;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* The Modal (background) */
|
|
||||||
.modal {
|
|
||||||
display: none; /* Hidden by default */
|
|
||||||
position: fixed; /* Stay in place */
|
|
||||||
z-index: 1; /* Sit on top */
|
|
||||||
padding-top: 100px; /* Location of the box */
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
width: 100%; /* Full width */
|
|
||||||
height: 100%; /* Full height */
|
|
||||||
overflow: auto; /* Enable scroll if needed */
|
|
||||||
background-color: rgb(0,0,0); /* Fallback color */
|
|
||||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Modal Content */
|
|
||||||
.modal-content {
|
|
||||||
background-color: #fefefe;
|
|
||||||
margin: auto;
|
|
||||||
padding: 20px;
|
|
||||||
border: 1px solid #888;
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* The Close Button */
|
|
||||||
.close {
|
|
||||||
color: #aaaaaa;
|
|
||||||
float: right;
|
|
||||||
font-size: 28px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.close:hover,
|
|
||||||
.close:focus {
|
|
||||||
color: #000;
|
|
||||||
text-decoration: none;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lightButton {
|
|
||||||
position: absolute;
|
|
||||||
right: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.day { background: #eee; color: black; }
|
|
||||||
.night { background: #333; color: white; }
|
|
||||||
|
|
||||||
.logo {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bd {
|
|
||||||
/*
|
|
||||||
border-style: solid;
|
|
||||||
border-width: 5px;*/
|
|
||||||
}
|
|
||||||
|
|
||||||
.ad { /*
|
|
||||||
border-style: solid;
|
|
||||||
border-width: 5px;
|
|
||||||
border-color: red; */
|
|
||||||
width: min-content;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.slot {
|
|
||||||
display: inline-block;
|
|
||||||
margin-left: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.texte {
|
|
||||||
font-size: medium;
|
|
||||||
font-family: Segoe;
|
|
||||||
}
|
|
||||||
|
|
||||||
.texteG {
|
|
||||||
font-size: xx-large;
|
|
||||||
/*font-weight: bold;*/
|
|
||||||
font-family: Segoe;
|
|
||||||
}
|
|
||||||
.bd {
|
|
||||||
|
|
||||||
border-style: solid;
|
|
||||||
border-width: 5px;
|
|
||||||
}
|
|
||||||
.bd2 {
|
|
||||||
border-color: mediumblue;
|
|
||||||
border-style: solid;
|
|
||||||
border-width: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
padding-inline-start: 0px;
|
|
||||||
}
|
|
@ -1,147 +0,0 @@
|
|||||||
<head>
|
|
||||||
<link rel="stylesheet" type="text/css" href="highscores.css"/>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div>
|
|
||||||
<div class="logo">
|
|
||||||
<img src="ress/logo_dark.png" id="logo"/>
|
|
||||||
<img src="ress/light" id="light" class="lightButton" onClick="switchLight()"/>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<form action="highscores.php" id="high_form" method="post">
|
|
||||||
<div class="mode-container">
|
|
||||||
<ul id="diff" class="all-container">
|
|
||||||
<input type="radio" class="rad" name="difficulty" id="easy" value="easy" />
|
|
||||||
<label for="easy"><img id="img_easy" class="button" src="./ress/button_diff_easy.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="difficulty" id="med" value="med" />
|
|
||||||
<label for="med"><img id="img_med" class="button" src="./ress/button_diff_normal.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="difficulty" id="hard" value="hard" />
|
|
||||||
<label for="hard"><img id="img_hard" class="button" src="./ress/button_diff_hard.png"/></label>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div id="modeSelection" class="mode-container">
|
|
||||||
<ul id="modes" class="all-container">
|
|
||||||
<img id="img_points" class="button" src="./ress/button_mode_points.png"/>
|
|
||||||
|
|
||||||
<img id="img_temps" class="button" src="./ress/button_mode_temps.png"/>
|
|
||||||
|
|
||||||
<img id="img_survie" class="button" src="./ress/button_mode_survie.png"/>
|
|
||||||
</ul>
|
|
||||||
<ul id="points" class="all-container ad">
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="5p" value="5p" />
|
|
||||||
<label for="5p"><img id="img_5p" class="button" src="./ress/button_points_5.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="10p" value="10p"/>
|
|
||||||
<label for="10p"><img id="img_10p" class="button" src="./ress/button_points_10.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="15p" value="15p" />
|
|
||||||
<label for="15p"><img id="img_15p" class="button" src="./ress/button_points_15.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="20p" value="20p" />
|
|
||||||
<label for="20p"><img id="img_20p" class="button" src="./ress/button_points_20.png"/></label>
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
<ul id="temps" class="all-container ad">
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="2m" value="2m" />
|
|
||||||
<label for="2m"><img id="img_2m" class="button" src="./ress/button_temps_2.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="3m" value="3m" />
|
|
||||||
<label for="3m"><img id="img_3m" class="button" src="./ress/button_temps_3.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="5m" value="5m" />
|
|
||||||
<label for="5m"><img id="img_5m" class="button" src="./ress/button_temps_5.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="10m" value="10m"/>
|
|
||||||
<label for="10m"><img id="img_10m" class="button" src="./ress/button_temps_10.png"/></label>
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
<ul id="survie" class="all-container ad">
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="15s" value="15s"/>
|
|
||||||
<label for="15s"><img id="img_15s" class="button" src="./ress/button_survie_15.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="30s" value="30s" />
|
|
||||||
<label for="30s"><img id="img_30s" class="button" src="./ress/button_survie_30.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="45s" value="45s" />
|
|
||||||
<label for="45s"><img id="img_45s" class="button" src="./ress/button_survie_45.png"/> </label>
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<div class="slot">
|
|
||||||
<p class="texte">Mode pause activé <input type="radio" id="pause1" value="1" name="pause">
|
|
||||||
<label for="pause1" class="texte">Oui</label>
|
|
||||||
<input type="radio" id="pause0" value="0" name="pause">
|
|
||||||
<label for="pause0" class="texte">Non</label> </p>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="slot">
|
|
||||||
<p class="texte">Nombre de dots
|
|
||||||
<img src="ress/-" onClick="less()" id="-"/>
|
|
||||||
<span id="dotsNumber" class="texte"></span>
|
|
||||||
<img src="ress/+" onClick="more()" id="+"/>
|
|
||||||
<input type="hidden" name="dotsAmount" id="amountHi"/></p>
|
|
||||||
</div>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
<?php
|
|
||||||
|
|
||||||
$database = new SQLite3("data.db");
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
if(isset($_POST["game_mode"]) && $_POST["game_mode"]!="" && $_POST["difficulty"]!="" && $_POST["dotsAmount"]!="" && $_POST["pause"]!="")
|
|
||||||
{
|
|
||||||
if(stristr($_POST['game_mode'], "p") === FALSE)
|
|
||||||
{
|
|
||||||
$sql='select score, player from score where game_mode="'.$_POST['game_mode'].'" and difficulty="'.$_POST['difficulty'].'" and dots_amount='.$_POST["dotsAmount"].' and pause='.$_POST["pause"].' and score=(select max(score) from score where game_mode="'.$_POST['game_mode'].'" and difficulty="'.$_POST['difficulty'].'" and dots_amount='.$_POST["dotsAmount"].' and pause='.$_POST["pause"].')';
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
$sql='select score, player from score where game_mode="'.$_POST['game_mode'].'" and difficulty="'.$_POST['difficulty'].'" and dots_amount='.$_POST["dotsAmount"].' and pause='.$_POST["pause"].' and score=(select min(score) from score where game_mode="'.$_POST['game_mode'].'" and difficulty="'.$_POST['difficulty'].'" and dots_amount='.$_POST["dotsAmount"].' and pause='.$_POST["pause"].')';
|
|
||||||
}
|
|
||||||
$result = $database->query($sql);
|
|
||||||
$a=$result->fetchArray();
|
|
||||||
|
|
||||||
if($a==false)
|
|
||||||
{
|
|
||||||
$phrase= "Il n'y a pas encore de score pour ce mode de jeu.";
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
$phrase="Le record est ".$a[0].", tenu par ".$a["player"];
|
|
||||||
while ($row = $result->fetchArray()) {
|
|
||||||
$phrase=$phrase.", ".$row["player"];
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
echo "<h1 id='aya' class='texte' >".$phrase."</h1>";
|
|
||||||
echo "<input type='hidden' id='modeSel' value='".$_POST["game_mode"]."'/>";
|
|
||||||
echo "<input type='hidden' id='diffSel' value='".$_POST["difficulty"]."'/>";
|
|
||||||
echo "<input type='hidden' id='dotsAmountSel' value='".$_POST["dotsAmount"]."'/>";
|
|
||||||
echo "<input type='hidden' id='pauseSel' value='".$_POST["pause"]."'/>";
|
|
||||||
}
|
|
||||||
?>
|
|
||||||
<div id="play" class="mode-container">
|
|
||||||
<img id="btn_play" src="ress/button_play.png" onClick="play()"/>
|
|
||||||
<!--<img id="btn_play_des" src="ress/button_play_desac.png"/>-->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<img id="btn_back" src="ress/button_back.png" class="back" onClick="index()"/>
|
|
||||||
|
|
||||||
<script src="bakery.js"></script>
|
|
||||||
<script src="highscore_button_displayer.js"></script>
|
|
||||||
<script src="themeSwitcher.js"></script>
|
|
||||||
<script src="bakery.js"></script>
|
|
||||||
<script src="themeSwitcher.js"></script>
|
|
||||||
</body>
|
|
@ -1,175 +0,0 @@
|
|||||||
@font-face {
|
|
||||||
font-family: Segoe; src: url('ress/segoepr.ttf');
|
|
||||||
}
|
|
||||||
|
|
||||||
.all-container {
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mode-container {
|
|
||||||
text-align: center;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bd {
|
|
||||||
|
|
||||||
border-style: solid;
|
|
||||||
border-width: 5px;
|
|
||||||
}
|
|
||||||
.bd2 {
|
|
||||||
border-color: mediumblue;
|
|
||||||
border-style: solid;
|
|
||||||
border-width: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ad {
|
|
||||||
width: min-content;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.z {
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.day { background: #eee; color: black; }
|
|
||||||
.night { background: #333; color: white; }
|
|
||||||
|
|
||||||
.button {
|
|
||||||
padding: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.selectedDay {
|
|
||||||
-webkit-box-shadow:inset 0px 0px 0px 5px black;
|
|
||||||
-moz-box-shadow:inset 0px 0px 0px 5px black;
|
|
||||||
box-shadow:inset 0px 0px 0px 5px black;
|
|
||||||
}
|
|
||||||
|
|
||||||
.selectedNight {
|
|
||||||
-webkit-box-shadow:inset 0px 0px 0px 5px #eee;
|
|
||||||
-moz-box-shadow:inset 0px 0px 0px 5px #eee;
|
|
||||||
box-shadow:inset 0px 0px 0px 5px #eee;
|
|
||||||
}
|
|
||||||
/* The Modal (background) */
|
|
||||||
.modal {
|
|
||||||
display: none; /* Hidden by default */
|
|
||||||
position: fixed; /* Stay in place */
|
|
||||||
z-index: 1; /* Sit on top */
|
|
||||||
padding-top: 100px; /* Location of the box */
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
width: 100%; /* Full width */
|
|
||||||
height: 100%; /* Full height */
|
|
||||||
overflow: auto; /* Enable scroll if needed */
|
|
||||||
/*background-color: rgb(0,0,0); /* Fallback color */
|
|
||||||
/*background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Modal Content */
|
|
||||||
.modal-content {
|
|
||||||
/*background-color: #fefefe;*/
|
|
||||||
margin: auto;
|
|
||||||
padding: 20px;
|
|
||||||
border: 1px solid #888;
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* The Close Button */
|
|
||||||
.close {
|
|
||||||
color: #aaaaaa;
|
|
||||||
float: right;
|
|
||||||
font-size: 28px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.close:hover,
|
|
||||||
.close:focus {
|
|
||||||
color: #000;
|
|
||||||
text-decoration: none;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dot {
|
|
||||||
background-color: green;
|
|
||||||
border-radius: 50%;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.both {
|
|
||||||
background-image: url("ress/green.png");
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pickr {
|
|
||||||
width: 30px;
|
|
||||||
height: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.logo {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lightButton {
|
|
||||||
position: absolute;
|
|
||||||
right: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.settingsButton {
|
|
||||||
position: absolute;
|
|
||||||
left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slot {
|
|
||||||
display: inline-block;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.gem {
|
|
||||||
position: absolute;
|
|
||||||
top: 50%;
|
|
||||||
left: 50%;
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.texte {
|
|
||||||
font-size: medium;
|
|
||||||
font-family: Segoe;
|
|
||||||
}
|
|
||||||
|
|
||||||
.texteG {
|
|
||||||
font-size: xx-large;
|
|
||||||
/*font-weight: bold;*/
|
|
||||||
font-family: Segoe;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
padding-inline-start: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.player {
|
|
||||||
position: absolute;
|
|
||||||
left: 5px;
|
|
||||||
}
|
|
||||||
.rad {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mid {
|
|
||||||
margin: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg {
|
|
||||||
position: absolute;
|
|
||||||
bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.patchnote {
|
|
||||||
border: none;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
@ -0,0 +1,39 @@
|
|||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
On the Dot
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<form action="./game.html" method="GET">
|
||||||
|
<input type="radio" id="no-res" name="diff" value="no-res">
|
||||||
|
<label for="no-res">Sans réserve</label><br>
|
||||||
|
Jouer la partie en : </br>
|
||||||
|
<input type="radio" id="5pts" name="mode" value="5p">
|
||||||
|
<label for="5pts">5 points</label><br>
|
||||||
|
<input type="radio" id="10pts" name="mode" value="10p">
|
||||||
|
<label for="5pts">10 points</label><br>
|
||||||
|
<input type="radio" id="15pts" name="mode" value="15p">
|
||||||
|
<label for="5pts">15 points</label><br>
|
||||||
|
<input type="radio" id="20pts" name="mode" value="20p">
|
||||||
|
<label for="5pts">20 points</label><br>
|
||||||
|
<input type="radio" id="5min" name="mode" value="5m">
|
||||||
|
<label for="5pts">5 minutes</label><br>
|
||||||
|
<input type="radio" id="10min" name="mode" value="10m">
|
||||||
|
<label for="5pts">10 minutes</label><br>
|
||||||
|
|
||||||
|
<input type="radio" id="survie" name="mode" value="surv">
|
||||||
|
<label for="5pts">survie</label><br>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="button">
|
||||||
|
<button type="submit">JOUER !</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
Partie en points : la partie se finit quand vous obtenez le nombre de points choisi. Mettez le moins de temps possible ! </br>
|
||||||
|
Partie en temps : la partie se finit quand le temps imparti est écoulé. Obtenez le plus de points possible ! </br>
|
||||||
|
Partie en survie : la partie se finit quand le temps atteint 0. Gagner un point vous rajoute 30s, obtenez le plus de points possible ! </br>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -1,292 +1,16 @@
|
|||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>On The Dot</title>
|
|
||||||
<link rel="stylesheet" type="text/css" href="index.css"/>
|
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@simonwep/pickr/dist/themes/monolith.min.css"/> <!-- 'monolith' theme -->
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/@simonwep/pickr/dist/pickr.min.js"></script>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<script>console.log("index");</script>
|
|
||||||
<div>
|
|
||||||
<div class="logo">
|
|
||||||
<img id="btn_options" src="./ress/gear.png" class="settingsButton" />
|
|
||||||
<img src="ress/logo_dark.png" id="logo"/>
|
|
||||||
<img src="ress/light" id="light" class="lightButton" onClick="switchLight()"/>
|
|
||||||
|
|
||||||
</div>
|
On the Dot
|
||||||
|
</head>
|
||||||
</div>
|
<body>
|
||||||
|
<form action="./game.php" method="post">
|
||||||
|
<input type="radio" id="no-res" name="mode" value="no-res">
|
||||||
<form action="index.php" id="high_form" method="post">
|
<label for="no-res">Sans réserve</label><br>
|
||||||
<div class="mode-container">
|
<div class="button">
|
||||||
<ul id="diff" class="all-container">
|
<button type="submit">JOUER !</button>
|
||||||
<input type="radio" class="rad" name="difficulty" id="easy" value="easy" />
|
|
||||||
<label for="easy"><img id="img_easy" class="button" src="./ress/button_diff_easy.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="difficulty" id="med" value="med" />
|
|
||||||
<label for="med"><img id="img_med" class="button" src="./ress/button_diff_normal.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="difficulty" id="hard" value="hard" />
|
|
||||||
<label for="hard"><img id="img_hard" class="button" src="./ress/button_diff_hard.png"/></label>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div id="modeSelection" class="mode-container">
|
|
||||||
<ul id="modes" class="all-container">
|
|
||||||
<img id="img_points" class="button" src="./ress/button_mode_points.png"/>
|
|
||||||
|
|
||||||
<img id="img_temps" class="button" src="./ress/button_mode_temps.png"/>
|
|
||||||
|
|
||||||
<img id="img_survie" class="button" src="./ress/button_mode_survie.png"/>
|
|
||||||
</ul>
|
|
||||||
<ul id="points" class="all-container ad">
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="5p" value="5p" />
|
|
||||||
<label for="5p"><img id="img_5p" class="button" src="./ress/button_points_5.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="10p" value="10p"/>
|
|
||||||
<label for="10p"><img id="img_10p" class="button mid" src="./ress/button_points_10.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="15p" value="15p" />
|
|
||||||
<label for="15p"><img id="img_15p" class="button" src="./ress/button_points_15.png"/></label>
|
|
||||||
|
|
||||||
<!--<input type="radio" class="rad" name="game_mode" id="20p" value="20p" />
|
|
||||||
<label for="20p"><img id="img_20p" class="button" src="./ress/button_points_20.png"/></label>-->
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
<ul id="temps" class="all-container ad">
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="2m" value="2m" />
|
|
||||||
<label for="2m"><img id="img_2m" class="button" src="./ress/button_temps_2.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="3m" value="3m" />
|
|
||||||
<label for="3m"><img id="img_3m" class="button mid" src="./ress/button_temps_3.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="5m" value="5m" />
|
|
||||||
<label for="5m"><img id="img_5m" class="button" src="./ress/button_temps_5.png"/></label>
|
|
||||||
|
|
||||||
<!--<input type="radio" class="rad" name="game_mode" id="10m" value="10m"/>
|
|
||||||
<label for="10m"><img id="img_10m" class="button" src="./ress/button_temps_10.png"/></label>-->
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
<ul id="survie" class="all-container ad">
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="15s" value="15s"/>
|
|
||||||
<label for="15s"><img id="img_15s" class="button" src="./ress/button_survie_15.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="30s" value="30s" />
|
|
||||||
<label for="30s"><img id="img_30s" class="button mid" src="./ress/button_survie_30.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="game_mode" id="45s" value="45s" />
|
|
||||||
<label for="45s"><img id="img_45s" class="button" src="./ress/button_survie_45.png"/> </label>
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<ul id="pause" class="all-container ad" style="display :flex;">
|
|
||||||
<input type="radio" class="rad" name="pause" id="pause_1" value="1" />
|
|
||||||
<label for="1"><img id="img_pause_1" class="button" src="./ress/button_pause_1.png"/></label>
|
|
||||||
|
|
||||||
<input type="radio" class="rad" name="pause" id="pause_0" value="0"/>
|
|
||||||
<label for="0"><img id="img_pause_0" class="button" src="./ress/button_pause_0.png"/></label>
|
|
||||||
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div class="slot">
|
|
||||||
<p class="texte">
|
|
||||||
<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>
|
|
||||||
|
|
||||||
<img id="img_gem1" class="gem"/>
|
|
||||||
<img id="img_gem2" class="gem"/>
|
|
||||||
<img id="img_gem3" class="gem"/>
|
|
||||||
<img id="img_gem4" class="gem"/>
|
|
||||||
<img id="img_gem5" class="gem"/>
|
|
||||||
<img id="img_gem6" class="gem"/>
|
|
||||||
<img id="img_gem7" class="gem"/>
|
|
||||||
<img id="img_gem8" class="gem"/>
|
|
||||||
|
|
||||||
<span id="gem1D" class="slot"></span>
|
|
||||||
<span id="gem2D" class="slot"></span>
|
|
||||||
<span id="gem3D" class="slot"></span>
|
|
||||||
<span id="gem4D" class="slot"></span>
|
|
||||||
<span id="gem5D" class="slot"></span>
|
|
||||||
<span id="gem6D" class="slot"></span>
|
|
||||||
<span id="gem7D" class="slot"></span>
|
|
||||||
<span id="gem8D" class="slot"></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>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
<?php
|
|
||||||
|
|
||||||
$database = new SQLite3("data.db");
|
|
||||||
|
|
||||||
// echo isset($_POST["game_mode"])." ".isset($_POST["difficulty"])." ".isset($_POST["dotsAmount"])." ".isset($_POST["pause"]);
|
|
||||||
$toDisp=5;
|
|
||||||
if(isset($_POST["game_mode"]) && $_POST["game_mode"]!="" && $_POST["difficulty"]!="" && $_POST["dotsAmount"]!="" && $_POST["pause"]!="")
|
|
||||||
{
|
|
||||||
$db_game_mode=$_POST["game_mode"];
|
|
||||||
$db_difficulty=$_POST["difficulty"];
|
|
||||||
$db_dotsAmount=$_POST["dotsAmount"];
|
|
||||||
$db_pause=$_POST["pause"];
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
$db_game_mode="5p";
|
|
||||||
$db_difficulty="easy";
|
|
||||||
$db_dotsAmount=(isset($_COOKIE["dotsAmount"])) ? $_COOKIE["dotsAmount"] : 4;
|
|
||||||
$db_pause=(isset($_COOKIE["pause"])) ? $_COOKIE["pause"] : 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(stristr($db_game_mode, "p") === FALSE)
|
|
||||||
{
|
|
||||||
$sql='select score, player from score where game_mode="'.$db_game_mode.'" and difficulty="'.$db_difficulty.'" and dots_amount='.$db_dotsAmount.' and pause='.$db_pause.' order by score desc limit '.$toDisp;
|
|
||||||
$unit="points";
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
$sql='select score, player from score where game_mode="'.$db_game_mode.'" and difficulty="'.$db_difficulty.'" and dots_amount='.$db_dotsAmount.' and pause='.$db_pause.' order by score asc limit '.$toDisp;
|
|
||||||
$unit="secondes";
|
|
||||||
}
|
|
||||||
$result = $database->query($sql);
|
|
||||||
$a=$result->fetchArray();
|
|
||||||
|
|
||||||
if($a==false)
|
|
||||||
{
|
|
||||||
$phrase= "Il n'y a pas encore de score pour ce mode de jeu.";
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
$phrase="1° ".$a["player"].", ".$a[0]." ".$unit;
|
|
||||||
$cpt=2;
|
|
||||||
while ($row = $result->fetchArray()) {
|
|
||||||
|
|
||||||
$phrase=$phrase."</br>".$cpt."° ".$row["player"].", ".$row["score"]." ".$unit;
|
|
||||||
$cpt++;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
echo "<h1 id='aya' class='texte mode-container' >".$phrase."</h1>";
|
|
||||||
|
|
||||||
if(isset($_POST["game_mode"]) && $_POST["game_mode"]!="" && $_POST["difficulty"]!="" && $_POST["dotsAmount"]!="" && $_POST["pause"]!="")
|
|
||||||
{
|
|
||||||
echo "<input type='hidden' id='modeSel' value='".$_POST["game_mode"]."'/>";
|
|
||||||
echo "<input type='hidden' id='diffSel' value='".$_POST["difficulty"]."'/>";
|
|
||||||
echo "<input type='hidden' id='dotsAmountSel' value='".$_POST["dotsAmount"]."'/>";
|
|
||||||
echo "<input type='hidden' id='pauseSel' value='".$_POST["pause"]."'/>";
|
|
||||||
}
|
|
||||||
|
|
||||||
?>
|
|
||||||
<div class="mode-container">
|
|
||||||
<ul id="btns_play">
|
|
||||||
<img id="btn_play" src="ress/button_play.png" onClick="play()"/>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<img id="btn_patchnote" src="./ress/button_patchnote.png" class="bg"/>
|
|
||||||
|
|
||||||
<div id="patchnote" class="modal">
|
|
||||||
<div class="modal-content" id="patchnoteContenu">
|
|
||||||
<span class="close" id="close_patchnote">×</span>
|
|
||||||
<p class="texte">Notes de mise à jour</p>
|
|
||||||
<!--<iframe src="patchnote1.txt" class="texte patchnote" id="patchnote_content"></iframe>-->
|
|
||||||
<?php
|
|
||||||
$ct=htmlspecialchars(file_get_contents("patchnote1.txt"));
|
|
||||||
$ct=str_replace("\n","<br/>",$ct);
|
|
||||||
//var_dump($ct);
|
|
||||||
echo '<p class="texte">'.$ct.'</p>';
|
|
||||||
?>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- The Modal -->
|
|
||||||
<div id="optionsModal" class="modal">
|
|
||||||
|
|
||||||
<!-- Modal content -->
|
|
||||||
<div class="modal-content" id="modal">
|
|
||||||
<span class="close" id="close_options">×</span>
|
|
||||||
<p class="texte ad">Options</p>
|
|
||||||
<div class="slidecontainer">
|
|
||||||
<div id="displays">
|
|
||||||
<p class="texte">
|
|
||||||
Mode d'affichage
|
|
||||||
<span id="points_di" class="dot" onClick="selectDisplay('points')"></span>
|
|
||||||
<img id="gems_di" src="ress/green.png" onClick="selectDisplay('gems')"/>
|
|
||||||
<span id="both_di" class="dot both" onClick="selectDisplay('both')"></span>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="color_pickers" class="color-pickers">
|
|
||||||
<div class="texte"> Couleurs des dots
|
|
||||||
<span id="col1" class="dot col1 pickr"></span>
|
|
||||||
<span id="col2" class="dot col2 pickr"></span>
|
|
||||||
<span id="col3" class="dot col3 pickr"></span>
|
|
||||||
<span id="col4" class="dot col4 pickr"></span>
|
|
||||||
<span id="col5" class="dot col5 pickr"></span>
|
|
||||||
<span id="col6" class="dot col6 pickr"></span>
|
|
||||||
<span id="col7" class="dot col7 pickr"></span>
|
|
||||||
<span id="col8" class="dot col8 pickr"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="gems_picker">
|
|
||||||
<img id="gem1" class="gem" draggable="true" ondragstart="drag(event)"/>
|
|
||||||
<img id="gem2" class="gem" draggable="true" ondragstart="drag(event)"/>
|
|
||||||
<img id="gem3" class="gem" draggable="true" ondragstart="drag(event)"/>
|
|
||||||
<img id="gem4" class="gem" draggable="true" ondragstart="drag(event)"/>
|
|
||||||
<img id="gem5" class="gem" draggable="true" ondragstart="drag(event)"/>
|
|
||||||
<img id="gem6" class="gem" draggable="true" ondragstart="drag(event)"/>
|
|
||||||
<img id="gem7" class="gem" draggable="true" ondragstart="drag(event)"/>
|
|
||||||
<img id="gem8" class="gem" draggable="true" ondragstart="drag(event)"/>
|
|
||||||
<div>
|
|
||||||
<p class="texte">Gemmes à afficher</p>
|
|
||||||
<span id="slot1" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
|
|
||||||
<span id="slot2" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
|
|
||||||
<span id="slot3" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
|
|
||||||
<span id="slot4" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
|
|
||||||
<span id="slot5" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
|
|
||||||
<span id="slot6" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
|
|
||||||
<span id="slot7" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
|
|
||||||
<span id="slot8" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
|
|
||||||
<img id="resetGems2" onClick="resetGems()" src="ress/reset"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class=" mode-container z">
|
|
||||||
<img src="ress/OK.png" id="btn_confirm" onClick="saveOptions()"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</body>
|
||||||
<script src="bakery.js"></script>
|
|
||||||
<script src="button_displayer.js"></script>
|
|
||||||
<script src="options.js"></script>
|
|
||||||
<script src="patchnote.js"></script>
|
|
||||||
<script src="modals.js"></script>
|
|
||||||
<script src="themeSwitcher.js"></script>
|
|
||||||
<script>
|
|
||||||
dispDots();
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
</html>
|
@ -1,36 +0,0 @@
|
|||||||
var player = document.getElementById("player");
|
|
||||||
var mode = document.getElementById("mode");
|
|
||||||
var modeString;
|
|
||||||
|
|
||||||
if(player!=null)
|
|
||||||
{
|
|
||||||
if(get['pseudo']=="")
|
|
||||||
{
|
|
||||||
player.style.display="none";
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
player.innerHTML = get['pseudo'];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
if (get['mode'].includes('p'))
|
|
||||||
{
|
|
||||||
modeString = get['mode'].substring(0,get['mode'].length-1) + " points";
|
|
||||||
}
|
|
||||||
else if(get['mode'].includes('m'))
|
|
||||||
{
|
|
||||||
modeString = get['mode'].substring(0,get['mode'].length-1) + " minutes";
|
|
||||||
}
|
|
||||||
else if(get['mode'].includes('s'))
|
|
||||||
{
|
|
||||||
modeString = "Survie, +" + get['mode'];
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateInfos()
|
|
||||||
{
|
|
||||||
mode.innerHTML = modeString + ", " + (get["diff"]=="easy" ? "facile" : (get["diff"]=="med" ? "moyen" : "difficile")) + "\n" + (getCookie("pause")==0 ? "pas de pause" : "avec pause");
|
|
||||||
}
|
|
||||||
|
|
||||||
updateInfos();
|
|
@ -1,20 +0,0 @@
|
|||||||
// When the user clicks anywhere outside of the modalPatch, close it
|
|
||||||
window.onclick = function(event) {
|
|
||||||
if (event.target == modalPatch || event.target == modalOptions) {
|
|
||||||
console.log(modalPatch.style.display + " " + modalOptions.style.display);
|
|
||||||
modalPatch.style.display = "none";
|
|
||||||
modalOptions.style.display = "none";
|
|
||||||
console.log(modalPatch.style.display + " " + modalOptions.style.display);
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// When the user clicks on <spanPatch> (x), close the modalPatch
|
|
||||||
spanPatch.onclick = function() {
|
|
||||||
modalPatch.style.display = "none";
|
|
||||||
}
|
|
||||||
|
|
||||||
// When the user clicks on <spanOptions> (x), close the modalOptions
|
|
||||||
spanOptions.onclick = function() {
|
|
||||||
modalOptions.style.display = "none";
|
|
||||||
}
|
|
@ -1,245 +0,0 @@
|
|||||||
// Get the modalOptions
|
|
||||||
var modalOptions = document.getElementById("optionsModal");
|
|
||||||
|
|
||||||
// Get the button that opens the modalOptions
|
|
||||||
var btnOptions = document.getElementById("btn_options");
|
|
||||||
|
|
||||||
// Get the <spanOptions> element that closes the modalOptions
|
|
||||||
var spanOptions = document.getElementById("close_options");
|
|
||||||
|
|
||||||
// When the user clicks the button, open the modalOptions
|
|
||||||
btnOptions.onclick = function() {
|
|
||||||
modalOptions.style.display = "block";
|
|
||||||
document.getElementById("color_pickers").style.display= (displ!="points" ? "none" : "inline");
|
|
||||||
document.getElementById("gems_picker").style.display= (displ=="points" ? "none" : "inline");
|
|
||||||
document.getElementById(getCookie("displayMode")+"_di").classList.add(selectedTheme);
|
|
||||||
if(displ=="both")
|
|
||||||
{
|
|
||||||
applyBackgrounds();
|
|
||||||
|
|
||||||
backgroundBoth();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/*
|
|
||||||
// When the user clicks on <spanOptions> (x), close the modalOptions
|
|
||||||
spanOptions.onclick = function() {
|
|
||||||
modalOptions.style.display = "none";
|
|
||||||
}
|
|
||||||
|
|
||||||
// When the user clicks anywhere outside of the modalOptions, close it
|
|
||||||
window.onclick = function(event) {
|
|
||||||
if (event.target == modalOptions) {
|
|
||||||
modalOptions.style.display = "none";
|
|
||||||
modalPatch.style.display = "none";
|
|
||||||
|
|
||||||
}
|
|
||||||
}*/
|
|
||||||
|
|
||||||
|
|
||||||
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");
|
|
||||||
if(displ=="both")
|
|
||||||
{
|
|
||||||
applyBackgrounds();
|
|
||||||
|
|
||||||
backgroundBoth();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
function saveOptions() {
|
|
||||||
modalOptions.style.display = "none";
|
|
||||||
}
|
|
||||||
|
|
||||||
//initialisation des valeurs des préférences
|
|
||||||
|
|
||||||
document.getElementById("gems_di").width=size/6;
|
|
||||||
document.getElementById("points_di").style.height=size/6;
|
|
||||||
document.getElementById("points_di").style.width=size/6;
|
|
||||||
document.getElementById("both_di").style.height=size/6;
|
|
||||||
document.getElementById("both_di").style.width=size/6;
|
|
||||||
document.getElementById("both_di").style.backgroundSize=size/8+"px";
|
|
||||||
document.getElementById("btn_confirm").width=size/4;
|
|
||||||
|
|
||||||
var displ=getCookie("displayMode");
|
|
||||||
|
|
||||||
function selectDisplay(e)
|
|
||||||
{
|
|
||||||
displ=e;
|
|
||||||
setCookie("displayMode",e,30);
|
|
||||||
document.getElementById("points_di").classList.remove(selectedTheme);
|
|
||||||
document.getElementById("gems_di").classList.remove(selectedTheme);
|
|
||||||
document.getElementById("both_di").classList.remove(selectedTheme);
|
|
||||||
document.getElementById(e+"_di").classList.add(selectedTheme);
|
|
||||||
backgroundBoth();
|
|
||||||
if(displ=="both")
|
|
||||||
{
|
|
||||||
applyBackgrounds();
|
|
||||||
}
|
|
||||||
dispDots();
|
|
||||||
}
|
|
||||||
|
|
||||||
function backgroundBoth()
|
|
||||||
{
|
|
||||||
|
|
||||||
for(var cpt=1;cpt<9;cpt++)
|
|
||||||
{
|
|
||||||
eval("slot"+cpt+".classList."+(displ=="both" ? "add" : "remove")+"('dot')");
|
|
||||||
if(displ=="both")
|
|
||||||
{
|
|
||||||
eval("slot"+cpt+".style.backgroundColor='"+gemsSelected[cpt-1]+"'");
|
|
||||||
eval("gem"+cpt+".width=size/8");
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
eval("slot"+cpt+".style.backgroundColor=''");
|
|
||||||
eval("gem"+cpt+".width=size/6");
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
var customColorsAvailable=["#FF0000","#ffff00","#008000","#800080","#000000","#8b4513","#00ffff","#ffa500"];
|
|
||||||
|
|
||||||
|
|
||||||
for(var cpt=1;cpt<9;cpt++)
|
|
||||||
{
|
|
||||||
eval('pickr'+cpt+` = Pickr.create({
|
|
||||||
el: '.col`+cpt+`',
|
|
||||||
theme: 'monolith',
|
|
||||||
default: (getCookie("color_`+cpt+`")=="" ? customColorsAvailable[cpt-1] : getCookie("color_`+cpt+`")),
|
|
||||||
useAsButton: true,
|
|
||||||
|
|
||||||
swatches:["red","yellow","green","purple","black","brown","cyan","orange"],
|
|
||||||
|
|
||||||
components: {
|
|
||||||
|
|
||||||
// Main components
|
|
||||||
preview: true,
|
|
||||||
hue: true,
|
|
||||||
|
|
||||||
// Input / output Options
|
|
||||||
interaction: {
|
|
||||||
hex: true,
|
|
||||||
input: true,
|
|
||||||
clear: true,
|
|
||||||
save: true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});`);
|
|
||||||
|
|
||||||
eval("pickr"+cpt+`.on('init', function() {
|
|
||||||
document.getElementById("col`+cpt+`").style.background=pickr`+cpt+`.getSelectedColor().toHEXA().toString();
|
|
||||||
}).on('save', function () {
|
|
||||||
document.getElementById("col`+cpt+`").style.background=pickr`+cpt+`.getColor().toHEXA().toString();
|
|
||||||
colorBake();
|
|
||||||
pickr`+cpt+`.hide();
|
|
||||||
dispDots();
|
|
||||||
});`);
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
function colorBake()
|
|
||||||
{
|
|
||||||
for(var cpt=1;cpt<9;cpt++)
|
|
||||||
{
|
|
||||||
setCookie("color_"+cpt,eval("pickr"+cpt+".getColor().toHEXA().toString()"),30);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function gemBake()
|
|
||||||
{
|
|
||||||
for(var cpt=1;cpt<9;cpt++)
|
|
||||||
{
|
|
||||||
setCookie("gem"+cpt,eval("gem"+cpt).src.substring(document.getElementById("gem"+cpt).src.search("/ress")+6),30);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function allowDrop(ev) {
|
|
||||||
ev.preventDefault();
|
|
||||||
}
|
|
||||||
|
|
||||||
function drag(ev) {
|
|
||||||
ev.dataTransfer.setData("text", ev.target.id);
|
|
||||||
dragFrom=ev.currentTarget.parentElement;
|
|
||||||
}
|
|
||||||
|
|
||||||
var dragFrom;
|
|
||||||
|
|
||||||
function drop(ev) {
|
|
||||||
ev.preventDefault();
|
|
||||||
var data = ev.dataTransfer.getData("text");
|
|
||||||
var color;
|
|
||||||
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);
|
|
||||||
if(displ=="both")
|
|
||||||
{/*
|
|
||||||
var target = document.getElementById("slot"+dragFrom.id.substring(4));
|
|
||||||
target.style.backgroundColor=target.children[0].src.substring(target.children[0].src.search("/ress")+6);
|
|
||||||
|
|
||||||
target = document.getElementById("slot"+ev.currentTarget.id.substring(4));
|
|
||||||
target.style.backgroundColor=target.children[0].src.substring(target.children[0].src.search("/ress")+6);*/
|
|
||||||
applyBackgrounds();
|
|
||||||
}
|
|
||||||
//gemBake();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function applyBackgrounds()
|
|
||||||
{
|
|
||||||
for(var cpt=1;cpt<9;cpt++)
|
|
||||||
{
|
|
||||||
var target = document.getElementById("slot"+cpt);
|
|
||||||
target.classList.add("dot");
|
|
||||||
target.style.backgroundColor=target.children[0].src.substring(target.children[0].src.search("/ress")+6);
|
|
||||||
//console.log("cookie avant : "+getCookie("gem"+cpt));
|
|
||||||
setCookie("gem"+cpt,target.style.backgroundColor,30);
|
|
||||||
//console.log("cookie après : "+getCookie("gem"+cpt));
|
|
||||||
//console.log("trg : "+target.id+ "|"+target.children[0].src.substring(target.children[0].src.search("/ress")+6));
|
|
||||||
}
|
|
||||||
dispDots();
|
|
||||||
}
|
|
||||||
|
|
||||||
var gemsAvailable=["green","yellow","cyan","red","purple","orange","brown","black"];
|
|
||||||
var gemsSelected=[];
|
|
||||||
|
|
||||||
for(var cpt=0;cpt<8;cpt++)
|
|
||||||
{
|
|
||||||
gemsSelected[cpt]= (getCookie("gem"+(cpt+1))=="" ? gemsAvailable[cpt] : getCookie("gem"+(cpt+1)));
|
|
||||||
//console.log("get : "+gemsSelected[cpt]);
|
|
||||||
}
|
|
||||||
|
|
||||||
for(var cpt=1;cpt<9;cpt++)
|
|
||||||
{
|
|
||||||
eval("var gemIcon_"+gemsSelected[cpt-1]+"=document.getElementById('gem"+cpt+"')");
|
|
||||||
eval('gemIcon_'+gemsSelected[cpt-1]+'.src="ress/'+gemsSelected[cpt-1]+'"');
|
|
||||||
eval('gemIcon_'+gemsSelected[cpt-1]+'.width=size/6');
|
|
||||||
|
|
||||||
eval("var slot"+cpt+"=document.getElementById('slot"+cpt+"')");
|
|
||||||
eval("slot"+cpt+".style.width=size/6");
|
|
||||||
eval("slot"+cpt+".style.height=size/6");
|
|
||||||
|
|
||||||
document.getElementById("slot"+cpt).appendChild(eval("gem"+cpt));
|
|
||||||
}
|
|
||||||
|
|
||||||
//document.getElementById("resetGems").width=size/2;
|
|
||||||
document.getElementById("resetGems2").width=size/4;
|
|
||||||
|
|
||||||
function resetGems()
|
|
||||||
{
|
|
||||||
for(var cpt=1;cpt<9;cpt++)
|
|
||||||
{
|
|
||||||
setCookie("gem"+cpt,"",30);
|
|
||||||
document.getElementById("slot"+cpt).appendChild(eval("gemIcon_"+gemsAvailable[cpt-1]));
|
|
||||||
//console.log("sl "+"slot"+cpt+" | "+"gemIcon_"+gemsAvailable[cpt-1]);
|
|
||||||
}
|
|
||||||
|
|
||||||
if(displ=="both")
|
|
||||||
{
|
|
||||||
//backgroundBoth();
|
|
||||||
applyBackgrounds();
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,36 +0,0 @@
|
|||||||
// Get the modalPatch
|
|
||||||
var modalPatch = document.getElementById("patchnote");
|
|
||||||
|
|
||||||
// Get the button that opens the modalPatch
|
|
||||||
var btnPatch = document.getElementById("btn_patchnote");
|
|
||||||
|
|
||||||
// Get the <spanPatch> element that closes the modalPatch
|
|
||||||
var spanPatch = document.getElementById("close_patchnote");
|
|
||||||
|
|
||||||
// When the user clicks the button, open the modalPatch
|
|
||||||
btnPatch.onclick = function() {
|
|
||||||
modalPatch.style.display = "block";
|
|
||||||
}
|
|
||||||
|
|
||||||
// When the user clicks on <spanPatch> (x), close the modalPatch
|
|
||||||
spanPatch.onclick = function() {
|
|
||||||
modalPatch.style.display = "none";
|
|
||||||
}
|
|
||||||
/*
|
|
||||||
// When the user clicks anywhere outside of the modalPatch, close it
|
|
||||||
window.onclick = function(event) {
|
|
||||||
if (event.target == modalPatch) {
|
|
||||||
modalPatch.style.display = "none";
|
|
||||||
modalOptions.style.display = "none";
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// When the user clicks on <spanPatch> (x), close the modalPatch
|
|
||||||
spanPatch.onclick = function() {
|
|
||||||
modalPatch.style.display = "none";
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
var content = document.getElementById("patchnote_content");
|
|
||||||
//content.style.width=modalPatch.width;
|
|
@ -1,5 +0,0 @@
|
|||||||
Modification du mode survie :
|
|
||||||
- La difficulté devient "normal" en atteignant 30 points (si le mode "facile" avait été sélectionné)
|
|
||||||
- La difficulté devient "difficile" en atteignant 60 points (si le mode "facile" ou "normal" avait été sélectionné)
|
|
||||||
|
|
||||||
- Le nombre de secondes récupéré diminue au fil de la partie (une seconde de moins tous les 3 points gagnés, avec un minimum de 15/10/5 secondes selon le mode de difficulté)
|
|
@ -1,13 +0,0 @@
|
|||||||
<?php
|
|
||||||
|
|
||||||
$database = new SQLite3("data.db");
|
|
||||||
$sql='select score, player from score where difficulty="easy" order by score desc limit 5';
|
|
||||||
$result = $database->query($sql);
|
|
||||||
//$a=$result->fetchArray();
|
|
||||||
|
|
||||||
$phrase="|";
|
|
||||||
while ($row = $result->fetchArray()) {
|
|
||||||
$phrase=$phrase."</br> ".$row["player"].":".$row["score"];
|
|
||||||
}
|
|
||||||
echo $phrase;
|
|
||||||
?>
|
|
Before Width: | Height: | Size: 211 KiB |
Before Width: | Height: | Size: 181 KiB |
Before Width: | Height: | Size: 164 KiB |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 2.3 KiB |
Before Width: | Height: | Size: 2.4 KiB |
Before Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 2.1 KiB |
Before Width: | Height: | Size: 2.1 KiB |
Before Width: | Height: | Size: 3.5 KiB |
Before Width: | Height: | Size: 3.5 KiB |
Before Width: | Height: | Size: 2.1 KiB |
Before Width: | Height: | Size: 2.9 KiB |
Before Width: | Height: | Size: 2.6 KiB |
Before Width: | Height: | Size: 2.9 KiB |
Before Width: | Height: | Size: 3.3 KiB |
Before Width: | Height: | Size: 2.5 KiB |
Before Width: | Height: | Size: 2.5 KiB |
Before Width: | Height: | Size: 2.1 KiB |
Before Width: | Height: | Size: 2.1 KiB |
Before Width: | Height: | Size: 2.3 KiB |
Before Width: | Height: | Size: 2.2 KiB |
Before Width: | Height: | Size: 2.4 KiB |
Before Width: | Height: | Size: 2.2 KiB |
Before Width: | Height: | Size: 2.3 KiB |
Before Width: | Height: | Size: 2.6 KiB |
Before Width: | Height: | Size: 2.6 KiB |
Before Width: | Height: | Size: 2.5 KiB |
Before Width: | Height: | Size: 2.4 KiB |
Before Width: | Height: | Size: 2.3 KiB |
Before Width: | Height: | Size: 2.3 KiB |
Before Width: | Height: | Size: 2.4 KiB |
Before Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 236 KiB |
Before Width: | Height: | Size: 30 KiB |
Before Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 16 KiB |
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 2.5 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 230 KiB |
Before Width: | Height: | Size: 234 KiB |
Before Width: | Height: | Size: 235 KiB |
Before Width: | Height: | Size: 223 KiB |
@ -0,0 +1,13 @@
|
|||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<script src="selecteur.js"></script>
|
||||||
|
Votre score est : <h1 id="points"></h1>
|
||||||
|
<script>
|
||||||
|
document.getElementById("points").innerHTML = get['pts'];
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -1,129 +0,0 @@
|
|||||||
<html>
|
|
||||||
<head>
|
|
||||||
|
|
||||||
<link rel="stylesheet" type="text/css" href="index.css"/>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="logo">
|
|
||||||
<img src="ress/logo_dark.png" id="logo"/>
|
|
||||||
<img src="ress/light" id="light" class="lightButton" onClick="switchLight()"/>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="selecteur.js"></script>
|
|
||||||
<p class="texteG" id="mode">Mode de jeu : </p>
|
|
||||||
<p class="texteG" id="points"></p>
|
|
||||||
|
|
||||||
<?php
|
|
||||||
$database = new SQLite3("data.db");
|
|
||||||
$toDisp=5;
|
|
||||||
if(stristr($_GET['mode'], "p") === FALSE)
|
|
||||||
{
|
|
||||||
$sql='select score, player from score where game_mode="'.$_GET['mode'].'" and difficulty="'.$_GET['diff'].'" and dots_amount='.$_COOKIE["dotsAmount"].' and pause='.$_COOKIE["pause"].' order by score desc limit '.$toDisp;
|
|
||||||
$unit="points";
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
$sql='select score, player from score where game_mode="'.$_GET['mode'].'" and difficulty="'.$_GET['diff'].'" and dots_amount='.$_COOKIE["dotsAmount"].' and pause='.$_COOKIE["pause"].' order by score asc limit '.$toDisp;
|
|
||||||
$unit="secondes";
|
|
||||||
}
|
|
||||||
|
|
||||||
$result = $database->query($sql);
|
|
||||||
$a=$result->fetchArray();
|
|
||||||
|
|
||||||
if($a==false)
|
|
||||||
{
|
|
||||||
echo "<p class='texteG'>Vous avez le premier score de ce mode de jeu.</p>";
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
$phrase="1° ".$a["player"].", ".$a[0]." ".$unit;
|
|
||||||
$cpt=2;
|
|
||||||
while ($row = $result->fetchArray()) {
|
|
||||||
|
|
||||||
$phrase=$phrase."</br>".$cpt."° ".$row["player"].", ".$row["score"]." ".$unit;
|
|
||||||
//$phrase+=;
|
|
||||||
$cpt++;
|
|
||||||
}
|
|
||||||
|
|
||||||
echo "<h1 id='aya' class='texteG mode-container' >".$phrase."</h1>";
|
|
||||||
}
|
|
||||||
?>
|
|
||||||
</br>
|
|
||||||
<?php
|
|
||||||
if($_GET['pseudo']!="")
|
|
||||||
{
|
|
||||||
if(stristr($_GET['mode'], "p") === FALSE) // vérification du mode pour afficher le score le plus grand ou le plus petit (- de temps = + de score)
|
|
||||||
{ //il n'y a pas "p" dans le mode, donc on cherche le plus haut score
|
|
||||||
$sqlScore='select max(score) from score where game_mode="'.$_GET['mode'].'" and difficulty="'.$_GET['diff'].'" and dots_amount='.$_COOKIE["dotsAmount"].' and pause='.$_COOKIE["pause"].' and player="'.$_GET['pseudo'].'"';
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{ // on est en points, donc on cherche le temps le plus faible
|
|
||||||
$sqlScore='select min(score) from score where game_mode="'.$_GET['mode'].'" and difficulty="'.$_GET['diff'].'" and dots_amount='.$_COOKIE["dotsAmount"].' and pause='.$_COOKIE["pause"].' and player="'.$_GET['pseudo'].'"';
|
|
||||||
}
|
|
||||||
$result = $database->query($sqlScore); // on prend le meilleur score du joueur
|
|
||||||
$data = $result->fetchArray()[0];
|
|
||||||
|
|
||||||
if($data==null) // Le joueur n'a pas encore de score enregistré
|
|
||||||
{
|
|
||||||
$sql='select count(*) from game where game_mode="'.$_GET['mode'].'" and difficulty="'.$_GET['diff'].'" and dots_amount='.$_COOKIE["dotsAmount"].' and pause='.$_COOKIE["pause"];
|
|
||||||
$result = $database->query($sql);
|
|
||||||
|
|
||||||
if($result->fetchArray()[0]==0) // Si le mode de jeu 'nest pas déjà dans la base, on l'ajoute
|
|
||||||
{
|
|
||||||
$sql='insert into game values("'.$_GET['diff'].'","'.$_GET['mode'].'","---",'.$_COOKIE["dotsAmount"].','.$_COOKIE["pause"].')';
|
|
||||||
}
|
|
||||||
|
|
||||||
$sql='insert into score values("'.$_GET['pseudo'].'","'.$_GET['diff'].'","'.$_GET['mode'].'",'.$_COOKIE["dotsAmount"].','.$_COOKIE["pause"].',date("now"),'.$_GET['pts'].')';
|
|
||||||
$database->query($sql); // enregistrement du score du joueur
|
|
||||||
}
|
|
||||||
else // Le joueur a un score enregistré, vérification s'il dépasse son record
|
|
||||||
{
|
|
||||||
$result = $database->query($sqlScore)->fetchArray()[0];
|
|
||||||
//Si le joueur a un meilleur score (selon le critère du mode), mise à jour
|
|
||||||
if(($data<$_GET['pts'] && stristr($_GET['mode'], "p") === FALSE) || ($data>$_GET['pts'] && stristr($_GET['mode'], "p") !== FALSE))
|
|
||||||
{
|
|
||||||
$sql="update score set score=".$_GET['pts'].",date=date('now') where player='".$_GET['pseudo']."' and game_mode='".$_GET['mode']."' and difficulty='".$_GET['diff']."' and dots_amount=".$_COOKIE["dotsAmount"]." and pause=".$_COOKIE["pause"];
|
|
||||||
$database->query($sql);
|
|
||||||
|
|
||||||
$result=$data;
|
|
||||||
|
|
||||||
}
|
|
||||||
echo "<input type='hidden' id='rec' value='".$result."'/>";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
?>
|
|
||||||
<div class="mode-container">
|
|
||||||
<a href="./" rel="external"><img id="btn_index" src="ress/button_index.png" class="back" /></a>
|
|
||||||
<img id="btn_replay" src="ress/button_replay.png" class="back" onClick="play()"/>
|
|
||||||
</div>
|
|
||||||
<script>
|
|
||||||
size=screen.height/6;
|
|
||||||
phrase=get['pseudo']+", votre "+(get['mode'].includes('p') ? "temps" : "score") +" est "+ get['pts'] +" "+(get['mode'].includes('p') ? "secondes" : "points");
|
|
||||||
if(document.getElementById("rec")!=null)
|
|
||||||
{
|
|
||||||
phrase+= (document.getElementById("rec").value==get['pts'] ? " et c'est votre record" : " et votre record est "+ document.getElementById("rec").value +" "+(get['mode'].includes('p') ? "secondes" : "points"));
|
|
||||||
}
|
|
||||||
document.getElementById("points").innerHTML = phrase;
|
|
||||||
document.getElementById("btn_index").width=size;
|
|
||||||
document.getElementById("btn_replay").width=size;
|
|
||||||
|
|
||||||
function play()
|
|
||||||
{
|
|
||||||
var pseudo = prompt("Saisissez votre pseudo", getCookie("pseudo"));
|
|
||||||
//setCookie("pause",(document.getElementById("pause_1").checked ? "1" : "0"),30);
|
|
||||||
if(pseudo!="")
|
|
||||||
{
|
|
||||||
setCookie("pseudo",pseudo,30);
|
|
||||||
}
|
|
||||||
|
|
||||||
window.location.replace("./game.html?mode="+get['mode']+"&diff="+get['diff']+"&pseudo="+ (pseudo==null ? "" : pseudo));
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script src="bakery.js"></script>
|
|
||||||
<script src="themeSwitcher.js"></script>
|
|
||||||
<script src="infoDisplayer.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -1,59 +0,0 @@
|
|||||||
var light= (getCookie("light")=="" ? true : getCookie("light"));
|
|
||||||
selectedTheme = "selected"+(light=="true" ? "Day" : "Night");
|
|
||||||
|
|
||||||
document.getElementById("light").width=size/4;
|
|
||||||
|
|
||||||
if(document.getElementById("logo")!=null)
|
|
||||||
{
|
|
||||||
document.getElementById("logo").width=size*2;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function switchLight() {
|
|
||||||
light=(light=="true" ? "false" : "true");
|
|
||||||
setCookie("light",light,30);
|
|
||||||
applyLight(light);
|
|
||||||
}
|
|
||||||
|
|
||||||
function applyLight(li) {
|
|
||||||
document.getElementById("light").src="ress/"+(li=="true" ? "dark" : "light")+".png";
|
|
||||||
if(document.getElementById("logo")!=null)
|
|
||||||
{
|
|
||||||
document.getElementById("logo").src="ress/logo_"+(li=="true" ? "clair" : "dark")+".png";
|
|
||||||
}
|
|
||||||
|
|
||||||
listeModals=document.getElementsByClassName("modal-content");
|
|
||||||
if(listeModals[0]!=null)
|
|
||||||
{
|
|
||||||
for(cpt=0;cpt<listeModals.length;cpt++)
|
|
||||||
{
|
|
||||||
listeModals[cpt].classList.add((li=="true" ? "day" : "night"));
|
|
||||||
listeModals[cpt].classList.remove((li=="true" ? "night" : "day"));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if(document.getElementById("resetGems")!=null)
|
|
||||||
{
|
|
||||||
document.getElementById("resetGems").src="ress/reset_"+(li=="true" ? "light" : "dark")+".png";
|
|
||||||
}
|
|
||||||
|
|
||||||
document.getElementsByTagName("body")[0].classList.add((li=="true" ? "day" : "night"));
|
|
||||||
document.getElementsByTagName("body")[0].classList.remove((li=="true" ? "night" : "day"));
|
|
||||||
|
|
||||||
var all = document.getElementsByClassName('selected'+(li!="true" ? "Day" : "Night"));
|
|
||||||
var ids=[];
|
|
||||||
for (var cpt = 0; cpt < all.length; cpt++)
|
|
||||||
{
|
|
||||||
ids.push(all[cpt].id);
|
|
||||||
}
|
|
||||||
|
|
||||||
selectedTheme = "selected"+(li=="true" ? "Day" : "Night");
|
|
||||||
|
|
||||||
for (var cpt = 0; cpt < ids.length; cpt++) {
|
|
||||||
var el=document.getElementById(ids[cpt]);
|
|
||||||
el.classList.remove('selected'+(li!="true" ? "Day" : "Night"));
|
|
||||||
el.classList.add('selected'+(li=="true" ? "Day" : "Night"));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
applyLight(light);
|
|
@ -1,66 +1,32 @@
|
|||||||
|
var fin = new Date();
|
||||||
|
fin.setMinutes(fin.getMinutes()+tpsRem[1]);
|
||||||
|
document.getElementById("timer").innerHTML = tpsRem[0] + ":" + tpsRem[1] + ":" + tpsRem[2];
|
||||||
|
|
||||||
//---------------
|
// Update the count down every 1 second
|
||||||
var time_in_minutes = tpsRem[1];
|
var x = setInterval(function() {
|
||||||
var current_time = Date.parse(new Date());
|
|
||||||
var deadline = new Date(current_time + time_in_minutes*60*1000);
|
|
||||||
|
|
||||||
|
// Get today's date and time
|
||||||
|
var now = new Date().getTime();;
|
||||||
|
|
||||||
function time_remaining(endtime){
|
|
||||||
var t = Date.parse(endtime) - Date.parse(new Date());
|
|
||||||
var seconds = Math.floor( (t/1000) % 60 );
|
|
||||||
var minutes = Math.floor( (t/1000/60) % 60 );
|
|
||||||
var hours = Math.floor( (t/(1000*60*60)) % 24 );
|
|
||||||
var days = Math.floor( t/(1000*60*60*24) );
|
|
||||||
return {'total':t, 'days':days, 'hours':hours, 'minutes':minutes, 'seconds':seconds};
|
|
||||||
}
|
|
||||||
|
|
||||||
var timeinterval;
|
// Find the distance between now and the count down date
|
||||||
function run_clock(id,endtime){
|
var distance = fin - now;
|
||||||
var clock = document.getElementById(id);
|
|
||||||
function update_clock(){
|
|
||||||
var t = time_remaining(endtime);
|
|
||||||
clock.innerHTML = t.hours + ":" + t.minutes + ":" + t.seconds;
|
|
||||||
if(t.total<=0)
|
|
||||||
{
|
|
||||||
clearInterval(timeinterval);
|
|
||||||
window.location.replace("./score.php?pts="+points+"&mode="+get['mode']+"&diff="+get['diff']+"&pseudo="+get['pseudo']);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
update_clock(); // run function once at first to avoid delay
|
|
||||||
timeinterval = setInterval(update_clock,1000);
|
|
||||||
}
|
|
||||||
run_clock('timer',deadline);
|
|
||||||
|
|
||||||
|
// Time calculations for days, hours, minutes and seconds
|
||||||
|
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
||||||
|
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
|
||||||
|
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
|
||||||
|
|
||||||
var pausedC = false; // is the clock paused?
|
document.getElementById("timer").innerHTML = hours + ":" + minutes + ":" + seconds;
|
||||||
var time_left; // time left on the clock when paused
|
|
||||||
|
|
||||||
function pause_clock(){
|
// If the count down is over, write some text
|
||||||
if(!pausedC){
|
if (distance < 0) {
|
||||||
pausedC = true;
|
clearInterval(x);
|
||||||
clearInterval(timeinterval); // stop the clock
|
window.location.replace("./score.html?pts="+points);
|
||||||
time_left = time_remaining(deadline).total; // preserve remaining time
|
|
||||||
}
|
}
|
||||||
}
|
}, 1000);
|
||||||
|
|
||||||
function resume_clock(){
|
|
||||||
if(pausedC){
|
|
||||||
pausedC = false;
|
|
||||||
|
|
||||||
// update the deadline to preserve the amount of time remaining
|
function addTime(secs)
|
||||||
console.log("tl"+time_left);
|
|
||||||
deadline = new Date(Date.parse(new Date()) + time_left);
|
|
||||||
console.log("dl"+deadline);
|
|
||||||
|
|
||||||
// start the clock
|
|
||||||
run_clock('timer',deadline);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function addTime(sec)
|
|
||||||
{
|
{
|
||||||
console.log(deadline);
|
fin.setSeconds(fin.getSeconds()+secs);
|
||||||
deadline.setSeconds(deadline.getSeconds() + sec);
|
|
||||||
|
|
||||||
console.log(deadline);
|
|
||||||
}
|
}
|
@ -1,63 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
|
|
||||||
<head>
|
|
||||||
<title>On The Dot</title>
|
|
||||||
<link rel="stylesheet" type="text/css" href="game.css"/>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<p class="txt">Faites tourner le vitrail vers la droite pour qu'il corresponde à l'objectif</p>
|
|
||||||
<ul id="all-container" class="all-container">
|
|
||||||
<ul class="stats">
|
|
||||||
|
|
||||||
<p id="temps"></p>
|
|
||||||
<span id="chronotime" class="stats">0:00:00</span>
|
|
||||||
<span id="timer" class="stats">0:00:00</span>
|
|
||||||
<p id="stats" class="stats"></p>
|
|
||||||
|
|
||||||
<h1>Objectif</h1>
|
|
||||||
|
|
||||||
<h1>Résultat</h1>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul id="obj-container" class="vitraux">
|
|
||||||
<canvas id="canvasObj" class="vitrail-plein"></canvas>
|
|
||||||
<canvas id="canvasTotal" class="vitrail-plein"></canvas>
|
|
||||||
</ul>
|
|
||||||
<ul id="vitraux" class="vitraux">
|
|
||||||
<canvas id="canvas1" class="vitrail-plein"></canvas>
|
|
||||||
|
|
||||||
<canvas id="canvas2" class="vitrail-plein"></canvas>
|
|
||||||
|
|
||||||
<canvas id="canvas3" class="vitrail-plein"></canvas>
|
|
||||||
|
|
||||||
<canvas id="canvas4" class="vitrail-plein"></canvas>
|
|
||||||
</ul>
|
|
||||||
<ul id="canvasR" class="flex-container">
|
|
||||||
<div id="reserveText">
|
|
||||||
<h1>Réserve</h1>
|
|
||||||
</div>
|
|
||||||
<canvas id="canvasR1" class="vitrail-vide"></canvas>
|
|
||||||
<canvas id="canvasR2" class="vitrail-vide"></canvas>
|
|
||||||
<canvas id="canvasR3" class="vitrail-vide"></canvas>
|
|
||||||
<canvas id="canvasR4" class="vitrail-vide"></canvas>
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<p id="tuto1" class="txt">Pour faire tourner le vitrail vers la droite, cliquez dans le triangle bleu, puis relâchez le clic dans le triangle vert.</p>
|
|
||||||
<p id="tuto2" class="txt">Pour faire tourner le vitrail vers la gauche, cliquez dans le triangle bleu, puis relâchez le clic dans le triangle vert.</p>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<script>var tutoMode=true;</script>
|
|
||||||
<script src="selecteur.js"></script>
|
|
||||||
<script src="bakery.js"></script>
|
|
||||||
<script src="chrono.js"></script>
|
|
||||||
<script src="timer.js"></script>
|
|
||||||
<script src="vitraux.js"></script>
|
|
||||||
<script src="tutorial.js"></script>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
</html>
|
|
@ -1,55 +0,0 @@
|
|||||||
function handleTuto()
|
|
||||||
{
|
|
||||||
console.log("tuto");
|
|
||||||
points++;
|
|
||||||
if(points==0)
|
|
||||||
{
|
|
||||||
tab1=[true,[-3,-3,"brown_1"],[-3,-2,"cyan_2"]];
|
|
||||||
tab2[0]=false;
|
|
||||||
tab3[0]=false;
|
|
||||||
tab4[0]=false;
|
|
||||||
document.getElementById("canvas2").style.display="none";
|
|
||||||
document.getElementById("canvas3").style.display="none";
|
|
||||||
document.getElementById("canvas4").style.display="none";
|
|
||||||
console.log("1");
|
|
||||||
tabObj=[copyMDArray(tab1)];
|
|
||||||
empiler(true);
|
|
||||||
console.log(tabObj);
|
|
||||||
tourneD(tabObj,canvasO,ctxO,0);
|
|
||||||
empiler(true);
|
|
||||||
toutDessiner(tab1,canvas1,ctx1);
|
|
||||||
toutDessiner(tabObjCmp,canvasO,ctxO);
|
|
||||||
faireLignes(ctx1);
|
|
||||||
faireTriangle(ctx1,"H","#0000FF50");
|
|
||||||
faireTriangle(ctx1,"D","#00FF0050");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function faireLignes(ctx)
|
|
||||||
{
|
|
||||||
ctx.beginPath();
|
|
||||||
ctx.moveTo(0, 0);
|
|
||||||
ctx.lineTo(size, size);
|
|
||||||
ctx.stroke();
|
|
||||||
ctx.beginPath();
|
|
||||||
ctx.moveTo(0, size);
|
|
||||||
ctx.lineTo(size, 0);
|
|
||||||
ctx.stroke();
|
|
||||||
}
|
|
||||||
|
|
||||||
function faireTriangle(ctx,dir,color)
|
|
||||||
{
|
|
||||||
var a = (dir=="H" || dir=="G" ? 0 : size);
|
|
||||||
var b = (dir=="H" || dir=="D" ? size : 0);
|
|
||||||
var c = (dir=="H" || dir=="D" ? 0 : size);
|
|
||||||
|
|
||||||
ctx.beginPath();
|
|
||||||
ctx.moveTo(a,a);
|
|
||||||
ctx.lineTo(size/2,size/2);
|
|
||||||
ctx.lineTo(b,c);
|
|
||||||
ctx.lineTo(a,a);
|
|
||||||
ctx.fillStyle = color;
|
|
||||||
ctx.fill();
|
|
||||||
}
|
|
||||||
|
|
||||||
handleTuto();
|
|