let the users pin the box to 1 style if they want

2 files changed, 28 insertions, 7 deletions

diff --git a/webAO/client.html b/webAO/client.html
index 15495e6..19a6344 100644
--- a/webAO/client.html
+++ b/webAO/client.html
@@ -331,13 +331,25 @@
 					onchange="changeBlipVolume()">
 			<br>
 			<br>
-			<label for="client_themeselect">Theme:</label>
+			<label for="client_themeselect">Menu theme:</label>
 			<select id="client_themeselect" name="client_themeselect" onchange="reloadTheme()">
 				<option value="default" selected>Default</option>
 				<option value="classic">Classic</option>
 				<option value="soj">DD / SoJ</option>
 				<option value="cyber">Cyber (WIP)</option>
 			</select>
+			<br>
+			<br>
+			<label for="client_chatboxselect">Chatbox theme:</label>
+			<select id="client_chatboxselect" name="client_chatboxselect" onchange="setChatbox()">
+				<option value="dynamic" selected>Use characters</option>
+				<option value="aa">AA</option>
+				<option value="chatdd">DD / SoJ</option>
+				<option value="dgs">DGS</option>
+				<option value="triology">Triology</option>
+				<option value="drae">Dangan Ronpa</option>
+				<option value="yttd">YTTD</option>
+			</select>
 			<!--
 			<br>
 			<br>
diff --git a/webAO/client.js b/webAO/client.js
index c44ed74..dace52b 100644
--- a/webAO/client.js
+++ b/webAO/client.js
@@ -1641,12 +1641,7 @@ async changeBackground(position) {
 
 		this.changeBackground(chatmsg.side);
 
-		const chatbox_theme = document.getElementById("chatbox_theme");
-		if (chatbox_arr.includes(chatmsg.chatbox)) {
-			chatbox_theme.href = "styles/chatbox/" + chatmsg.chatbox + ".css";
-		} else {
-			chatbox_theme.href = "styles/chatbox/aa.css";
-		}
+		setChatbox(chatmsg.chatbox);
 		resizeChatbox();
 
 		// Flip the character
@@ -2438,6 +2433,20 @@ export function getIndexFromSelect(select_box, value) {
 }
 window.getIndexFromSelect = getIndexFromSelect;
 
+export function setChatbox(style) {
+	const chatbox_theme = document.getElementById("chatbox_theme");
+	const selected_theme = document.getElementById("client_chatboxselect").value;
+	if(selected_theme === "dynamic") {
+		if (chatbox_arr.includes(style)) {
+			chatbox_theme.href = "styles/chatbox/" + style + ".css";
+		} else {
+			chatbox_theme.href = "styles/chatbox/aa.css";
+		}
+	} else {
+		chatbox_theme.href = "styles/chatbox/" + selected_theme + ".css";
+	}
+}
+
 /**
  * Set the font size for the chatbox
  */