From 93c99274221c5d2271b8df5b9c97f5c93ed547fe Mon Sep 17 00:00:00 2001
From: hugogogo <hulamy@e3r2p8.clusters.42paris.fr>
Date: Fri, 16 Dec 2022 22:02:14 +0100
Subject: [PATCH] layout play for debug is better with toggle and replace

---
 tests_hugo/chat_node/chat_client/chat.html | 50 +++++++++++-----------
 1 file changed, 26 insertions(+), 24 deletions(-)
diff --git a/tests_hugo/chat_node/chat_client/chat.html b/tests_hugo/chat_node/chat_client/chat.html
index 5fcdbd6e..7a01e546 100644
--- a/tests_hugo/chat_node/chat_client/chat.html
+++ b/tests_hugo/chat_node/chat_client/chat.html
@@ -8,30 +8,23 @@
 
 	<body>
 
-		<br><br>            <button onclick="chat_layout(this.innerText)">close</button>
-		<br><br>            <button onclick="chat_layout(this.innerText)">home</button>
-		<br><br>            <button onclick="chat_layout(this.innerText)">room</button>
-		<br><br>            <button onclick="chat_layout(this.innerText)">new</button>
-		<br><br>            <button onclick="chat_layout(this.innerText)">settings</button>
-		<br><br>            <button onclick="chat_layout(this.innerText)">room_set</button>
-		<br><br>            <button onclick="chat_layout(this.innerText)">protected</button>
-		<br><br>            <button onclick="chat_layout(this.innerText)">create</button>
-		<br><br>            <button onclick="chat_layout(this.innerText)">user</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _blocked</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _admin</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _admin _muted</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _admin _blocked</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _admin _blocked _muted</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _blocked _muted</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _muted</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _room_set _blocked</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _room_set _admin</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _room_set _admin _muted</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _room_set _admin _blocked</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _room_set _admin _blocked _muted</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _room_set _blocked _muted</button>
-		<br><br>&nbsp;&nbsp;<button onclick="chat_layout(this.innerText)">user _room_set _muted</button>
-		<br><br>            <button onclick="chat_layout(this.innerText)">mute</button>
+	<form>
+		<br><br><button onclick="chat_layout(this.innerText)">close</button>
+		<br><br><button onclick="chat_layout(this.innerText)">home</button>
+		<br><br><button onclick="chat_layout(this.innerText)">room</button>
+		<br><br><button onclick="chat_layout(this.innerText)">new</button>
+		<br><br><button onclick="chat_layout(this.innerText)">settings</button>
+		<br><br><button onclick="chat_layout(this.innerText)">room_set</button>
+		<br><br><button onclick="chat_layout(this.innerText)">protected</button>
+		<br><br><button onclick="chat_layout(this.innerText)">create</button>
+		<br><br><button onclick="chat_layout(this.innerText)" type="reset">user</button>
+		<br><br><label><input onchange="chat_layout_toggle(this.nextElementSibling.innerText)" type="checkbox"><span>_blocked</span></label>
+		<br><br><label><input onchange="chat_layout_toggle(this.nextElementSibling.innerText)" type="checkbox"><span>_admin</span></label>
+		<br><br><label><input onchange="chat_layout_toggle(this.nextElementSibling.innerText)" type="checkbox"><span>_muted</span></label>
+		<br><br><label><input onchange="chat_layout_replace('_settings', '_room_set')" type="radio" name="form_from"><span>_room_set</span></label>
+		<br><br><label><input onchange="chat_layout_replace('_room_set', '_settings')" type="radio" name="form_from"><span>_settings</span></label>
+		<br><br><button onclick="chat_layout(this.innerText)">mute</button>
+	</form>
 
 		<div class="close" id="chat_box">
 		<!--
@@ -293,6 +286,15 @@
 			function chat_layout(layout_class) {
 				document.getElementById('chat_box').className = layout_class;
 			};
+			// TEMP
+			function chat_layout_toggle(layout_class) {
+				document.getElementById('chat_box').classList.toggle(layout_class);
+			};
+			function chat_layout_replace(_old, _new) {
+				let chat = document.getElementById('chat_box');
+				chat.classList.remove(_old);
+				chat.classList.add(_new);
+			};
 		</script>
 
 		<!-- https://socket.io/docs/v4/client-installation/ -->
