From 7c35b702220ed59c192e40d09d14d9fef2a42945 Mon Sep 17 00:00:00 2001
From: ebolam <ebolam@gmail.com>
Date: Mon, 8 Aug 2022 14:20:47 -0400
Subject: [PATCH] Bias UI complete

---
 static/koboldai.css            |  6 ++++++
 static/koboldai.js             | 38 ++++++++++++----------------------
 templates/settings flyout.html | 32 +++++++++++++---------------
 3 files changed, 33 insertions(+), 43 deletions(-)

diff --git a/static/koboldai.css b/static/koboldai.css
index 1029a1ed..52643742 100644
--- a/static/koboldai.css
+++ b/static/koboldai.css
@@ -418,15 +418,21 @@
 .bias_slider_min {
 	grid-area: min;
 	font-size: x-small;
+	margin-right: 5px;
+	margin-left: 5px;
 }
 
 .bias_slider_cur {
 	grid-area: cur;
+	text-align: center;
 }
 
 .bias_slider_max {
 	grid-area: max;
 	font-size: x-small;
+	text-align: right;
+	margin-right: 5px;
+	margin-left: 5px;
 }
 
 .bias_header {
diff --git a/static/koboldai.js b/static/koboldai.js
index 10007ba1..5ead9ef2 100644
--- a/static/koboldai.js
+++ b/static/koboldai.js
@@ -1257,7 +1257,7 @@ function save_bias(item) {
 		//phrase
 		var phrase = bias.querySelector(".bias_phrase").querySelector("input").value;
 		
-		//percent
+		//Score
 		var percent = parseFloat(bias.querySelector(".bias_score").querySelector("input").value);
 		
 		//completion threshold
@@ -1265,29 +1265,13 @@ function save_bias(item) {
 		
 		if (phrase != "") {
 			biases[phrase] = [percent, comp_threshold];
-		} else {
-			//mark that we have a blank line, or delete it if we have more than one
-			if (have_blank) {
-				bias.remove();
-			} else {
-				have_blank = true;
-			}
 		}
-	}
-	//add another bias line if this is the phrase and it's not blank
-	if ((item.tagName == "INPUT") & !(have_blank)) {
-		console.log("Create new bias line");
-		bias_line = document.getElementById("empty_bias").cloneNode(true);
-		bias_line.id = "";
-		bias_line.classList.add("bias");
-		bias_line.querySelector(".bias_phrase").querySelector("input").value = "";
-		bias_line.querySelector(".bias_score").querySelector("input").value = 0;
-		bias_line.querySelector(".bias_comp_threshold").querySelector("input").value = 50;
-		document.getElementById('biasing').append(bias_line);
+		bias.classList.add("pulse");
 	}
 	
 	//send the biases to the backend
 	socket.emit("phrase_bias_update", biases);
+	
 }
 
 function sync_to_server(item) {
@@ -1345,8 +1329,10 @@ function send_world_info(uid) {
 function do_biases(data) {
 	console.log(data);
 	//clear out our old bias lines
-	while (document.getElementsByClassName("bias").firstChild) {
-		document.getElementsByClassName("bias").removeChild(document.getElementsByClassName("bias").firstChild);
+	let bias_list = Object.assign([], document.getElementsByClassName("bias"));
+	for (item of bias_list) {
+		console.log(item);
+		item.parentNode.removeChild(item);
 	}
 	
 	//add our bias lines
@@ -1355,8 +1341,10 @@ function do_biases(data) {
 		bias_line.id = "";
 		bias_line.classList.add("bias");
 		bias_line.querySelector(".bias_phrase").querySelector("input").value = key;
-		bias_line.querySelector(".bias_percent").querySelector("input").value = value[0];
-		bias_line.querySelector(".bias_max").querySelector("input").value = value[1];
+		bias_line.querySelector(".bias_score").querySelector("input").value = value[0];
+		update_bias_slider_value(bias_line.querySelector(".bias_score").querySelector("input"));
+		bias_line.querySelector(".bias_comp_threshold").querySelector("input").value = value[1];
+		update_bias_slider_value(bias_line.querySelector(".bias_comp_threshold").querySelector("input"));
 		document.getElementById('biasing').append(bias_line);
 	}
 	
@@ -1365,8 +1353,8 @@ function do_biases(data) {
 	bias_line.id = "";
 	bias_line.classList.add("bias");
 	bias_line.querySelector(".bias_phrase").querySelector("input").value = "";
-	bias_line.querySelector(".bias_percent").querySelector("input").value = 1;
-	bias_line.querySelector(".bias_max").querySelector("input").value = 50;
+	bias_line.querySelector(".bias_score").querySelector("input").value = 1;
+	bias_line.querySelector(".bias_comp_threshold").querySelector("input").value = 50;
 	document.getElementById('biasing').append(bias_line);
 }
 
diff --git a/templates/settings flyout.html b/templates/settings flyout.html
index 6dc4a1fb..8b89d79b 100644
--- a/templates/settings flyout.html	
+++ b/templates/settings flyout.html	
@@ -46,6 +46,20 @@
 		{% include 'settings item.html' %}
 	{% endwith %}
 	</div>
+</div>
+<div id="setting_menu_story" class="hidden settings_category_area">
+	<div id="Story_Info">
+		<div>Story Name: <span class="var_sync_story_story_name"></span></div>
+		<div>
+			<button id="load_story" class="btn action_button" onclick="socket.emit('load_story_list', '');">Load Story</button>
+			<button id="save_story" class="btn action_button var_sync_alt_story_gamesaved" onclick='socket.emit("save_story", "");'>Save Story</button>
+		</div>
+	</div>
+	<div class="setting_tile_area">
+	{% with menu='Story' %}
+		{% include 'settings item.html' %}
+	{% endwith %}
+	</div>
 	<h4>
 		<span id="bias_open" class="oi" data-glyph="chevron-bottom" onclick='this.classList.add("hidden"); 
 																			 document.getElementById("bias_close").classList.remove("hidden"); 
@@ -60,24 +74,6 @@
 			<div class="bias_header_score">Score</div>
 			<div class="bias_header_comp_threshold">Completion Threshold</div>
 		</div>
-		
-		
-	</div>
-</div>
-<div id="setting_menu_story" class="hidden settings_category_area">
-	<div id="Story_Info">
-		<div>Story Name: <span class="var_sync_story_story_name"></span></div>
-		<div>
-			<button id="load_story" class="btn action_button" onclick="socket.emit('load_story_list', '');">Load Story</button>
-			<button id="save_story" class="btn action_button var_sync_alt_story_gamesaved" onclick='socket.emit("save_story", "");'>Save Story</button>
-		</div>
-
-		
-	</div>
-	<div class="setting_tile_area">
-	{% with menu='Story' %}
-		{% include 'settings item.html' %}
-	{% endwith %}
 	</div>
 </div>
 <div id="setting_menu_user" class="hidden settings_category_area">