130 lines
3.1 KiB
HTML
130 lines
3.1 KiB
HTML
<html>
|
|
<meta charset="UTF-8" />
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Sokobanya</title>
|
|
<script src="assets/maps/microban.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<style>
|
|
body {
|
|
font-family: monospace;
|
|
font-size: 30px;
|
|
background-color: #efd4af;
|
|
}
|
|
|
|
.container {
|
|
display: flex;
|
|
justify-content: center;
|
|
width: 100%;
|
|
}
|
|
|
|
#map {
|
|
white-space: pre;
|
|
}
|
|
|
|
#map > img {
|
|
height: 50px;
|
|
width: 50px;
|
|
}
|
|
|
|
#stats {
|
|
font-size: 20px;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
pre {
|
|
color: darkblue;
|
|
margin-bottom: -19px;
|
|
}
|
|
|
|
a {
|
|
color: black;
|
|
text-decoration: none;
|
|
}
|
|
|
|
a:hover {
|
|
color: darkblue;
|
|
text-decoration: none;
|
|
}
|
|
|
|
a.disabled {
|
|
color: grey;
|
|
text-decoration: none;
|
|
pointer-events: none;
|
|
}
|
|
.info a {
|
|
color: darkblue;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.info a:hover {
|
|
color: green;
|
|
text-decoration: none;
|
|
}
|
|
</style>
|
|
|
|
<center>
|
|
<pre>
|
|
█▀ █▀█ █▄▀ █▀█ █▄▄ ▄▀█ █▄░█ █▄█ ▄▀█
|
|
▄█ █▄█ █░█ █▄█ █▄█ █▀█ █░▀█ ░█░ █▀█
|
|
</pre>
|
|
<div id="stats">LEVEL: 0 | MOVES: 0 | LIVES: 10 | POINTS: 0</div>
|
|
</center>
|
|
<div class="container">
|
|
<div id="map"></div>
|
|
</div>
|
|
<div class="container" style="margin-top: 20px; margin-bottom: 80px">
|
|
<a href="#" onclick="g.reset()" style="margin-right: 50px">[r]eset</a>
|
|
<a
|
|
href="#"
|
|
onclick="g.mapInstance.continue()"
|
|
class="disabled"
|
|
id="continueLink"
|
|
>[c]ontinue</a
|
|
>
|
|
</div>
|
|
<hr />
|
|
<div style="padding: 20px" class="info">
|
|
<h4>How To Play:</h4>
|
|
You are an old man working in a Sokobanya, a Russian bath house. You need
|
|
to move pieces of coal to the stoves in order to keep the saunas hot. Try
|
|
to move all pieces of coal in the shortest amount of moves possible!
|
|
<h4>Controls:</h4>
|
|
<ul>
|
|
<li>WASD</li>
|
|
<li>Arrow Keys</li>
|
|
<li>VIM keys [hjkl]</li>
|
|
</ul>
|
|
<h4>TODO:</h4>
|
|
<ul>
|
|
<li>Mobile Support</li>
|
|
<li>Create a cool song and SFX</li>
|
|
<li>Points system</li>
|
|
<li>Steam animation when you beat a level</li>
|
|
<li>Add more level sets (worlds)</li>
|
|
</ul>
|
|
<h4>Credits:</h4>
|
|
<ul>
|
|
<li>
|
|
All levels STOLEN from
|
|
<a
|
|
href="http://www.sneezingtiger.com/sokoban/levels.html"
|
|
target="_blank"
|
|
>here</a
|
|
>
|
|
</li>
|
|
<li>
|
|
Code and Sprites by
|
|
<a href="https://www.domdit.com" target="_blank">Dominic DiTaranto</a>
|
|
</li>
|
|
<li>
|
|
Check out the code
|
|
<a href="https://git.domdit.com/dominic/sokobanya">here</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<script src="assets/script.js"></script>
|
|
</body>
|
|
</html>
|