Ce mardi je vous emmène au casino !

C’est avec ce code source que vous allez pouvoir jouer au « Bandit manchot ». Il est séparé en deux parties, le Html et le JavaScript.

Pour voir le résultat, cliquez ici.

Le code Html :

<body>
<br />
<div id="globale">
<br />
<div id="contenu">
<br />
<div id="levier2">

                <input type="image" value=" " onclick="lancer_jeu();" id="levier"/>
            </div>
<p>
<br />
<div id="resultat">
<br />
<p id="affichage_gains">
                ---
                </p>
<p>
            </div>
<p>
<br />
<div id="pot">
<br />
<p class="vert">votre pot <br />est de :
                </p>
<p>

<br />
<p id="affichage_pot">100
                </p>
<p>
<br />
<p class="vert">mise :
                </p>
<p>
<br />
<p id="affichage_mise">0
                </p>
<p>
            </div>
<p>
<br />
<div id="jackpot">
                <img name="s1" src="media/theme/slot-vide.png" alt="slot-vide"/>
                <img name="s2" src="media/theme/slot-vide.png" alt="slot-vide"/>
                <img name="s3" src="media/theme/slot-vide.png" alt="slot-vide"/>
            </div>
<p>

<br />
<div id="boutons">
                <input onclick="miser();" type="image" src="media/theme/mise-plus.png" id="miser1"/>
                <input onclick="tout_miser();" type="image" src="media/theme/mise-tout.png" id="miserall"/>
            </div>
<p>
        </div>
<p>
    </div>
<p>
</body>

Le code JavaScript :

var mise = 0;
var pot = 100;
var gains = 0;
// nombre de slots
var nombre_slots = 3;
// declaration d'un tableau avec "slots" comme valeur
var slots = new Array(nombre_slots);
//dclaration de la valeur des slots
var valeur_des_slots = 0;

function lancer_jeu()
{
    if (mise == 0) return;

    // rinitialisation de la valeur des slots
    valeur_des_slots = 0;

    // creation et remplissage du tableau
    for (var index = 0; index < nombre_slots; index++) { slots[index] = tirer_aleatoirement_image(); } s1.src=slots[0]; s2.src=slots[1]; s3.src=slots[2]; calculer_gains(); } //Cette fontion sert pour augmenter la valeur du pot function garder_gains() { if (valeur_des_slots > 0)
    {
        //alert('Vous avez Gagné !!!'); // Affiche une box avec le message "Vous avez Gagné"
        pot = pot + gains;
    }
}

//fonction pour tirer alatoirement une image

function tirer_aleatoirement_image()
{
    var nombre_images = 4;
    // nom de toutes les images d'un slot
    var images = new Array("./media/slot/slot-euro.png","./media/slot/slot-cerise.png","./media/slot/slot-etoile.png","./media/slot/slot-couronne.png");
    // tirage de l'alea
    var alea = Math.floor(Math.random()*nombre_images);
    // recuperation du nom de l'image dans le tableau
    var slot = images[alea];
    // mise  jour de la valeur des slots
    valeur_des_slots = (Math.pow(10,alea)) + (valeur_des_slots);
    return slot;
}

function calculer_gains()
{
    //je fais un switch case pour savoir quels sont mes gains
    switch(valeur_des_slots)
    {
        case nombre_slots:
            gains = mise*20;
            alert('jackpot');
            garder_gains();
            break;

        case nombre_slots * 1000:
            gains =  mise*15;
            garder_gains();
            break;

        case nombre_slots * 100:
            gains = mise*10;
            garder_gains();
            break;

        case nombre_slots * 10:
            gains = mise*5;
            garder_gains();
            break;

        case 12:
        case 102:
        case 1002:
            gains = mise*2;
            garder_gains();
            break;

        default:
            gains = 0;
            break;
    }
// rechargement automatique de la mis tant que le pot est plein (plus ergonomique)
    mise = 0;
    if (pot > 0)
    {
        pot -= 1;
        mise = 1;
    }
    document.getElementById("affichage_pot").innerHTML = pot;
    document.getElementById("affichage_gains").innerHTML = gains;
    document.getElementById("affichage_mise").innerHTML = mise;
}

function miser()
{
    if (pot > 1)
    {
        pot -= 1;
        mise += 1;
        document.getElementById("affichage_pot").innerHTML = pot;
        document.getElementById("affichage_gains").innerHTML = gains;
        document.getElementById("affichage_mise").innerHTML = mise;
    }
}
function tout_miser()
{
    if (pot > 1)
    {
        mise += pot;
        pot = 0;
        document.getElementById("affichage_pot").innerHTML = pot;
        document.getElementById("affichage_gains").innerHTML = gains;
        document.getElementById("affichage_mise").innerHTML = mise;
    }
}

Le code css :

*
{
    margin: 0;
    padding: 0;
}
p
{
    font-family: Arial;
}
/*------------------divs---------------------*/
#globale
{
    width: auto;
    height: auto;
}
#contenu
{
    position: relative;
    top:25px;
    margin-left:auto;
    margin-right: auto;
    background: url(../theme/fond.png) no-repeat;
    width: 642px;
    height: 426px;
}
#levier
{
        float: right;
        width: 96px;
        background: url(../theme/levier-depart.png) no-repeat;
        width:100px;
        height:300px;
}
#levier2
{
        float: right;
        width: 96px;
}
#levier:hover
{
    background: url(../theme/levier-milieu.png) no-repeat;
}
#levier:active
{
    background: url(../theme/levier-jouer.png) no-repeat;
}
#jackpot
{
    float:right;
    top:30px;
    position:relative;
    right:30px;
}

#resultat
{
    position: relative;
    background:url(../theme/resultat.png) no-repeat;
    width: 532px;
    height: 61px;
    margin-left:6px;
    top:20px;
}
#resultat p

{
    font-size: 30px;
    top:15px;
}

#result-tirage

    {
        position: relative;
        float: right;
        width:auto;
        top:35px;
        right:40px;
    }
#pot
{
    position: relative;
    background:url(../theme/mise.png) no-repeat;
    width: 149px;
    height: 199px;
    float:left;
    top:40px;
    margin-left: 7px;
}

#pot p
{
    font-size: 15px;
    top:35px;
    margin-top: 10px;
}
#boutons
{
    position: relative;
    top:50px;
    float: left;
    left:90px;
    width: auto;
    height: auto;
}
#affichage_gains
{
    position: relative;
    color:green;
    text-align: center;
}
 #affichage_pot
{
        position: relative;
        color:green;
        text-align: center;
}

#affichage_mise
{
        position: relative;
        color:green;
        text-align: center;
}
/*------------------------------classes--------------------*/
.vert
{
        position: relative;
        color:green;
        text-align: center;
}

Grand maître L

3 thoughts to “Ce mardi je vous emmène au casino !”

Laisser un commentaire

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.