123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <link rel="stylesheet" href="style.css">
- </head>
- <body>
- <div id="sections">
- <div class="loading hidden">
- <div class="arg"></div>
- <img src="assets/loading.gif">
- </div>
-
- <div class="error hidden">
- <div class="arg"></div>
- </div>
-
- <div class="pre hidden">
- <button id="play-god">Play as God</button>
- <button id="play-runner">Play as Runner</button>
- </div>
-
- <div class="game hidden">
- <canvas id="game-canvas"></canvas>
- </div>
- </div>
-
- <script src="node_modules/jquery/dist/jquery.min.js"></script>
- <script src="node_modules/socksugar/client.js"></script>
- <script src="js/game.js"></script>
-
- <script>
- window.page = {
- switchTo: function(name, arg) {
- if (page.switchTo.prev)
- page.switchTo.prev.addClass("hidden");
-
- //We don't want to switch to a page if we're going to
- //switch again a couple of milliseconds later.
- if (page.switchTo.timeout)
- clearTimeout(page.switchTo.timeout);
- page.switchTo.timeout = setTimeout(function() {
- var elem = $("#sections > ."+name);
- elem.removeClass("hidden");
- if (arg)
- elem.children(".arg").html(arg);
- else
- elem.children(".ard").html("");
- page.switchTo.prev = elem;
- }, 150);
- }
- }
-
- window.game = null;
-
- function startGame(type) {
- page.switchTo(
- "loading",
- "Waiting for opponent..."
- );
-
- sock.send("game/start", {
- type: type
- }, function(err, res) {
- if (err)
- return page.switchTo("error", err);
-
- page.switchTo("game");
-
- window.game = new Game(
- $("#game-canvas")[0],
- res.players,
- res.index,
- sock
- );
- game.start();
-
- sock.on("gameover", function(data) {
- game.stop();
- page.switchTo("error", data.msg);
- });
- });
- }
-
- //Start with showincg a loading animation
- page.switchTo("loading");
-
- //Initiate a socket connection
- window.sock = new SockSugar("ws://weblet.mort.coffee:8083");
-
- //If we can't connect to the server, display an error
- var errTimeout = setTimeout(function() {
- page.switchTo("error", "Couldn't connect to the server.");
- }, 7000);
-
- sock.on("ready", function() {
- clearTimeout(errTimeout);
- page.switchTo("pre");
-
- $("#play-god").on("click", function() {
- startGame("god");
- });
-
- $("#play-runner").on("click", function() {
- startGame("runner");
- });
- });
- </script>
- </body>
- </html>
|