From e015a1d19a9fffa54b3b846b1444155e38a9a460 Mon Sep 17 00:00:00 2001 From: ebolam Date: Mon, 8 Aug 2022 13:55:12 -0400 Subject: [PATCH] Bias UI changes and UI Color Scheme updates --- koboldai_settings.py | 2 +- static/koboldai.css | 38 +++++++++++++++++++++++++++++++++- static/koboldai.js | 35 ++++++++++++++++++++++++++++++- templates/index_new.html | 30 +++++++++++++++++++++++++++ templates/settings flyout.html | 30 +-------------------------- 5 files changed, 103 insertions(+), 32 deletions(-) diff --git a/koboldai_settings.py b/koboldai_settings.py index 14e8e4b6..6b032dbb 100644 --- a/koboldai_settings.py +++ b/koboldai_settings.py @@ -249,7 +249,6 @@ class model_settings(settings): self.selected_preset = "" self.uid_presets = [] self.default_preset = {} - self.biases = {} # should look like {"phrase": [percent, max_occurances]} #dummy class to eat the tqdm output class ignore_tqdm(object): @@ -361,6 +360,7 @@ class story_settings(settings): self.dynamicscan = False self.recentedit = False self.notes = "" #Notes for the story. Does nothing but save + self.biases = {} # should look like {"phrase": [percent, max_occurances]} def save_story(self): print("Saving") diff --git a/static/koboldai.css b/static/koboldai.css index b4f3c186..19769567 100644 --- a/static/koboldai.css +++ b/static/koboldai.css @@ -10,7 +10,7 @@ } } -:root { +/* :root { --flyout_menu_closed_width: 0px; --background: #474B4F; --text: white; @@ -40,6 +40,37 @@ --wi_card_tag_bg_color: #404040; --wi_tag_color: #337ab7; +} */ + +:root { + --flyout_menu_closed_width: 0px; + --background: #222f39; + --text: white; + --text_to_ai_color: #CCECFF; + --text_edit: #cdf; + --flyout_background: #18222a; + --setting_background: #2c3a51; + --setting_text: white; + --tooltip_text: white; + --tooltip_background: #212734; + --gamescreen_background: #121a1e; + --textarea_background: #1a242b; + --options_background: #404040; + --enabled_button_text: #fff; + --enabled_button_background_color: #4259a0; + --enabled_button_border_color: #91acd4; + --popup_title_bar_color: #337ab7; + --popup_item_color: #262626; + --disabled_button_text: #303030; + --disabled_button_background_color: #495762; + --disabled_button_border_color: #686c68; + --menu_button_level_1_bg_color: #2b5471; + --menu_button_level_2_bg_color: #285070; + --wi_card_border_color: white; + --wi_card_border_color_to_ai: green; + --wi_card_bg_color: #262626; + --wi_card_tag_bg_color: #404040; + --wi_tag_color: #337ab7; } /*----------------Folder Tabs--------------------*/ @@ -1022,6 +1053,11 @@ button.disabled { font-weight: bold; } +textarea { + background-color: var(--textarea_background); + color: var(--text); +} + .pulse { box-shadow: 0 0 0 0 rgba(255, 255, 255, 1); animation: pulse-white 2s infinite; diff --git a/static/koboldai.js b/static/koboldai.js index bc1ee1a5..6fe9560d 100644 --- a/static/koboldai.js +++ b/static/koboldai.js @@ -372,6 +372,9 @@ function var_changed(data) { do_presets(data); } else if ((data.classname == 'story') && (data.name == 'prompt')) { do_prompt(data); + //Special Case for phrase biasing + } else if ((data.classname == 'story') && (data.name == 'biases')) { + do_biases(data); //Basic Data Syncing } else { var elements_to_change = document.getElementsByClassName("var_sync_"+data.classname.replace(" ", "_")+"_"+data.name.replace(" ", "_")); @@ -1274,7 +1277,9 @@ function save_bias(item) { //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.getElementsByClassName("bias")[0].cloneNode(true); + 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_percent").querySelector("input").value = 1; bias_line.querySelector(".bias_max").querySelector("input").value = 50; @@ -1337,6 +1342,34 @@ function send_world_info(uid) { } //--------------------------------------------General UI Functions------------------------------------ +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); + } + + //add our bias lines + for (const [key, value] of Object.entries(data.value)) { + bias_line = document.getElementById("empty_bias").cloneNode(true); + 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]; + document.getElementById('biasing').append(bias_line); + } + + //add another bias line if this is the phrase and it's not blank + 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_percent").querySelector("input").value = 1; + bias_line.querySelector(".bias_max").querySelector("input").value = 50; + document.getElementById('biasing').append(bias_line); +} + function update_bias_slider_value(slider) { slider.parentElement.parentElement.querySelector(".bias_slider_cur").textContent = slider.value; } diff --git a/templates/index_new.html b/templates/index_new.html index 5c7b3b97..6ba3c217 100644 --- a/templates/index_new.html +++ b/templates/index_new.html @@ -14,6 +14,7 @@ + @@ -98,6 +99,35 @@ +
+
+ +
+
+
+
+ +
+
0
+
1
+
1
+
+
+
+
+
+ +
+
0
+
50
+
50
+
+
+
\ No newline at end of file diff --git a/templates/settings flyout.html b/templates/settings flyout.html index fe08944c..7cf9702f 100644 --- a/templates/settings flyout.html +++ b/templates/settings flyout.html @@ -60,35 +60,7 @@
Percent Chance
Max Occurance
-
-
- -
-
-
-
- -
-
0
-
1
-
1
-
-
-
-
-
- -
-
0
-
50
-
50
-
-
-
+