pascal.lafourcade
/
onthedots
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Affichage plus espacé, amélioration de la réserve

Browse Source
affichage-v2
adplantade 5 years ago
parent d6340c4190
commit 31cf1efc1d
2 changed files with 69 additions and 29 deletions
Show Stats Download Patch File Download Diff File

4
code/index.css
Unescape View File

@ -1,6 +1,8 @@
.all-container { .all-container {
display : flex; /* display : flex;
justify-content: space-between;
/*
align-items: baseline; align-items: baseline;
width : min-content; width : min-content;
flex-direction: row; flex-direction: row;

94
code/index.html
Unescape View File

@ -7,6 +7,13 @@
</head> </head>
<body> <body>
<ul id="all-container" class="all-container" style="border:2px solid orangered"> <ul id="all-container" class="all-container" style="border:2px solid orangered">
<ul id="obj-container" class="obj-container" style="border:2px solid yellow">
<h1>Résultat</h1>
<canvas id="canvasTotal" style="border:1px solid #000"></canvas>
<h1>Objectif</h1>
<canvas id="canvasObj" style="border:1px solid green"></canvas>
<button onclick="generateEasy()">gen easy</button>
</ul>
<ul id="vitraux" class="vitraux" style="border:2px solid purple"> <ul id="vitraux" class="vitraux" style="border:2px solid purple">
<canvas id="canvas1" class="vitrail" style="border:1px solid #000"></canvas> <canvas id="canvas1" class="vitrail" style="border:1px solid #000"></canvas>
@ -17,17 +24,14 @@
<canvas id="canvas4" class="vitrail" style="border:1px solid #000"></canvas> <canvas id="canvas4" class="vitrail" style="border:1px solid #000"></canvas>
</ul> </ul>
<canvas id="canvasTotal" style="border:1px solid #000"></canvas>
<h1>Objectif</h1>
<canvas id="canvasObj" style="border:1px solid green"></canvas>
<button onclick="generateEasy()">gen easy</button>
<ul id="canvasR" class="flex-container" style="border:1px solid violet"> <ul id="canvasR" class="flex-container" style="border:1px solid violet">
<h1>Réserve</h1>
<canvas id="canvasR1" class="flex-item" width="150" height="150" style="border:1px solid red"></canvas> <canvas id="canvasR1" class="flex-item" width="150" height="150" style="border:1px solid red"></canvas>
<canvas id="canvasR2" class="flex-item" width="150" height="150" style="border:1px solid blue"></canvas> <canvas id="canvasR2" class="flex-item" width="150" height="150" style="border:1px solid blue"></canvas>
<canvas id="canvasR3" class="flex-item" style="border:1px solid violet"></canvas> <canvas id="canvasR3" class="flex-item" style="border:1px solid violet"></canvas>
<canvas id="canvasR4" class="flex-item" style="border:1px solid violet"></canvas> <canvas id="canvasR4" class="flex-item" style="border:1px solid violet"></canvas>
</ul> </ul>
</ul> </ul>
<script> <script>
var canvas1 = document.getElementById('canvas1'); var canvas1 = document.getElementById('canvas1');
@ -295,42 +299,67 @@
if(!ne && !se ) return "O"; if(!ne && !se ) return "O";
} }
/*
6 cas : v1 vis->v1 vis
*/
function rotationManager(e) function rotationManager(e)
{ {
canvasNumber=e.currentTarget.id.substring(6); canvasNumber=e.currentTarget.id.substring(6);
if(canvasNumber=="R") if(mousePos[0]=="R" && canvasNumber!="R")
{ {
toggleVisible(mousePos[0]); if(!isVisible(canvasNumber))
{
toggleVisible(canvasNumber);
}
} }
else else
{ {
lecanvas=eval("canvas"+canvasNumber); if(isVisible(mousePos[0]))
letab=eval("tab"+canvasNumber);
lectx=lecanvas.getContext('2d');
dir = compas(e.clientX,e.clientY,e.currentTarget);
if(mousePos[0]==canvasNumber)
{ {
if((mousePos[1]=="N" && dir == "O") || (mousePos[1]=="S" && dir == "E") || (mousePos[1]=="O" && dir == "S") || (mousePos[1]=="E" && dir == "N")) if(canvasNumber=="R")
{
tourneG(letab,lecanvas,lectx);
}
else if((mousePos[1] == "N" && dir == "E") || (mousePos[1] == "S" && dir == "O") || (mousePos[1] == "E" && dir == "S") || (mousePos[1] == "O" && dir == "N"))
{
tourneD(letab,lecanvas,lectx);
}
else if ((mousePos[1] == "E" && dir == "O") || (mousePos[1] == "O" && dir == "E"))
{ {
swap(letab,lecanvas,lectx,"V"); /*
eval("tab"+mousePos[0]+"[0]=!tab"+mousePos[0]+"[0];");
empiler();
toutDessiner(eval("tab"+mousePos[0]),eval("canvas"+mousePos[0]),eval("ctx"+mousePos[0]));
toutDessiner(tabTotal,canvasT,ctxT);
*/
toggleVisible(mousePos[0]);
tabR.push(eval("tab"+mousePos[0]));
} }
else if ((mousePos[1] == "N" && dir == "S") || (mousePos[1] == "S" && dir == "N")) else
{ {
swap(letab,lecanvas,lectx,"H"); lecanvas=eval("canvas"+canvasNumber);
letab=eval("tab"+canvasNumber);
lectx=lecanvas.getContext('2d');
dir = compas(e.clientX,e.clientY,e.currentTarget);
if(mousePos[0]==canvasNumber)
{
if((mousePos[1]=="N" && dir == "O") || (mousePos[1]=="S" && dir == "E") || (mousePos[1]=="O" && dir == "S") || (mousePos[1]=="E" && dir == "N"))
{
tourneG(letab,lecanvas,lectx);
}
else if((mousePos[1] == "N" && dir == "E") || (mousePos[1] == "S" && dir == "O") || (mousePos[1] == "E" && dir == "S") || (mousePos[1] == "O" && dir == "N"))
{
tourneD(letab,lecanvas,lectx);
}
else if ((mousePos[1] == "E" && dir == "O") || (mousePos[1] == "O" && dir == "E"))
{
swap(letab,lecanvas,lectx,"V");
}
else if ((mousePos[1] == "N" && dir == "S") || (mousePos[1] == "S" && dir == "N"))
{
swap(letab,lecanvas,lectx,"H");
}
}
else
{
changeOrder(mousePos[0],canvasNumber);
}
} }
} }
else
{
changeOrder(mousePos[0],canvasNumber);
}
} }
} }
@ -373,6 +402,11 @@
} }
function isVisible(what)
{
return eval("tab"+what+"[0]");
}
function toggleVisible(where) function toggleVisible(where)
{ {
eval("tab"+where+"[0]=!tab"+where+"[0];"); eval("tab"+where+"[0]=!tab"+where+"[0];");
@ -414,6 +448,10 @@
rotationManager(e); rotationManager(e);
}) })
canvasR.addEventListener("mousedown",function(e){
mousePos = [e.currentTarget.id.substring(6),compas(e.clientX,e.clientY,e.currentTarget)];
})
canvasR.addEventListener("mouseup",function(e){ canvasR.addEventListener("mouseup",function(e){
rotationManager(e); rotationManager(e);
}) })

Write Preview
Loading…
Cancel
Save