From 91de451eba2d76a0c7083b25678ba5fb908ae79a Mon Sep 17 00:00:00 2001
From: ebolam <ebolam@gmail.com>
Date: Fri, 12 Aug 2022 10:10:08 -0400
Subject: [PATCH] Added button to make navigation to new UI simpler from old UI

---
 static/koboldai.css            |  2 --
 templates/index.html           |  1 +
 templates/settings flyout.html | 40 +++++++++++++++++-----------------
 3 files changed, 21 insertions(+), 22 deletions(-)

diff --git a/static/koboldai.css b/static/koboldai.css
index 74986f20..367b80a4 100644
--- a/static/koboldai.css
+++ b/static/koboldai.css
@@ -516,8 +516,6 @@
 }
 
 .story_title_area {
-	display: flex;
-	justify-content: space-between;
 }
 
 .story_title_area .var_sync_story_story_name {
diff --git a/templates/index.html b/templates/index.html
index 6acab35f..40866a05 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -100,6 +100,7 @@
 				<div id="connectstatusdiv" class="flex-row-container">
 					<span id="connectstatus" class="color_orange flex-row">Waiting for connection...</span>
 					<div class="layer-container status-container flex-push-left" style="color: #FFFFFF;" id="runtime"></div>
+					<span><button class="btn btn-primary" onclick="window.location='/new_ui'">Try New UI</button></span>
 					<div class="layer-container status-container flex-push-right">
 						<span class="oi oi-puzzle-piece statusicon layer-bottom" aria-hidden="true">
 							<div class="statustext statustext-wide">
diff --git a/templates/settings flyout.html b/templates/settings flyout.html
index de7f35a9..66e809c6 100644
--- a/templates/settings flyout.html	
+++ b/templates/settings flyout.html	
@@ -27,42 +27,28 @@
 <!-- top menu bar-->
 <div class="menu_pin_area"></div>
 <div class="tabrow">
-	<span class="setting_menu_button selected" onclick="show_setting_menu(this);">Model</span>
-	<span class="setting_menu_button" onclick="show_setting_menu(this);">Story</span>
+	<span class="setting_menu_button selected" onclick="show_setting_menu(this);">Story</span>
+	<span class="setting_menu_button" onclick="show_setting_menu(this);">Model</span>
 	<span class="setting_menu_button" onclick="show_setting_menu(this);">User</span>
 	<span class="setting_menu_button" onclick="show_setting_menu(this);">UI</span>
 	<span style="float: right;margin-right: 30px;" onclick="window.open('https://github.com/KoboldAI/KoboldAI-Client/wiki');">Help</span>
 </div>
 <div class="flyout_menu_contents">
 
-	<div id="setting_menu_model" class="settings_category_area">
-		<div id="Model_Info">
-			<div>
-				Running Model: <span class="var_sync_model_model">ReadOnly</span>
-				<select id=presets class="var_sync_model_selected_preset settings_select presets" onchange='sync_to_server(this)'><option>Preset</option></select>
-			</div>
-			<div><button class="btn action_button" onclick="socket.emit('load_model_button', {});">Load Model</button></div>
-		</div>
-		<div class="setting_tile_area">
-		{% with menu='Model' %}
-			{% include 'settings item.html' %}
-		{% endwith %}
-		</div>
-	</div>
-	<div id="setting_menu_story" class="hidden settings_category_area">
+	<div id="setting_menu_story" class="settings_category_area">
 		<div id="Story_Info">
 			<hr/>
 			<div class="story_title_area">
 				<span class="story_title">
 					<b>Story Name: </b>
-					<span class="var_sync_story_story_name" contenteditable=true onblur="sync_to_server(this);"></span>
+					<span class="var_sync_story_story_name fullwidth" contenteditable=true onblur="sync_to_server(this);"></span>
 				</span>
-				<span class="story_title_icons">
+				<div class="story_title_icons">
 					<span class="material-icons-outlined cursor" title="Load Story" onclick="socket.emit('load_story_list', '');">file_open</span>
 					<span class="material-icons-outlined cursor var_sync_alt_story_gamesaved" title="Save Story">save</span>
 					<span class="material-icons-outlined cursor" title="Import Story">cloud_download</span>
 					<span class="material-icons-outlined cursor" title="Download Story" onclick="document.getElementById('download_iframe').src = 'json';">file_download</span>
-				</span>
+				</div>
 			</div>
 			<hr/>
 		</div>
@@ -87,6 +73,20 @@
 			</div>
 		</div>
 	</div>
+	<div id="setting_menu_model" class="hidden settings_category_area">
+		<div id="Model_Info">
+			<div>
+				Running Model: <span class="var_sync_model_model">ReadOnly</span>
+				<select id=presets class="var_sync_model_selected_preset settings_select presets" onchange='sync_to_server(this)'><option>Preset</option></select>
+			</div>
+			<div><button class="btn action_button" onclick="socket.emit('load_model_button', {});">Load Model</button></div>
+		</div>
+		<div class="setting_tile_area">
+		{% with menu='Model' %}
+			{% include 'settings item.html' %}
+		{% endwith %}
+		</div>
+	</div>
 	<div id="setting_menu_user" class="hidden settings_category_area">
 		<div class="setting_tile_area">
 		{% with menu='User' %}