SNES-like engine in JavaScript.
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.
 
 
 
 

47 lines
1.6 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Super Tea Witch</title>
<style>
* { padding: 0; margin: 0; }
body { background: black; color: white; font-family: monospace; }
div { text-align: center; }
canvas {
background: magenta;
display: block;
margin: 0 auto;
margin-top: 8px;
margin-bottom: 8px;
padding: 1px;
image-rendering: pixelated;
image-rendering: crisp-edges;
image-rendering: -moz-crisp-edges;
}
</style>
</head>
<body>
<!-- The canvas drawing resolution is the SNES resolution: 256x224.
JavaScript upscales the canvas (hopefully in a way that the browser
doesn't antialias it.) -->
<canvas id="canvas" width="256" height="224" style="display: none"></canvas>
<div id="fps"></div>
<div id="debug"></div>
<button id="1x">1x</button>
<button id="2x">2x</button>
<button id="3x">3x</button>
<button id="4x">4x</button>
<button id="5x">5x</button>
<button id="6x">6x</button>
<button id="7x">7x</button>
<button id="8x">8x</button>
<img src="bundle/terrain.png" id="terrain" style="display: none">
<img src="bundle/inside.png" id="inside" style="display: none">
<img src="bundle/outside.png" id="outside" style="display: none">
<img src="bundle/water.png" id="water" style="display: none">
<img src="bundle/witchtiles_1.png" id="witch" style="display: none">
<img src="bundle/spritesheet.png" id="spritesheet" style="display: none">
<script src="bundle/spritesheet.js"></script>
<script src="main.js"></script>
</body>
</html>