89 lines
3.1 KiB
HTML
89 lines
3.1 KiB
HTML
<!doctype html>
|
|
<html id="html" lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
|
<title>Sokoban</title>
|
|
|
|
<meta name="description" content="">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<link rel="icon" href="./res/player.png"/>
|
|
<!-- Place favicon.ico in the root directory -->
|
|
<link rel="stylesheet" href="./style.css"/>
|
|
|
|
</head>
|
|
<body>
|
|
<!--[if lt IE 8]>
|
|
<p class="browserupgrade">
|
|
You are using an <strong>outdated</strong> browser. Please
|
|
<a href="http://browsehappy.com/">upgrade your browser</a> to improve
|
|
your experience.
|
|
</p>
|
|
<![endif]-->
|
|
<nav>
|
|
<h1>Sokoban</h1>
|
|
<ol id="level-list" class="not-in-win-animation">
|
|
</ol>
|
|
</nav>
|
|
<div class="container">
|
|
<!-- Scoreboard -->
|
|
<aside class="left-sidebar">
|
|
<h2>Score</h2>
|
|
<div class="input-field">
|
|
<label for="name">Name</label>
|
|
<input type="text" id="name" name="name">
|
|
<button id="submit-name">Submit</button>
|
|
</div>
|
|
<table border="1">
|
|
<thead>
|
|
<th>Name</th>
|
|
<th>Score</th>
|
|
</thead>
|
|
|
|
<tbody id="scoreTable">
|
|
</tbody>
|
|
</table>
|
|
</aside>
|
|
|
|
<!-- Game -->
|
|
<main>
|
|
<article class="not-in-win-animation">
|
|
<canvas id="canvas" width="800" height="400"></canvas>
|
|
<div id="tutorial-speech-bubble" class="text-bubble">
|
|
<div class="dialog">
|
|
<p id="tutorial-box" class="speech"></p>
|
|
<div class="right-point">
|
|
</div>
|
|
<div class="right-point shifted">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
|
|
</main>
|
|
|
|
<!-- Controls -->
|
|
<aside class="controls not-in-win-animation right-sidebar">
|
|
<div id="timer">Time</div>
|
|
<button id="pause-1">Pause</button>
|
|
<button id="pause-2">Pause</button><br/>
|
|
<label for="dificulty-slider">Difficulty</label><br/>
|
|
<input type="range" min="0" max="100" value="50" id="difficulty-slider">
|
|
|
|
<hr>
|
|
<br/>
|
|
</aside>
|
|
</div>
|
|
|
|
|
|
<footer>
|
|
<p>Sokoban 2022</p>
|
|
<p>Pour une meilleure expérience, veuillez utiliser ce jeu sur un ordinateur avec un écran horizontal.</p>
|
|
</footer>
|
|
|
|
</body>
|
|
<!-- <script type="module" src="./modules/ressources.mjs"></script> -->
|
|
<script type="module" src="./script.js"></script>
|
|
<!-- <script type="text/javascript" src="./canvas.js"></script> -->
|
|
</html>
|