From 16c10f0e56c6cfce6293e520fab980579f055c8f Mon Sep 17 00:00:00 2001 From: "michel.wang" Date: Mon, 11 Apr 2022 08:43:25 +0200 Subject: [PATCH] first commit --- app.js | 148 ++++++++++++++------------- index.html | 38 ++----- logo.png | Bin 0 -> 14628 bytes machine.docx | Bin 0 -> 7116 bytes machine.html | 49 +++++++++ stylepagecss/menu.css | 227 ++++++++++++++--------------------------- stylepagecss/style.css | 40 ++++++++ 7 files changed, 255 insertions(+), 247 deletions(-) create mode 100644 logo.png create mode 100644 machine.docx create mode 100644 machine.html create mode 100644 stylepagecss/style.css diff --git a/app.js b/app.js index ac375fa..9e36693 100644 --- a/app.js +++ b/app.js @@ -1,72 +1,80 @@ -/* Groupe d'Alexandre ABOULIN, Michel WANG et Sacha SERNY -import random - -var rules = """Vous allez insérer le nombre de jeton que vous possédez -Vous allez insérer un certain nombre de jeton entre 0 et 100 afin de pouvoir jouer -Voici les règle du jeu : -- 3 chiffres seront tirés aléatoirements entre 0 et 9; -- si vous tirez deux chiffres identiques vous obtenez 3 fois votre mise; -- si vous arrivez à tirer 3 chiffres identiques, différents du chiffre 9, alors vous recevrez 6 fois la mise que vous avez saisie au début; -- [JACKPOT] dans le cas où vous êtes chanceux et que vous arrivez à tirer trois fois le chiffre '9', alors vous recevrez tous les jetons du bac; -- mais dans le cas contraire, si vous avez obtenu 3 chiffres, tous différents les un des autres, alors vous ne recevrez rien et vous aurez perdu votre mise; -Dans tous les cas sauf le jackpot, le joueur perd sa mise -Bien évidemment, pour ne pas vous anarquer, si le bac possède moin de 500 jetons, alors le jeu s'arrêtera -Et puis il faut également pas oublier que si vous n'avez plus de jeton, alors vous ne pourrez plus jouer""" -*/ - +/* Groupe de Michel WANG et Sacha SERNY +HTML et CSS : Michel WANG +Javascript : Sacha SERNY*/ function nbAlea() { - return Math.floor(Math.random() * 10); -} -function gain(tirage) { - player_coins = player_coins - mise - machine_coins = machine_coins + mise - if (tirage == [9, 9, 9]) { - player_coins = player_coins + machine_coins - machine_coins = 0 - console.log("BINGO") - } else if (tirage[0] == tirage[1] && tirage[1] == tirage[2]) { - player_coins = player_coins + 6 * mise - machine_coins = machine_coins - 6 * mise - console.log("3*") - } else if (tirage[0] == tirage[1] || tirage[1] == tirage[2] || tirage[0] == tirage[2]) { - player_coins = player_coins + 2 * mise - machine_coins = machine_coins - 2 * mise - console.log("2*") - } else { - console.log("Perdu") - } -} -function update_stats() { - document.getElementById('machine_coins').innerText = machine_coins - document.getElementById('player_coins').innerText = player_coins -} - -function regle() { - btn.appendChild(button_1); - document.body.appendChild(button); -} -// Init -var rouleaux = document.querySelectorAll(".rouleaux #board") -rouleaux.forEach(rouleau => { - rouleau.innerText = 0 -}); -var mise = 0 -var machine_coins = 1000 -var player_coins = 100 -document.getElementById("valider").addEventListener("click", jeu); -// jeu -function jeu() { - mise = parseInt((document.getElementById('mise').value), 10) - console.log(mise) - if (player_coins >= mise && machine_coins > mise * 3) { - var tirage = [nbAlea(), nbAlea(), nbAlea()] - for (let i = 0; i < 3; i++) { - rouleaux[i].innerText = tirage[i]; - - } - console.log(tirage) - gain(tirage) - update_stats() - } -} + /* renvoie un entier entre 0 et 9 */ + return Math.floor(Math.random() * 10); + } + + function gain(tirage) { + /* calcule les gains et génére les messages liés */ + let phrase = "" + player_coins = player_coins - mise + machine_coins = machine_coins + mise + if (tirage == [9, 9, 9]) { + player_coins = player_coins + machine_coins + machine_coins = 0 + phrase = "Bingo ! Vous avez gagné tous les jetons. \n " + } else if (tirage[0] == tirage[1] && tirage[1] == tirage[2]) { + player_coins = player_coins + 6 * mise + machine_coins = machine_coins - 6 * mise + phrase = "Bingo ! Vous avez triplé votre mise. \nVous avez gagné " + mise*6 + " jetons." + } else if (tirage[0] == tirage[1] || tirage[1] == tirage[2] || tirage[0] == tirage[2]) { + player_coins = player_coins + 3 * mise + machine_coins = machine_coins - 3 * mise + phrase = "Bingo ! Vous avez doublé votre mise. \nVous avez gagné " + mise*3 + " jetons." + } else { + phrase = "Vous avez perdu vos " + mise + " jetons. \n " + } + // console.log(phrase); + document.getElementById('gain').innerText = phrase + } + + function update_stats() { + /* affiche les données de la partie dans la page HTML */ + document.getElementById('machine_coins').innerText = machine_coins + document.getElementById('player_coins').innerText = player_coins + } + + function regles() { + /* affiche les regles dans la page HTML */ + // console.log(toggle_rules); + let rules = document.getElementById('show_rules') + if (toggle_rules == true) { + rules.style.display = "none" + } else { + rules.style.display = "block" + } + toggle_rules = !toggle_rules + } + + + // Initialisation de la page et des variables + document.getElementById("show_rules").addEventListener("click", regles) + var rouleaux = document.querySelectorAll(".rouleaux div") + // console.log(rouleaux); + rouleaux.forEach(rouleau => { + rouleau.innerText = 0 + }); + var mise = 1 + var machine_coins = 1000 + var player_coins = 100 + var toggle_rules = false + update_stats() + + // Fonction principale du jeu + function jeu() { + /* appelle les fonctiosn nécessaires au fonctionnement du jeu */ + mise = parseInt((document.getElementById('mise').value), 10) + // console.log(mise) + if (player_coins >= mise && machine_coins >= 500 && mise > 0) { + var tirage = [nbAlea(), nbAlea(), nbAlea()] + for (let i = 0; i < 3; i++) { + rouleaux[i].innerText = tirage[i]; + } + // console.log(tirage) + gain(tirage) + update_stats() + } + } \ No newline at end of file diff --git a/index.html b/index.html index c7442b6..7ea62f3 100644 --- a/index.html +++ b/index.html @@ -1,30 +1,12 @@ - - - - - - Document - - - -

MACHINE A SOUS NSI

-
-
-

NaN

-

NaN

-

NaN

-
- - -
- -
Jetons dans la machine :
- -
Jetons du joueur :
- - - - - \ No newline at end of file + + M A C H I N E + + + + + + + + diff --git a/logo.png b/logo.png new file mode 100644 index 0000000000000000000000000000000000000000..3f3c2142126453678ba1e40f0b9248adce77683b GIT binary patch literal 14628 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 l?w+sP1pdovZie_j(pgy^ + + + + + + Machine à sous NSI + + + + + + + + +
+
+
+
+
+
+
+
+ + +
+
+

machine coins :

+

player coins :

+ +

+
+
+

qsdsqddqdsqdsqqsdsqsqdqsdsqsqdqssqds

+
+ + + + diff --git a/stylepagecss/menu.css b/stylepagecss/menu.css index 99729bb..3b28bb6 100644 --- a/stylepagecss/menu.css +++ b/stylepagecss/menu.css @@ -1,44 +1,57 @@ -body { +* { margin: 0; padding: 0; - background-color: black; - font: 5rem; - width: 1; - height: 1.4; - padding: 2.5rem; - font-size: 100% } -.title { +body { display: flex; + align-items: center; justify-content: center; + flex-direction: column; + min-height: 100vh; + background: rgb(18,79,96); + background: -moz-linear-gradient(180deg, rgba(18,79,96,1) 0%, rgba(84,33,163,1) 100%); + background: -webkit-linear-gradient(180deg, rgba(18,79,96,1) 0%, rgba(84,33,163,1) 100%); + background: linear-gradient(180deg, rgba(18,79,96,1) 0%, rgba(84,33,163,1) 100%); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#124f60",endColorstr="#5421a3",GradientType=1); + padding: 2.5rem; + color: white; + overflow: hidden; +} + +/* cadre qui entoure le rouleaux*/ +.cadre_rouleaux { + display: flex; align-items: center; + flex-direction: column; } -.title1 p{ +/* Affichage numéros */ +.rouleaux { position: relative; - font-family: Georgia, serif; - font-size: 45px; - white-space: nowrap; - font-weight: lighter; + display: flex; + justify-content: space-around; + width: 14rem; + height: 6.9rem; overflow: hidden; - list-style-type: none; - color: white; - animation: ecriture 3s steps(19); -} - -@keyframes ecriture { - from {width: 0%} - to {width: 100%;} + background-color: linear-gradient(to right, #fc5c7d, #6a82fb); + box-shadow: inset 0 2px 20px 5px #000, 0 2px 20px 1px rgba(255, 255, 255, 0.4); + border-radius: 10px; + text-align: center; + color: #fff; + text-shadow: -2px -2px 0 #aaa; + font: 5rem/1.4 monaco, monospace; } +/* Boutons */ .button { + margin-top: 50px; display: flex; justify-content: center; align-items: center; } -button.btn { +.button button { display: inline-block; background: transparent; color: white; @@ -53,142 +66,58 @@ button.btn { transition: all 0.7s; } -button.btn_1:hover { +button:hover { background-color: white; color: black; transition: all 0.7s; } - -button.btn_2:hover { - color: black; - background-color: white; -} - -#machine_coins { - color: white; -} - -#player_coins { - color: white; -} -#jeton { - margin-top: 100px; - color: white; - padding: 10px; -} - -.container { - position: fixed; +/* affichage des "coin player et machine" */ +.option { + position: absolute; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; top: 50%; - left: 50%; - margin-top: -6rem; - margin-left: -10rem; - padding: 2.5rem; - border-radius: 10px; - background: linear-gradient(to bottom, #666, #444); - box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4); + right: 3%; + transform: translateY(-50%); + color: white; } -.container:before { - content: ""; +/* titre qui renvoie à la page index.html */ +.title { position: absolute; - top: 17%; - left: 10%; - height: 66%; - width: 80%; - border-radius: 10px; - box-shadow: 0 0 5px rgba(0, 0, 0, 0.1), 0 -1px 0 1px rgba(255, 255, 255, 0.1); - background: linear-gradient(to bottom, #444, #666); -} - -.wrapper { - position: relative; display: flex; - width: 15rem; - height: 7rem; - overflow: hidden; - background: #333; - box-shadow: inset 0 0px 8px #000, 0 1px 0px 1px rgba(255, 255, 255, 0.4); - border-radius: 10px; - text-align: center; + justify-content: space-between; + align-items: center; + padding: 20px 20px; + top: 2%; + left: 2%; color: #fff; - text-shadow: -2px -2px 0 #aaa; - font: 5rem/1.4 monaco, monospace; -} - -.board { - flex-grow: 1; -} - -.checkbox { - display: none; -} - -.checkbox ~ .wrapper > .board { - animation-play-state: paused !important; -} - -.checkbox ~ .wrapper > .board.item1 { - animation: shuffle 1.3s steps(10); -} - -.checkbox ~ .wrapper > .board.item2 { - animation: shuffle 1.1s steps(10); -} - -.checkbox ~ .wrapper > .board.item3 { - animation: shuffle 0.9s steps(10); -} - -.checkbox:checked ~ .handle:before { - transform: rotateX(180deg); -} - -.checkbox:checked ~ .handle:after { - transform: translateY(140px); -} - -.checkbox:checked ~ .wrapper > .board { - animation-play-state: running !important; -} - -.handle { - position: absolute; - right: 0; - top: 50%; -} - -.handle:before { - content: ""; - position: absolute; - bottom: 0; - width: 20px; - height: 60px; - background: linear-gradient(to right, #bbb 0%, #eee 30%, #bbb 100%); - border-radius: 0 0 10px 0; - transform-origin: bottom center; - transition: transform 0.2s ease; -} - -.handle:after { - content: ""; - position: absolute; - bottom: 55px; - left: -5px; - width: 30px; - height: 30px; - border-radius: 50%; - background: radial-gradient(circle farthest-corner at 25% 25% LightSalmon 0%, tomato 100%); - transform-origin: bottom center; - transition: transform 0.2s ease; -} - -@keyframes shuffle { - 0% { - transform: translate3d(0, 0, 0); - } - 100% { - transform: translate3d(0, -70rem, 0); - } + text-decoration: none; + text-transform: uppercase; + font-size: 2em; + letter-spacing: 1px; + transition: 2s; + z-index: 9998; +} + +/* affiche les règles*/ +#show_rules { + position: relative; + display: none; + position: absolute; + left: 20%; + right: 20%; + top: 5%; + bottom: 20%; + z-index: 1; + background-color: #fff; + box-shadow: 5px 5px 500px 500px #000; +} + +#show_rules > p { + padding: 10px; + color: black; } \ No newline at end of file diff --git a/stylepagecss/style.css b/stylepagecss/style.css new file mode 100644 index 0000000..35dcb99 --- /dev/null +++ b/stylepagecss/style.css @@ -0,0 +1,40 @@ +* { + margin: 0; + padding: 0; +} + +/* le fond avec un gradient*/ +body { + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + min-height: 100vh; + background: rgb(18,79,96); + background: -moz-linear-gradient(180deg, rgba(18,79,96,1) 0%, rgba(84,33,163,1) 100%); + background: -webkit-linear-gradient(180deg, rgba(18,79,96,1) 0%, rgba(84,33,163,1) 100%); + background: linear-gradient(180deg, rgba(18,79,96,1) 0%, rgba(84,33,163,1) 100%); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#124f60",endColorstr="#5421a3",GradientType=1); +} + +/* lien "machine à sous NSI" qui nous mène vers la page avec l'interface graphique de la machine à sous*/ +a { + font-family: arial; + position: relative; + text-transform: uppercase; + text-align: center; + text-decoration: none; + font-size: 7.5em; + width: 100%; + color:white; + text-shadow: 20px 10px 25px #000000; + letter-spacing: 19.8px; + transition: 3s; +} + +/* petit effet sur le lien*/ +a:hover { + font-size: 3em; + transition: 3s; + text-shadow: 20px 10px 10px black, 0 0 25px blue, 0 0 5px darkblue; +}