parent
c96a8c26b7
commit
414be83fe5
@ -0,0 +1,63 @@
|
|||||||
|
<!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>
|
@ -0,0 +1,55 @@
|
|||||||
|
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();
|
Loading…
Reference in new issue