Now scenes can be switched between game and mainmenu

www/scripts/interface/game/connection.js

@@ -1,12 +1,13 @@
+import {statusElement} from "/scripts/interface/game/html.js"
+
 export function updateConnectionStatus(connection) {
-	let obj = document.getElementById("status")
-	obj.textContent = `Server Connection: ${connection}`
+	statusElement.textContent = `Server Connection: ${connection}`
 	switch (connection) {
 		case "connected":
-		obj.style.color = "green";
+		statusElement.style.color = "green";
 			break;
 		case "disconnected":
-			obj.style.color = "red";
+			statusElement.style.color = "red";
 			break;
 
 	}

www/scripts/interface/game/html.js

@@ -0,0 +1,2 @@
+export let statusElement = document.getElementById("status")
+export let buttonBar = document.getElementById("buttonBar")

www/scripts/interface/game/picker.js

@@ -1,5 +1,5 @@
 import {tileArray} from "/scripts/display/tileRenderer.js"
-
+import {buttonBar} from "/scripts/interface/game/html.js"
 var button = 0;
 
 function clickSelector(e) {
@@ -33,7 +33,7 @@ for(let i=0;i < 5;i++) {
 	n = 5
 };
 	span.appendChild(tileArray[n]);
-	document.getElementById("buttonBar").appendChild(span);
+	buttonBar.appendChild(span);
 	span.no = i;
 	span.addEventListener('click', e => {
 			clickSelector(e);
@@ -44,3 +44,9 @@ for(let i=0;i < 5;i++) {
 export function getButton() {
 	return button;
 }
+
+export function destroy() {
+	while (buttonBar.lastChild) {
+		buttonBar.removeChild(buttonBar.lastChild)
+	}
+}

www/scripts/interface/mainmenu/menu.js

@@ -12,5 +12,5 @@ function submit(event) {
 	if (room == '' || name == '' || status.get() == 'disconnected') return
 	joinGame({room: room, name: name})
 	event.preventDefault();
-	changeScene()
+	changeScene("game")
 }

www/scripts/interface/scene.js

@@ -1,8 +1,14 @@
+import * as picker from "/scripts/interface/game/picker.js"
 
-import { create } from "/scripts/interface/game/picker.js"
-
-export function changeScene() {
+export function changeScene(scene) {
+	if (scene == "game") {
 		document.getElementById('menu').style = "display: none;"
 		document.getElementById('container').style = ""
-  create();
+	  picker.create();
+	}
+	if (scene == "mainmenu") {
+		document.getElementById('menu').style = ""
+		document.getElementById('container').style = "display: none;"
+		picker.destroy();
+	}
 };