From 6147311aaa6108bf119133fcc4ecc91f084fae43 Mon Sep 17 00:00:00 2001 From: Pierre Hubert Date: Mon, 23 Mar 2020 14:09:28 +0100 Subject: [PATCH] Start navigation inside project --- index.html | 28 ++++++++++++++++++ levels/1.json | 16 +++++++++++ levels/2.json | 18 ++++++++++++ script.js | 78 +++++++++++++++++++++++++++++++++++++++++++++++++++ server.sh | 2 ++ 5 files changed, 142 insertions(+) create mode 100644 index.html create mode 100644 levels/1.json create mode 100644 levels/2.json create mode 100644 script.js create mode 100755 server.sh diff --git a/index.html b/index.html new file mode 100644 index 0000000..674d1da --- /dev/null +++ b/index.html @@ -0,0 +1,28 @@ + + + + + + My Snake + + + +
+

My Snake

+ + Please choose a level: + + + +
+ + +
+

Game

+ + +
+ + + + \ No newline at end of file diff --git a/levels/1.json b/levels/1.json new file mode 100644 index 0000000..ae2c92d --- /dev/null +++ b/levels/1.json @@ -0,0 +1,16 @@ +{ + "dimensions": [80, 40], + "delay": 200, + "walls": [ + [5,5], [5,6], [5,7], [5,8], [70, 35], [71, 35], [72, 35] + ], + "food": [ + [10,10] + ], + "snake": [ + [60,60], + [60,59], + [60,58] + ] + +} \ No newline at end of file diff --git a/levels/2.json b/levels/2.json new file mode 100644 index 0000000..fe1e223 --- /dev/null +++ b/levels/2.json @@ -0,0 +1,18 @@ +{ + "dimensions": [80, 40], + "delay": 200, + "walls": [ + [5,5], [5,6], [5,7], [5,8], [70, 35], [71, 35], [72, 35] + ], + "food": [ + [10,10], + [10,11], + [10,12] + ], + "snake": [ + [60,60], + [60,59], + [60,58] + ] + +} \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..74a1bb2 --- /dev/null +++ b/script.js @@ -0,0 +1,78 @@ +const number_levels = 2; + +function byId(el) { + return document.getElementById(el); +} + +// Get elements +const startScreen = byId("startScreen") +const gameScreen = byId("gameScreen") +const levelChoicesTarget = byId("levelChoice") +const startGameBtn = byId("startGameBtn") +const stopGameBtn = byId("stopGameBtn") + + +/** + * Show main screen + */ +function showMainScreen() { + startScreen.style.display = "unset"; + gameScreen.style.display = "none"; +} + +/** + * Start a new game + */ +async function startGame(gameID) { + startScreen.style.display = "none"; + gameScreen.style.display = "unset"; +} + +/** + * Change the currently active window + */ +function changeWindow() { + + // Try to get game ID + const gameID = Number(window.location.hash.substr(1)); + + if(gameID > 0) + startGame(gameID); + else + showMainScreen(); +} + + + + + + + +// Initialize page + +/// Listen to events +window.addEventListener("hashchange", (e) => changeWindow()) + + +// Make game levels form lives +for (let index = 1; index < number_levels + 1; index++) { + levelChoicesTarget.innerHTML += "
  • " + + "" + + " Level " + index + "
    • "; +} + +startGameBtn.addEventListener("click", (ev) => { + ev.preventDefault(); + + const gameID = document.querySelector("input[name='level']:checked").value + location.href = "#" + gameID; +}) + + +// Stop game +stopGameBtn.addEventListener("click", () => { + location.href = "#"; +}) + +// Refresh current window +changeWindow(); \ No newline at end of file diff --git a/server.sh b/server.sh new file mode 100755 index 0000000..1628f97 --- /dev/null +++ b/server.sh @@ -0,0 +1,2 @@ +#!/bin/bash +python3 -m http.server 3006 \ No newline at end of file