Browse Source

ttesg

master
alexandre.aboulin 3 years ago
parent
commit
dc988e2bfa
  1. 20
      app.js
  2. 5
      index.html
  3. 18
      master.css

20
app.js

@ -19,18 +19,6 @@ function nbAlea(){
// Anime les rouleaux
function rotate(rouleau, angle){
<<<<<<< HEAD
let i = 0;
let interval = setInterval(() => {
if (i >= angle){
clearInterval(interval);
}
else {
i += 9;
rouleau.style.transform = 'rotate3d(1,0,0,'+i+'deg)';
}
}, 5);
=======
return new Promise((resolve, reject) => {
let i = 0;
let interval = setInterval(() => {
@ -45,7 +33,6 @@ function rotate(rouleau, angle){
}
}, 5);
})
>>>>>>> ed8a1808293ee88f1efde28836b84c43b34781eb
}
@ -69,18 +56,11 @@ function tirette(){
async function tirage(){
let numbers = [nbAlea(), nbAlea(), nbAlea()]
<<<<<<< HEAD
console.log(numbers);
rotate(document.getElementsByClassName("cube")[0], Math.floor(Math.random()*(15-1)+1)*360 - numbers[0]*36);
rotate(document.getElementsByClassName("cube")[1], Math.floor(Math.random()*(15-1)+1)*360 - numbers[1]*36);
rotate(document.getElementsByClassName("cube")[2], Math.floor(Math.random()*(15-1)+1)*360 - numbers[2]*36);
=======
await Promise.all([
rotate(document.getElementsByClassName("cube")[0], (Math.floor(Math.random()*15)*360) - (numbers[0]*36)),
rotate(document.getElementsByClassName("cube")[1], (Math.floor(Math.random()*15)*360) - (numbers[1]*36)),
rotate(document.getElementsByClassName("cube")[2], (Math.floor(Math.random()*15)*360) - (numbers[2]*36))
])
>>>>>>> ed8a1808293ee88f1efde28836b84c43b34781eb
return numbers
}

5
index.html

@ -8,7 +8,6 @@
<body>
<img src="tirette.png" alt="tirette" id="tirette" onclick="jeu()">
<img src="machine.png" id="tirage">
<div id="rouleau_1" class="rouleau">
<div class="cube">
<div class="cube__face cube__face--0">0</div>
@ -60,8 +59,8 @@
<p>Banque : <span id="banque_score">1000</span></p>
<p>Vous : <span id="joueur_score"></span></p>
<div class="regles">
<div class="regles-container">
<div class="overlay">
<div class="overlay-container">
Règles
</div>
</div>

18
master.css

@ -70,3 +70,21 @@ body{
box-shadow: 0px 0px 37px black;
}
.overlay{
background-color: black;
opacity: 0.5;
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
}
.overlay-container{
background-color: white;
width: 40vw;
height: 20vh;
}
Loading…
Cancel
Save