You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
807 lines
39 KiB
807 lines
39 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link href="https://use.fontawesome.com/releases/v5.0.4/css/all.css" rel="stylesheet">
|
|
<link href="css/style.css" rel="stylesheet">
|
|
<title>Make It True</title>
|
|
</head>
|
|
|
|
<body id="body" class="background">
|
|
<!-- Loading Page -->
|
|
<div id="waitingPage" class="background">
|
|
<p>Loading Stage</p>
|
|
</div>
|
|
<!--Mode selection-->
|
|
<div id="levelSelectionPage" class="background">
|
|
<div id="header_selection" align=center>
|
|
<i class="fa fa-arrow-left home" onclick="closeSelection();" aria-hidden="true"></i>
|
|
<h1 class="dys txt" id="title_selection"></h1>
|
|
<label></label>
|
|
</div>
|
|
<hr id="hr">
|
|
</div>
|
|
<!--Last Selection-->
|
|
<div id="LastSelectionPage" class="background">
|
|
<div id="header_selection" align=center>
|
|
<i class="fa fa-arrow-left home" onclick="closeSelection();" aria-hidden="true"></i>
|
|
<h1 class="dys" id="title_selection_last"><a id="testTitlSelect"></a></h1>
|
|
<label></label>
|
|
</div>
|
|
<hr id="hr">
|
|
<div id="selectionContainer">
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover vanillaElement chap1"
|
|
onclick="wait('vanillaImpossible', this)">
|
|
<a>Chapitre 1</a>
|
|
<i class="fa fa-play" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover vanillaElement scoreElement chap1Score"
|
|
onclick="leaderboard('vanillaImpossible', this)">
|
|
<a></a>
|
|
<i class="fa fa-trophy" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover vanillaElement chap2" onclick="">
|
|
<a>Chapitre 2</a>
|
|
<i class="fa fa-play" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover vanillaElement scoreElement chap2Score"
|
|
onclick="leaderboard('vanillaImpossible', this)">
|
|
<a></a>
|
|
<i class="fa fa-trophy" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover vanillaElement chap3"
|
|
onclick="wait('vanillaImpossible', this)">
|
|
<a>Chapitre 3</a>
|
|
<i class="fa fa-play" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover vanillaElement scoreElement chap3Score"
|
|
onclick="leaderboard('vanillaImpossible', this)">
|
|
<a></a>
|
|
<i class="fa fa-trophy" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover vanillaElement chap4"
|
|
onclick="wait('vanillaImpossible', this)">
|
|
<a>Chapitre 4</a>
|
|
<i class="fa fa-play" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover vanillaElement scoreElement chap4Score"
|
|
onclick="leaderboard('vanillaImpossible', this)">
|
|
<a></a>
|
|
<i class="fa fa-trophy" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover vanillaElement chap5"
|
|
onclick="wait('vanillaImpossible', this)">
|
|
<a>Chapitre 5</a>
|
|
<i class="fa fa-play" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover vanillaElement scoreElement chap5Score"
|
|
onclick="leaderboard('vanillaImpossible', this)">
|
|
<a></a>
|
|
<i class="fa fa-trophy" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Vanilla Selection -->
|
|
<div id="scoreModal" class="modal">
|
|
<div class="modal-content score-content">
|
|
<div class="modal-body border background">
|
|
<span class="close" onclick="closeModal('scoreModal')">×</span>
|
|
<h1 align=center class="txt dys" id="scoreTitle">Tableau des scores</h1>
|
|
<hr id="hr">
|
|
<div class="scoreContainer border" align=center>
|
|
<p class="dys txt" id="mode2"></p>
|
|
<hr id="hr">
|
|
<p class="dys" id="scoreHere"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="VanillalevelSelectionPage" class="background">
|
|
<div id="header_selection" align=center>
|
|
<i class="fa fa-arrow-left home" onclick="goToSelection(this);" aria-hidden="true"></i>
|
|
<h1 class="dys" id="title_selection_2"></h1>
|
|
<label></label>
|
|
</div>
|
|
<hr id=" hr">
|
|
|
|
<div id="selectionVanillaContainer">
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover sel1" onclick="wait('vanillaFacile', this)">
|
|
<a>Facile</a>
|
|
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover sel2" onclick="wait('vanillaMoyen', this)">
|
|
<a>Moyen</a>
|
|
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover sel3" onclick="wait('vanillaImpossible', this)">
|
|
<a>Impossible</a>
|
|
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover vanillaElement sel4"
|
|
onclick="wait('vanillaInfini', this)">
|
|
<a>Mode Infini</a>
|
|
<i class="fa fa-play" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover vanillaElement scoreElement infScore"
|
|
onclick="leaderboard('vanilla', this)">
|
|
<a></a>
|
|
<i class="fa fa-trophy" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="selectionNormalContainer">
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover vanillaElement" onclick="wait('normalFacile', this)">
|
|
<a>Facile</a>
|
|
<i class="fa fa-play" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover vanillaElement scoreElement"
|
|
onclick="leaderboard('normalFacile', this)">
|
|
<a></a>
|
|
<i class="fa fa-trophy" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover vanillaElement" onclick="wait('normalMoyen', this)">
|
|
<a>Moyen</a>
|
|
<i class="fa fa-play" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover vanillaElement scoreElement"
|
|
onclick="leaderboard('normalMoyen', this)">
|
|
<a></a>
|
|
<i class="fa fa-trophy" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover vanillaElement"
|
|
onclick="wait('normalImpossible', this)">
|
|
<a>Impossible</a>
|
|
<i class="fa fa-play" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover vanillaElement scoreElement"
|
|
onclick="leaderboard('normalImpossible', this)">
|
|
<a></a>
|
|
<i class="fa fa-trophy" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<div id="containerVanilla">
|
|
<div class="border background dys listenerHover vanillaElement" onclick="wait('normalInfini', this)">
|
|
<a>Mode Infini</a>
|
|
<i class="fa fa-play" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover vanillaElement scoreElement"
|
|
onclick="leaderboard('normal', this)">
|
|
<a></a>
|
|
<i class="fa fa-trophy" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div id="modeSelectionPage" class="dys background">
|
|
<div id="header_selection" align=center>
|
|
<i class="fa fa-arrow-left home" onclick="closePerso(this);" aria-hidden="true"></i>
|
|
<h1 class="dys" id="title_perso_setup">Sélection</h1>
|
|
<label></label>
|
|
</div>
|
|
<hr id="hr">
|
|
<div id="perso-setupContainer">
|
|
<div>
|
|
<p>Fonctions Logiques : </p>
|
|
<div>
|
|
<input type="checkbox" id="logique10" name="logique10" checked>
|
|
<label for="logique10">ET</label>
|
|
</div>
|
|
<div>
|
|
<input type="checkbox" id="logique20" name="logique20">
|
|
<label for="logique20">OU</label>
|
|
</div>
|
|
<div>
|
|
<input type="checkbox" id="logique30" name="logique30">
|
|
<label for="logique30">NON</label>
|
|
</div>
|
|
<div>
|
|
<input type="checkbox" id="logique40" name="logique40">
|
|
<label for="logique40">NON-ET</label>
|
|
</div>
|
|
<div>
|
|
<input type="checkbox" id="logique50" name="logique50">
|
|
<label for="logique50">NON-OU</label>
|
|
</div>
|
|
</div><br><br>
|
|
<div class="border background dys listenerHover" id="generate_button_perso"
|
|
onclick="buttonSpin(this,'select')">
|
|
<a>Jouer</a>
|
|
<i class="fa fa-arrow-right" id="icon_generate_2" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!--Test Generateur-->
|
|
<div id="TestNouveauGenerateur" class="background">
|
|
<div id="header_selection" align=center>
|
|
<i class="fa fa-arrow-left home" onclick="closePerso(this);" aria-hidden="true"></i>
|
|
<h1 class="dys" id="title_perso_setup">Générateur</h1>
|
|
<label></label>
|
|
</div>
|
|
<hr id="hr">
|
|
<div id="perso-setupContainer" class="dys">
|
|
<div>
|
|
<label>Nombres de portes logiques : </label>
|
|
<input type="number" id="colonne_number_setup_global_gen" value="10">
|
|
</div><br>
|
|
<p class="dys"><a id="colonnes_live"></a></p>
|
|
<div>
|
|
<p>Fonctions Logiques : </p>
|
|
<div>
|
|
<input type="checkbox" id="logique1" name="logique1" checked>
|
|
<label for="logique1">ET</label>
|
|
</div>
|
|
<div>
|
|
<input type="checkbox" id="logique2" name="logique2">
|
|
<label for="logique2">OU</label>
|
|
</div>
|
|
<div>
|
|
<input type="checkbox" id="logique3" name="logique3">
|
|
<label for="logique3">NON</label>
|
|
</div>
|
|
<div>
|
|
<input type="checkbox" id="logique4" name="logique4">
|
|
<label for="logique4">NON-ET</label>
|
|
</div>
|
|
<div>
|
|
<input type="checkbox" id="logique5" name="logique5">
|
|
<label for="logique5">NON-OU</label>
|
|
</div>
|
|
</div>
|
|
<button class="border background dys listenerHover" onclick="addGenForkInput()">
|
|
<a>Ajouter un fork </a>
|
|
<i style="margin-left:20px" class="fa fa-plus" aria-hidden="true"></i>
|
|
</button>
|
|
<br>
|
|
<div clas="dys" id="gen_fork_div">
|
|
|
|
</div>
|
|
<br>
|
|
<p class="dys" id="error_perso"></p>
|
|
<br>
|
|
<div class="dys" id="warning_perso">
|
|
<div class="tooltip">
|
|
<span class="tooltiptext">Le générateur génère aléatoirement un chemin ainsi que des portes,
|
|
toute
|
|
les portes sauf la porte NON ont 2 entrées, il y a donc une possibilité pour que l'aléatoire
|
|
décide de mettre des portes NON, et donc une seul entrée. Si c'est le cas, il se peut qu'il
|
|
y
|
|
est trop de fork, le générateur peut donc se permettre d'ajouter une porte si besoin.</span>
|
|
<p id="warning_message"><a id="warning_perso_message">Problèmes possible lors de la génération
|
|
</a>
|
|
<i class="fa fa-info-circle" aria-hidden="true"></i></p>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="border background dys listenerHover" id="generate_button_perso"
|
|
onclick="buttonSpin(this,'gen')">
|
|
<a>Générer le niveau</a>
|
|
<i class="fa fa-arrow-right" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!--Play Page-->
|
|
<div id="playPage">
|
|
<!--<div id="success" class="modal">
|
|
<div class="modal-content info-content">
|
|
<div class="modal-body border background success_modal_body" align=center>
|
|
<span class="close" onclick="closeModal('success');nextLevel();">×</span>
|
|
<h1 class="txt dys" id="successTitle"></h1>
|
|
<hr id="hr">
|
|
<p class="dys"><a class="txt" id="successInfo"></a><a id="click_number"></a><a> click(s)</a>
|
|
</p>
|
|
<div id="show_stage" class="border"></div><br>
|
|
<div id="choice_button_div">
|
|
<div class="border background dys listenerHover choice retry_tuto" id="retry_tuto_button"
|
|
onclick="closeModal('success');retry();"">
|
|
<a>Refaire le niveau</a>
|
|
<i class=" fa fa-retweet" id="margin-left-10" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover choice" id="next_level_button"
|
|
onclick="closeModal('success');nextLevel();"">
|
|
<a>Niveau suivant</a>
|
|
<i class=" fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
|
|
</div>
|
|
|
|
</div>
|
|
<br><br>
|
|
<p class="dys info_check" align=right>Toujours afficher ce panneau <input type="checkbox"
|
|
id="success_check_input" onclick="successCheck();" checked></p>
|
|
</div>
|
|
</div>
|
|
</div>-->
|
|
<div id="firstTime" class="modal">
|
|
<div class="modal-content info-content">
|
|
<div class="modal-body dys border background" align=center>
|
|
<span class="close" onclick="closeModal('firstTime');">×</span>
|
|
<h1 class="dys">Comment jouer</h1>
|
|
<hr id="hr">
|
|
|
|
<br>
|
|
|
|
<br>Vous devez allumer la boite la plus à droite du circuit logique pour gagner la partie<br>
|
|
Pour cela, vous devez cliquer sur les boites à gauche de l'écran pour changer leur valeur : 0
|
|
(FAUX/ETEINT) ou 1 (VRAI/ALLUME).<br><br>
|
|
Le but est de terminer les niveaux en un minimum de clics et un minimum de temps<br><br>
|
|
Vous pouvez voir votre score à côté de chaque mode de jeu ainsi que le score des autres
|
|
joueurs.<br>
|
|
<p class="dys info_check" align=right>Ne plus afficher les aides <input type="checkbox"
|
|
id="info_check_input" onclick="showInfo();"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="firstTimeet" class="modal">
|
|
<div class="modal-content info-content">
|
|
<div class="modal-body dys border background" align=center>
|
|
<span class="close" onclick="closeModal('firstTimeet');">×</span>
|
|
<h1 class="txt dys" id="infoFirstTimeEt"></h1>
|
|
<hr id="hr">
|
|
<p class="dys txt margin-global" id="infoFirstTimeEtInfo1"></p>
|
|
<table class="veriteTable dys">
|
|
<tr>
|
|
<th class="border">a</th>
|
|
<th class="border">b</td>
|
|
<th class="border">S</th>
|
|
</tr>
|
|
<tr class="veri_false">
|
|
<td class="border">0</td>
|
|
<td class="border">0</td>
|
|
<td class="border">0</td>
|
|
</tr>
|
|
<tr class="veri_false">
|
|
<td class="border">0</td>
|
|
<td class="border">1</td>
|
|
<td class="border">0</td>
|
|
</tr>
|
|
<tr class="veri_false">
|
|
<td class="border">1</td>
|
|
<td class="border">0</td>
|
|
<td class="border">0</td>
|
|
</tr>
|
|
<tr class="veri_true">
|
|
<td class="border">1</td>
|
|
<td class="border">1</td>
|
|
<td class="border">1</td>
|
|
</tr>
|
|
</table>
|
|
<br>
|
|
<p class="dys">a = entrée en haut à gauche<br>
|
|
b = entrée en bas à gauche<br>
|
|
S = sortie à droite</p>
|
|
<p><img src="img/txt_en/and.png" class="margin-right"><img src="img/sym/and.png"></p>
|
|
<br><br>
|
|
<p class="dys info_check" align=right>Ne plus afficher les aides <input type="checkbox"
|
|
id="info_check_input" onclick="showInfo();"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="firstTimeou" class="modal">
|
|
<div class="modal-content info-content">
|
|
<div class="modal-body border background" align=center>
|
|
<span class="close" onclick="closeModal('firstTimeou');">×</span>
|
|
<h1 class="txt dys" id="infoFirstTimeOu"></h1>
|
|
<hr id="hr">
|
|
<p class="dys txt margin-global" id="infoFirstTimeOuInfo1"></p>
|
|
<table class="veriteTable dys">
|
|
<tr>
|
|
<th class="border">a</th>
|
|
<th class="border">b</td>
|
|
<th class="border">S</th>
|
|
</tr>
|
|
<tr class="veri_false">
|
|
<td class="border">0</td>
|
|
<td class="border">0</td>
|
|
<td class="border">0</td>
|
|
</tr>
|
|
<tr class="veri_true">
|
|
<td class="border">0</td>
|
|
<td class="border">1</td>
|
|
<td class="border">1</td>
|
|
</tr>
|
|
<tr class="veri_true">
|
|
<td class="border">1</td>
|
|
<td class="border">0</td>
|
|
<td class="border">1</td>
|
|
</tr>
|
|
<tr class="veri_true">
|
|
<td class="border">1</td>
|
|
<td class="border">1</td>
|
|
<td class="border">1</td>
|
|
</tr>
|
|
</table>
|
|
<br>
|
|
<p class="dys">a = entrée en haut à gauche<br>
|
|
b = entrée en bas à gauche<br>
|
|
S = sortie à droite</p>
|
|
<p><img src="img/txt_en/or.png" class="margin-right"><img src="img/sym/or.png"></p>
|
|
<br><br>
|
|
<p class="dys info_check" align=right>Ne plus afficher les aides <input type="checkbox"
|
|
id="info_check_input" onclick="showInfo();"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="firstTimeinv" class="modal">
|
|
<div class="modal-content info-content">
|
|
<div class="modal-body border background" align=center>
|
|
<span class="close" onclick="closeModal('firstTimeinv');">×</span>
|
|
<h1 class="txt dys" id="infoFirstTimeinv"></h1>
|
|
<hr id="hr">
|
|
<p class="dys txt margin-global" id="infoFirstTimeinvInfo1"></p>
|
|
<table class="veriteTable dys">
|
|
<tr>
|
|
<th class="border">a</th>
|
|
<th class="border">S</th>
|
|
</tr>
|
|
<tr class="veri_true">
|
|
<td class="border">0</td>
|
|
<td class="border">1</td>
|
|
</tr>
|
|
<tr class="veri_false">
|
|
<td class="border">1</td>
|
|
<td class="border">0</td>
|
|
</tr>
|
|
</table>
|
|
<br>
|
|
<p class="dys">a = entrée à gauche<br>
|
|
S = sortie à droite</p>
|
|
<p><img src="img/txt_en/not.png" class="margin-right"><img src="img/sym/not.png"></p>
|
|
<br><br>
|
|
<p class="dys info_check" align=right>Ne plus afficher les aides</a><input type="checkbox"
|
|
id="info_check_input" onclick="showInfo();"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="firstTimenonou" class="modal">
|
|
<div class="modal-content info-content">
|
|
<div class="modal-body border background" align=center>
|
|
<span class="close" onclick="closeModal('firstTimenonou');">×</span>
|
|
<h1 class="txt dys" id="infoFirstTimenonou"></h1>
|
|
<hr id="hr">
|
|
<p class="dys txt margin-global" id="infoFirstTimenonouInfo1"></p>
|
|
<table class="veriteTable dys">
|
|
<tr>
|
|
<th class="border">a</th>
|
|
<th class="border">b</th>
|
|
<th class="border">S</th>
|
|
</tr>
|
|
<tr class="veri_true">
|
|
<td class="border">0</td>
|
|
<td class="border">0</td>
|
|
<td class="border">1</td>
|
|
</tr>
|
|
<tr class="veri_false">
|
|
<td class="border">1</td>
|
|
<td class="border">0</td>
|
|
<td class="border">0</td>
|
|
</tr>
|
|
<tr class="veri_false">
|
|
<td class="border">0</td>
|
|
<td class="border">1</td>
|
|
<td class="border">0</td>
|
|
</tr>
|
|
<tr class="veri_false">
|
|
<td class="border">1</td>
|
|
<td class="border">1</td>
|
|
<td class="border">0</td>
|
|
</tr>
|
|
</table>
|
|
<br>
|
|
<p class="dys">a = entrée en haut à gauche<br>
|
|
b = entrée en bas à gauche<br>
|
|
S = sortie à droite</p>
|
|
<p><img src="img/txt_en/nor.png" class="margin-right"><img src="img/sym/nor.png"></p>
|
|
<br><br>
|
|
<p class="dys info_check" align=right>Ne plus afficher les aides <a class="txt"
|
|
id="close_helps"></a><input type="checkbox" id="info_check_input" onclick="showInfo();"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="firstTimeetnon" class="modal">
|
|
<div class="modal-content info-content">
|
|
<div class="modal-body border background" align=center>
|
|
<span class="close" onclick="closeModal('firstTimeetnon');">×</span>
|
|
<h1 class="txt dys" id="infoFirstTimeetnon"></h1>
|
|
<hr id="hr">
|
|
<p class="dys txt margin-global" id="infoFirstTimeetnonInfo1"></p>
|
|
<table class="veriteTable dys">
|
|
<tr>
|
|
<th class="border">a</th>
|
|
<th class="border">b</th>
|
|
<th class="border">S</th>
|
|
</tr>
|
|
<tr class="veri_true">
|
|
<td class="border">0</td>
|
|
<td class="border">0</td>
|
|
<td class="border">1</td>
|
|
</tr>
|
|
<tr class="veri_true">
|
|
<td class="border">1</td>
|
|
<td class="border">0</td>
|
|
<td class="border">1</td>
|
|
</tr>
|
|
<tr class="veri_true">
|
|
<td class="border">0</td>
|
|
<td class="border">1</td>
|
|
<td class="border">1</td>
|
|
</tr>
|
|
<tr class="veri_false">
|
|
<td class="border">1</td>
|
|
<td class="border">1</td>
|
|
<td class="border">0</td>
|
|
</tr>
|
|
</table>
|
|
<br>
|
|
<p class="dys">a = entrée en haut à gauche<br>
|
|
b = entrée en bas à gauche<br>
|
|
S = sortie à droite</p>
|
|
<p><img src="img/txt_en/nand.png" class="margin-right"><img src="img/sym/nand.png"></p>
|
|
<br><br>
|
|
<p class="dys info_check" align=right>Ne plus afficher les aides <a class="txt"
|
|
id="close_helps"></a><input type="checkbox" id="info_check_input" onclick="showInfo();"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="menu border" id="play_menu_game">
|
|
<div class="header_play">
|
|
<a onclick="closeGame();"><i class="fa fa-home home" aria-hidden="true"></i></a>
|
|
<div align=center>
|
|
<p id="modeDeJeu" class="txt dys"></p>
|
|
<p><a id="niveau" class="txt dys"></a><a class="dys niveau"></a></p>
|
|
</div>
|
|
|
|
<div class="timer_show dys border"><span class="timer_txt"></span></div>
|
|
|
|
</div>
|
|
<div id="progress_bar" class="progress_bar border backgroundInv"></div>
|
|
</div>
|
|
<div id="lose_pannel" class="border" align=center>
|
|
<h2 class="txt dys" id="gameOverTitle"></h2>
|
|
<hr id="hr">
|
|
<div class="flexbox_inline">
|
|
<div class="border background dys listenerHover" id="backHomeBtn" onclick="backHome()">
|
|
<a id="niveauSuivantText">Retour au menu</a>
|
|
<i class="fa fa-home" id="fa-home-2" aria-hidden="true"></i>
|
|
</div>
|
|
<div>
|
|
<p><a class="dys"></a><a class="dys" id="scoreTotGameOver"></a></p>
|
|
<p class="dys"><a class="dys"></a><a class="dys" id="TempsTotGameOver"></a></p>
|
|
<p><a class="dys">Vous avez atteint le niveau : </a><a class="dys" id="niveauGameOver"></a><a
|
|
class="dys nivShow"> / 5</a></p>
|
|
</div>
|
|
|
|
<div class="border background dys listenerHover" id="retry_button" onclick="">
|
|
<a>Réessayer</a>
|
|
<i class=" fa fa-retweet" id="margin-left-10" aria-hidden="true"></i>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div id="win_pannel" class="border" align=center>
|
|
<h2 class="txt dys" id="successTitle"></h2>
|
|
<hr id="hr">
|
|
<div class="flexbox_inline">
|
|
<p class="dys"><a class="txt" id="successInfo"></a><a id="click_number"></a><a> click(s)</a>
|
|
</p>
|
|
<div id="choice_button_div">
|
|
<div class="border background dys listenerHover choice retry_tuto" id="retry_tuto_button"
|
|
onclick="closeModal('success');retry();"">
|
|
<a>Refaire le niveau</a>
|
|
<i class=" fa fa-retweet" id="margin-left-10" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover choice" id="next_level_button"
|
|
onclick="closeModal('success');nextLevel();">
|
|
<a id="niveauSuivantText">Niveau suivant</a>
|
|
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
|
|
</div>
|
|
|
|
</div>
|
|
<p class="dys"><a class="txt" id="timeInfo"></a><a id="time_number"></a><a> seconde(s)</a>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
<div id="play_container" class="border">
|
|
|
|
</div>
|
|
</div>
|
|
<!--Main Page-->
|
|
<div id="mainPage">
|
|
<div id="menu">
|
|
<p id="titleGame" class="title dys">M<a class="secret" onclick="flip()">a</a>ke It True</p>
|
|
</div>
|
|
<div id="selectionContainer2">
|
|
<div class="border background dys listenerHover flexElement" onclick="wait('tuto', this)">
|
|
<a>Tutoriel</a>
|
|
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover flexElement" onclick="wait('vanilla', this)">
|
|
<a>Vanilla</a>
|
|
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover flexElement" onclick="wait('normal', this)">
|
|
<a>Normal</a>
|
|
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover flexElement" onclick="wait('select', this)">
|
|
<a>Mode Sélection</a>
|
|
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="border background dys listenerHover flexElement" onclick="wait('test', this)">
|
|
<a>Mode Perso</a>
|
|
<i class="fa fa-arrow-right" id="right_select" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<a onclick="openModal('myModal')"><i class="fa fa-cog" id="setting" aria-hidden="true"></i></a>
|
|
<a onclick="openModal('infoModal')"><i class="fa fa-info" id="setting" aria-hidden="true"></i></a>
|
|
<div class="alert dys">
|
|
<span class="closebtn" onclick="this.parentElement.style.display='none';">×</span>
|
|
<strong>Bienvenue!</strong> C'est la première fois que vous vous connectez, vous pouvez changer votre pseudo
|
|
et les configurations du jeu dans les paramètres !
|
|
</div>
|
|
<div id="myModal" class="modal">
|
|
<div class="modal-content">
|
|
|
|
<div id="setting_int" class="modal-body border background" align=center>
|
|
<span class="close" onclick="closeModal('myModal')">×</span>
|
|
<h1 class="txt dys" id="settingTitle"></h1>
|
|
<hr id="hr">
|
|
<br>
|
|
<p>
|
|
<a class="txt dys" id="themeDark"></a>
|
|
<input id="darkcheck" type="checkbox" onclick="darkMode()" checked>
|
|
</p>
|
|
<p>
|
|
<a class="txt dys" id="dysfont"></a>
|
|
<input id="dyscheckbox" type="checkbox" onclick="dysFont()" checked>
|
|
</p>
|
|
<p>
|
|
<a class="txt dys" id="symbole"></a>
|
|
<input id=symcheckbox" type="checkbox" onclick="symbole(this)">
|
|
</p>
|
|
<p class="dys">
|
|
<a>Pseudo : </a>
|
|
<a id="pseudo_show"></a>
|
|
<i class="fa fa-edit" aria-hidden="true" onclick="openChangeInput()"></i>
|
|
</p>
|
|
<div id="PseudoChanger" class="border background">
|
|
<input type="text" id="pseudoInput" value="pseudo">
|
|
<i class="fa fa-save" id="saveIco" aria-hidden="true" onclick="tryChangePseudo()"></i>
|
|
</div>
|
|
<br>
|
|
<br><img onclick="setLang('fr')" class="img_france" src="img/france.png" />
|
|
<img onclick="setLang('en')" class="img_usa" src="img/usa.png" /><br><br><br>
|
|
<button class="dys txt" id="cache_reinit" onclick="resetCache();"></button><br>
|
|
<hr id="hr">
|
|
<p id="setting_title_perso" class="txt dys"></p>
|
|
<div class="input_line">
|
|
<div class="colomn_line_input">
|
|
<a class="txt dys" id="active_switch_setting"></a>
|
|
<div class="input-color-container">
|
|
<input type="color" id="active_switch_picker" name="head" value="#008000" />
|
|
</div>
|
|
</div>
|
|
<div class="colomn_line_input">
|
|
<a class="txt dys" id="inactive_switch_setting"></a>
|
|
<div class="input-color-container">
|
|
<input type="color" id="inactive_switch_picker" name="head" value="#FF0000">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="input_line">
|
|
<div class="colomn_line_input">
|
|
<a class="txt dys" id="active_line_setting"></a>
|
|
<div class="input-color-container">
|
|
<input type="color" id="active_line_picker" name="head" value="#4CFEFE">
|
|
</div>
|
|
</div>
|
|
<div class="colomn_line_input">
|
|
<a class="txt dys" id="inactive_line_setting"></a>
|
|
<div class="input-color-container">
|
|
<input type="color" id="inactive_line_picker" name="head" value="#000000">
|
|
</div>
|
|
</div>
|
|
<div class="colomn_line_input">
|
|
<a class="txt dys" id="inactive_end_setting"></a>
|
|
<div class="input-color-container">
|
|
<input type="color" id="inactive_end_picker" name="head" value="#ff0000">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr id="hr">
|
|
<div class="setting_play" id="setting_container">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="reset_cache" class="modal">
|
|
<div class="modal-content info-content">
|
|
<div class="modal-body border background" align=center>
|
|
<span class="close" onclick="closeModal('reset_cache');">×</span>
|
|
<h1 class="txt dys" id="reset"></h1>
|
|
<hr id="hr">
|
|
<p class="dys txt margin-global" id="reset_cache_message"></p>
|
|
<br><br>
|
|
<br><br>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div id="gameOver" class="modal">
|
|
<div class="modal-content score-content">
|
|
<div class="modal-body border background">
|
|
<span class="close" onclick="closeModal('gameOver')">×</span>
|
|
<h1 align=center class="txt dys" id="gameOverTitle">Game Over</h1>
|
|
<hr id="hr">
|
|
<br><br>
|
|
<div align=center>
|
|
<p><a class="dys"></a><a class="dys" id="scoreTotGameOver"></a></p>
|
|
<p class="dys"><a class="dys"></a><a class="dys" id="TempsTotGameOver"></a></p>
|
|
<p><a class="dys">Niveau max : </a><a class="dys" id="niveauGameOver"></a></p>
|
|
</div>
|
|
<hr id="hr">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="infoModal" class="modal">
|
|
<div class="modal-content info-content">
|
|
<div class="modal-body border background" align=center>
|
|
<span class="close" onclick="closeModal('infoModal')">×</span>
|
|
<h1 class="txt dys" id="infoTitle"></h1>
|
|
<hr id="hr">
|
|
<p class="dys">Site développé par Pierre SOUVIGNET lors d'un projet de 2ème année de DUT
|
|
Informatique à Clermont-Ferrand. Supervisé par Mme Malika More et Mr Pascal Lafourcade</p>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
<script src="https://unpkg.com/konva@6.0.0/konva.min.js"></script>
|
|
<script src="js/const.js"></script>
|
|
<script src="js/lang.js"></script>
|
|
<script src="js/func.js"></script>
|
|
<script src="js/class.js"></script>
|
|
<script src="js/createElement.js"></script>
|
|
<script src="js/easytimer.min.js"></script>
|
|
<script src="js/logique.js"></script>
|
|
<script src="js/init.js"></script>
|
|
<script src="js/main.js"></script>
|
|
<script src="js/timer.js"></script>
|
|
<script src="js/db.js"></script>
|
|
<script src="js/generateGame.js"></script>
|
|
<script>
|
|
initAll();
|
|
</script>
|
|
|
|
|
|
</html> |