index.html

﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Soul Ascension Shell</title>
    <!-- THE ORDER OF THESE FILES MUST BE IN THE ORDER OF MOST DEPENDENT TO LEAST DEPENDENT. -->
    <script type="module" src="./js/App.js"></script>
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<p id="game-over" class="gameOver">Game Over</p>
<div class="row">
    <div class="column">
        <div class="row">
            <button id="start-game" onclick="window.startGame()">Press to Play</button>
            <script type="module">
                import startGame from './js/App.js'
                window.startGame = startGame
            </script>
        </div>
        <div class="row">
            <canvas id="viewport" tabindex="1" width="800" height="800" oncontextmenu="return false;"></canvas>
            <script>
                window.onload = function () {
                    document.getElementById('viewport').focus();
                };
            </script>
        </div>
    </div>
    <div class="column">
        <div class="row">
            <h1>Controls</h1>
        </div>
        <div class="row">
            <p>
                Movement keys: W A S D or arrow keys<br>
                Standard attack: Left clicking or pressing the 1 key will perform a standard attack in direction the player is facing<br>
                Whirlwind attack: Right clicking or pressing the 2 key will perform a sweeping attack around the player.<br>
                Consume healing potion: Pressing the H key will consume a potion and restore your health.<br>
                Respawn: Pressing the space key will respawn your character at the beginning of the level<br>
                Mute audio: Pressing the M key will mute and unmute audio.<br>
                Toggle debug mode: Pressing the ~ (tilde) key will toggle debug mode on and off.
            </p>
        </div>
        <div class="row">
            <h1>Information</h1>
        </div>
        <div>
            <p>
                Compatible with Chrome, Firefox, and Edge.<br>
                Internet Explorer is incompatible due to lack of ES6 support.
            </p>
        </div>
    </div>
</div>
</body>
</html>