diff --git a/satiate.css b/satiate.css index fe18253..fa83d96 100644 --- a/satiate.css +++ b/satiate.css @@ -111,19 +111,20 @@ html, body { } .move-button { + user-select: none; background-color: #888; color: #eee; border-radius: 5px; + font-size: 24px; } -.disabled { - background-color: gray; - background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255,255,255,.5) 35px, rgba(255,255,255,.5) 70px); +.move-button:focus { + outline: 0px; } -.move-button > span { - display: inline-block; - font-size: 24px; +.disabled { + background-color: #444; + border: none; } #move-up-left { @@ -174,7 +175,7 @@ html, body { top: 180px; } -#move-climb { +#move-ascend { position: absolute; left: -200px; top: 300px; @@ -185,3 +186,7 @@ html, body { left: 200px; top: 300px; } + +#area-name { + font-size: 36px; +} diff --git a/satiate.html b/satiate.html index d766811..9b99b37 100644 --- a/satiate.html +++ b/satiate.html @@ -6,6 +6,7 @@ Satiate + @@ -29,7 +30,8 @@ this is the log
@@ -45,16 +47,16 @@
beep beep
- - - - - - - - - - + + + + + + + + + +
diff --git a/world.js b/world.js new file mode 100644 index 0000000..0e4fd8c --- /dev/null +++ b/world.js @@ -0,0 +1,49 @@ +dirs = { + "up-left": "Northwest", + "up": "North", + "up-right": "Northeast", + "left": "West", + "right": "East", + "down-left": "Southwest", + "down": "South", + "down-right": "Southeast", + "ascend": "Up", + "descend": "Down" +} + +function updateRoom(dest) { + const room = world[dest]; + + const areaName = document.querySelector("#area-name"); + const areaDesc = document.querySelector("#area-desc"); + + areaName.innerText = room.name; + areaDesc.innerText = room.desc; + + document.querySelectorAll(".move-button").forEach(button => { + const dir = button.id.replace("move-", ""); + button.classList.add("disabled"); + button.innerText = dirs[dir]; + }); + + Object.entries(room.exits).forEach(([dir, val]) => { + const button = document.querySelector("#move-" + dir); + + button.classList.remove("disabled"); + + button.innerText = val.target; + }); +} + +world = { + "Home": { + "name": "Home", + "desc": "Where the wifi autoconnects", + "exits": { + "up": { + "target": "Dennis", + "desc": "The obvious exit, but better." + } + } + } +}