|
|
<!DOCTYPE html>
|
|
|
<html lang="fr">
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
<link rel="stylesheet" href="vues/css/style-page.css">
|
|
|
<link rel="stylesheet" href="vues/css/style.css" />
|
|
|
|
|
|
</head>
|
|
|
<title>Set</title>
|
|
|
</head>
|
|
|
<body>
|
|
|
|
|
|
<H1 class="colortext" >HyperSet</H1>
|
|
|
|
|
|
<div class="play-btn">
|
|
|
<img class="playsmall-btn" id="playBtn" src="vues/images/play.png" onclick=" showGame()" style="display: block;">
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div id='game' class="wrapper" style="display: none;">
|
|
|
<h1>(TEST) Set</h1>
|
|
|
<p>Find sets.</p>
|
|
|
<p>Sets found: <span data-display="score" class="score">0</span></p>
|
|
|
<p>Number of Sets: <span data-display="nbSets" class="nbSets"></span></p>
|
|
|
|
|
|
|
|
|
<div id="carte" class="game-board" data-display="game-board"></div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="settings-btn">
|
|
|
<img class="small-btn" id="settingsBtn" onclick="showSettings();" src="vues/images/settings.png">
|
|
|
</div>
|
|
|
|
|
|
<div class="explain-btn">
|
|
|
<img class="small-btn" id="explainBtn" src="vues/images/info.png" onclick="showExplain()">
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<div id="popupSettings" class="popup" style="display: none;">
|
|
|
<div class="popup-content">
|
|
|
<div class="popup-header">
|
|
|
<span class="close" onclick="closeSettingsPopup();">x</span>
|
|
|
<h1 class="settings-title text disable-select dys-font" id="settings" style="font-family: Arial; line-height: normal;">PARAMÈTRES</h1>
|
|
|
<hr class="hr-settings-header">
|
|
|
</div>
|
|
|
|
|
|
<div class="custom-select">
|
|
|
<h2 class="text-settings text disable-select dys-font" id="langTitle" style="font-family: Arial; line-height: normal;">LANGUE</h2>
|
|
|
<select id="lang-selector">
|
|
|
<option value="fr">Français</option>
|
|
|
<option value="en">English</option>
|
|
|
</select>
|
|
|
</div>
|
|
|
|
|
|
<hr class="hr-settings">
|
|
|
<div class="div-settings">
|
|
|
<h2 class="text-dalt-settings text disable-select dys-font" id="daltoSettings" style="font-family: Arial; line-height: normal;">RÉGLAGES COULEURS</h2>
|
|
|
<p>Choisit la couleur de tes formes</p>
|
|
|
<div>
|
|
|
Couleur 1 :
|
|
|
<input type="color"
|
|
|
value="#FF0000">
|
|
|
</div>
|
|
|
|
|
|
<div>
|
|
|
Couleur 2 :
|
|
|
<input type="color"
|
|
|
value="#008000">
|
|
|
|
|
|
</div>
|
|
|
<div>
|
|
|
Couleur 3 :
|
|
|
<input type="color"
|
|
|
value="#800080">
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
<hr class="hr-settings">
|
|
|
<div class="div-settings">
|
|
|
<h2 class="text-theme-settings text disable-select dys-font" id="themeSettings" style="font-family: Arial; line-height: normal;">THEME SOMBRE</h2>
|
|
|
<label class="switch"><input type="checkbox" id="themeSwitch"><div class="slider round"><span class="on disable-select">ON</span><span class="off disable-select">OFF</span></div></label>
|
|
|
</div>
|
|
|
<hr class="hr-settings">
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<div id="popupExplain" class="popup" style="display: none;">
|
|
|
<div class="popup-content">
|
|
|
<div class="popup-header">
|
|
|
<span class="close" onclick="closeExplainPopup();">×</span>
|
|
|
<h1 class="settings-title text dys-font" id="explainTitle" style="font-family: Arial; line-height: normal;">EXPLICATIONS</h1>
|
|
|
<hr class="hr-settings-header">
|
|
|
</div>
|
|
|
<h2 class="text-explain-welcome text dys-font" id="explainWelcome" style="font-family: Arial; line-height: normal;">BIENVENUE SUR HYPER-SET !</h2>
|
|
|
<h2 class="text-explain-pr text dys-font" id="explainText" style="font-family: Arial; line-height: normal;"> REGLES</h2>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="menu box">
|
|
|
<a href="index.php" class="logo">HyperSet</a>
|
|
|
<a href="index.php?action=VoirScore">Voir Les Scores</a>
|
|
|
</div>
|
|
|
|
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
|
|
<script type="text/javascript" src="vues/js/Settings.js"></script>
|
|
|
<script src="vues/js/set.js"></script>
|
|
|
|
|
|
|
|
|
</body>
|
|
|
</html> |
