layout changed

client/css/main.css

@@ -23,6 +23,11 @@ body {
     align-items: center;
     justify-content: center;
     position: absolute;
+    flex-direction: column;
+}
+
+#mapeditor {
+    margin-top: 2rem;
 }
 
 .rotate90 {

client/index.html

@@ -14,7 +14,8 @@
                 <input type="text" id="player_name" name="name" placeholder="Player Name">
                 <input type="submit" value="Join!"/>
             </form>
-            <div id="lobby">
+            <input id="mapeditor" type="button" value="Map Editor">
+            <div id="lobby" style="display: none;">
                 <span>Players:</span>
                 <div id="players"></div>
                 <input type="button" id="start" value="Start Game"/>

client/mapeditor.html

@@ -16,7 +16,7 @@
                 <input type="submit" value="Create"/>
             </form>
         </div>
-        <div id="sidebar">
+        <div id="sidebar" style="display: none;">
             <p>W: Place Wall</p>
             <p>G: Place Ghost Wall</p>
             <p>F: Place Food</p>

client/src/editor.ts

@@ -1,10 +1,9 @@
 import { genMap } from "./map.js"
 import { startGraphicsUpdater } from "./renderer.js"
-import { GameState, Vec2, ATLAS_TILE_WIDTH, Tile } from "./types.js"
+import { GameState, Vec2, Tile } from "./types.js"
 
 const mapgen = document.getElementById("mapgen")
 const sidebar = document.getElementById("sidebar")
-sidebar.style.display = "none"
 
 mapgen.onsubmit = async function(event) {
     event.preventDefault()

client/src/main.ts

@@ -5,7 +5,7 @@ import { GameKeyMap, Frame, Key } from "./types.js";
 
 const join = document.getElementById("join")
 const lobby = document.getElementById("lobby")
-lobby.style.display = "none"
+const mapeditor = document.getElementById("mapeditor")
 
 join.onsubmit = async function(event) {
     event.preventDefault()
@@ -24,10 +24,15 @@ join.onsubmit = async function(event) {
     }
 
     join.style.display = "none"
+    mapeditor.style.display = "none"
 
     startGame(room_code, player_name)
 }
 
+mapeditor.onclick = function() {
+    window.location.href = 'mapeditor.html'
+}
+
 const updateGraphics = startGraphicsUpdater()
 
 const onLoad = (startData: Frame) => {

client/src/net/multiplayer.ts

@@ -179,8 +179,7 @@ export function multiplayer(
 					}
 					if (!flushCachedInputs(delta / 2)) {
                         socket.close()
-                        document.getElementById("lobby").style.display = "none"
-                        document.getElementById("join").style.display = ""
+                        window.location.reload()
                         return
                     }
 				}