From c406819dce421e4b211cf2849fe52496bdcdbab7 Mon Sep 17 00:00:00 2001
From: Alexander Bass <contact@alexanderbass.com>
Date: Sun, 19 Jun 2022 20:38:09 -0400
Subject: [PATCH] Now scenes can be switched between game and mainmenu

---
 www/scripts/display/canvas.js            |  0
 www/scripts/display/hud.js               |  0
 www/scripts/interface/game/connection.js |  9 +++++----
 www/scripts/interface/game/html.js       |  2 ++
 www/scripts/interface/game/picker.js     | 10 ++++++++--
 www/scripts/interface/mainmenu/menu.js   |  2 +-
 www/scripts/interface/scene.js           | 18 ++++++++++++------
 7 files changed, 28 insertions(+), 13 deletions(-)
 delete mode 100644 www/scripts/display/canvas.js
 delete mode 100644 www/scripts/display/hud.js
 create mode 100644 www/scripts/interface/game/html.js

diff --git a/www/scripts/display/canvas.js b/www/scripts/display/canvas.js
deleted file mode 100644
index e69de29..0000000
diff --git a/www/scripts/display/hud.js b/www/scripts/display/hud.js
deleted file mode 100644
index e69de29..0000000
diff --git a/www/scripts/interface/game/connection.js b/www/scripts/interface/game/connection.js
index 8f9bc97..e9fc134 100644
--- a/www/scripts/interface/game/connection.js
+++ b/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;
 
 	}
diff --git a/www/scripts/interface/game/html.js b/www/scripts/interface/game/html.js
new file mode 100644
index 0000000..40bb2f5
--- /dev/null
+++ b/www/scripts/interface/game/html.js
@@ -0,0 +1,2 @@
+export let statusElement = document.getElementById("status")
+export let buttonBar = document.getElementById("buttonBar")
diff --git a/www/scripts/interface/game/picker.js b/www/scripts/interface/game/picker.js
index 23b66ff..a679908 100644
--- a/www/scripts/interface/game/picker.js
+++ b/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)
+	}
+}
diff --git a/www/scripts/interface/mainmenu/menu.js b/www/scripts/interface/mainmenu/menu.js
index c681a47..67f4ce2 100644
--- a/www/scripts/interface/mainmenu/menu.js
+++ b/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")
 }
diff --git a/www/scripts/interface/scene.js b/www/scripts/interface/scene.js
index 31a7f7d..7796e97 100644
--- a/www/scripts/interface/scene.js
+++ b/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() {
-	document.getElementById('menu').style = "display: none;"
-	document.getElementById('container').style = ""
-  create();
+export function changeScene(scene) {
+	if (scene == "game") {
+		document.getElementById('menu').style = "display: none;"
+		document.getElementById('container').style = ""
+	  picker.create();
+	}
+	if (scene == "mainmenu") {
+		document.getElementById('menu').style = ""
+		document.getElementById('container').style = "display: none;"
+		picker.destroy();
+	}
 };