rixty/KoboldAI-Client
1
1
Fork 0
mirror of https://github.com/KoboldAI/KoboldAI-Client.git synced 2025-06-05 21:59:24 +02:00
Code Issues Projects Releases Wiki Activity

Merge pull request #458 from ebolam/Model_Plugins

Browse Source 
UI2 visual fixes
This commit is contained in:
henk717
2023-09-08 03:17:02 +02:00
committed by GitHub
parent e0e00e0fae 8e914f5d46
commit 81d4aa53e4
3 changed files with 57 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
static/koboldai.css
View File

@@ -443,7 +443,7 @@ border-top-right-radius: var(--tabs_rounding);
position: fixed; position: fixed;
top:10px; top:10px;
left: 5px; left: 5px;
z-index:50; z-index:21;
display: inline-block; display: inline-block;
cursor: pointer; cursor: pointer;
} }
@@ -465,7 +465,7 @@ border-top-right-radius: var(--tabs_rounding);
position: absolute; position: absolute;
top:10px; top:10px;
left: calc(var(--flyout_menu_width) - 20px); left: calc(var(--flyout_menu_width) - 20px);
z-index:50; z-index:21;
width: 25px; width: 25px;
height: 25px; height: 25px;
color: #999; color: #999;
@@ -492,7 +492,7 @@ border-top-right-radius: var(--tabs_rounding);
top:8px; top:8px;
color: var(--text); color: var(--text);
left: calc(var(--flyout_menu_width) - 133px); left: calc(var(--flyout_menu_width) - 133px);
z-index:50; z-index:21;
width: 25px; width: 25px;
height: 25px; height: 25px;
display: inline-block; display: inline-block;
@@ -502,7 +502,7 @@ border-top-right-radius: var(--tabs_rounding);
.SideMenu { .SideMenu {
height: 100%; height: 100%;
z-index: 4; z-index: 20;
color: var(--flyout_text); color: var(--flyout_text);
width: var(--flyout_menu_width); width: var(--flyout_menu_width);
box-shadow: var(--left_menu_strong_shadow); box-shadow: var(--left_menu_strong_shadow);
@@ -900,7 +900,7 @@ border-top-right-radius: var(--tabs_rounding);
position: fixed; position: fixed;
top:10px; top:10px;
right: 5px; right: 5px;
z-index:50; z-index:11;
display: inline-block; display: inline-block;
cursor: pointer; cursor: pointer;
grid-area: lefticon; grid-area: lefticon;
@@ -914,12 +914,11 @@ border-top-right-radius: var(--tabs_rounding);
} }
.rightSideMenu { .rightSideMenu {
z-index: 3;
height: 100%; height: 100%;
position: fixed; position: fixed;
color: var(--flyout_text); color: var(--flyout_text);
box-shadow: var(--right_menu_strong_shadow); box-shadow: var(--right_menu_strong_shadow);
z-index: 3; z-index: 10;
top: 0; top: 0;
right: 0; right: 0;
background-color: var(--flyout_background); background-color: var(--flyout_background);
@@ -2874,9 +2873,12 @@ body {
} }
.welcome_container { .welcome_container {
position: absolute;
height: 100%; height: 100%;
width: 100%;
display: flex; display: flex;
margin-top: auto; margin-top: auto;
padding-bottom: 10px;
} }
#welcome_text { #welcome_text {

74
static/koboldai.js
View File

@@ -957,7 +957,6 @@ function var_changed(data) {
if (current_action <= 0) { if (current_action <= 0) {
//console.log("setting action_count to "+current_action); //console.log("setting action_count to "+current_action);
const storyPrompt = $el("#story_prompt"); const storyPrompt = $el("#story_prompt");
if (storyPrompt) storyPrompt.classList.remove("hidden");
scroll_trigger_element = undefined; scroll_trigger_element = undefined;
document.getElementById("Selected Text").onscroll = undefined; document.getElementById("Selected Text").onscroll = undefined;
} }
@@ -1807,31 +1806,6 @@ function model_settings_checker() {
valid = (check_value < this.check_data['value']); valid = (check_value < this.check_data['value']);
} }
if (valid || missing_element) { if (valid || missing_element) {
//if we are supposed to refresh when this value changes we'll resubmit
if ((this.getAttribute("refresh_model_inputs") == "true") && !missing_element && !this.noresubmit) {
//get an object of all the input settings from the user
data = {}
settings_area = document.getElementById(document.getElementById("modelplugin").value + "_settings_area");
if (settings_area) {
for (const element of settings_area.querySelectorAll(".model_settings_input:not(.hidden)")) {
var element_data = element.value;
if (element.getAttribute("data_type") == "int") {
element_data = parseInt(element_data);
} else if (element.getAttribute("data_type") == "float") {
element_data = parseFloat(element_data);
} else if (element.getAttribute("data_type") == "bool") {
element_data = element.checked;
}
data[element.id.split("|")[1].replace("_value", "")] = element_data;
}
}
data = {...data, ...selected_model_data};
data['plugin'] = document.getElementById("modelplugin").value;
data['valid_backends'] = getOptions("modelplugin");
socket.emit("resubmit_model_info", data);
}
if ('sum' in this.check_data) { if ('sum' in this.check_data) {
for (const temp of this.check_data['sum']) { for (const temp of this.check_data['sum']) {
if (document.getElementById(this.id.split("|")[0] +"|" + temp + "_value")) { if (document.getElementById(this.id.split("|")[0] +"|" + temp + "_value")) {
@@ -1900,6 +1874,32 @@ function model_settings_checker() {
} }
//if we are supposed to refresh when this value changes we'll resubmit
if ((this != window) && (this.getAttribute("refresh_model_inputs") == "true") && !missing_element && !this.noresubmit) {
//get an object of all the input settings from the user
data = {}
settings_area = document.getElementById(document.getElementById("modelplugin").value + "_settings_area");
if (settings_area) {
for (const element of settings_area.querySelectorAll(".model_settings_input:not(.hidden)")) {
var element_data = element.value;
if (element.getAttribute("data_type") == "int") {
element_data = parseInt(element_data);
} else if (element.getAttribute("data_type") == "float") {
element_data = parseFloat(element_data);
} else if (element.getAttribute("data_type") == "bool") {
element_data = element.checked;
}
data[element.id.split("|")[1].replace("_value", "")] = element_data;
}
}
data = {...data, ...selected_model_data};
data['plugin'] = document.getElementById("modelplugin").value;
data['valid_backends'] = getOptions("modelplugin");
socket.emit("resubmit_model_info", data);
}
} }
function set_toggle(id) { function set_toggle(id) {
@@ -3388,6 +3388,10 @@ function gametextwatcher(records) {
if (!dirty_chunks.includes("game_text")) { if (!dirty_chunks.includes("game_text")) {
dirty_chunks.push("game_text"); dirty_chunks.push("game_text");
} }
} else if ((record.target.nodeName == "#text") && (record.target.parentNode == game_text)) {
if (!dirty_chunks.includes("game_text")) {
dirty_chunks.push("game_text");
}
} }
} }
} }
@@ -3427,17 +3431,20 @@ function fix_dirty_game_text() {
} else { } else {
node_text = node.data; node_text = node.data;
} }
if (!(node.nextElementSibling) || !(dirty_chunks.includes(node.nextElementSibling.getAttribute("chunk"))) || dirty_chunks.includes(node.previousElementSibling.getAttribute("chunk"))) { if ((!(node.nextElementSibling) || !(dirty_chunks.includes(node.nextElementSibling.getAttribute("chunk"))) || dirty_chunks.includes(node.previousElementSibling.getAttribute("chunk"))) && (node.previousElementSibling)) {
node.previousElementSibling.innerText = node.previousElementSibling.innerText + node_text; node.previousElementSibling.innerText = node.previousElementSibling.innerText + node_text;
if (!dirty_chunks.includes(node.previousElementSibling.getAttribute("chunk"))) { if (!dirty_chunks.includes(node.previousElementSibling.getAttribute("chunk"))) {
dirty_chunks.push(node.previousElementSibling.getAttribute("chunk")); dirty_chunks.push(node.previousElementSibling.getAttribute("chunk"));
} }
} else { } else {
node.nextElementSibling.innerText = node.nextElementSibling.innerText + node_text; node.nextElementSibling.innerText = node.nextElementSibling.innerText + node_text;
if (!dirty_chunks.includes(node.nextElementSibling.getAttribute("chunk"))) {
dirty_chunks.push(node.nextElementSibling.getAttribute("chunk"));
}
} }
//Looks like sometimes it splits the parent. Let's look for that and fix it too //Looks like sometimes it splits the parent. Let's look for that and fix it too
if (node.nextElementSibling && (node.nextElementSibling.getAttribute("chunk") == node.previousElementSibling.getAttribute("chunk"))) { if (node.nextElementSibling && node.previousElementSibling && (node.nextElementSibling.getAttribute("chunk") == node.previousElementSibling.getAttribute("chunk"))) {
node.previousElementSibling.innerText = node.previousElementSibling.innerText + node.nextElementSibling.innerText; node.previousElementSibling.innerText = node.previousElementSibling.innerText + node.nextElementSibling.innerText;
node.nextElementSibling.remove(); node.nextElementSibling.remove();
} }
@@ -6100,6 +6107,17 @@ function closePopups(userAction=false) {
if (allHidden) container.classList.add("hidden"); if (allHidden) container.classList.add("hidden");
} }
function hide_welcome_container() {
welcome_container = document.getElementById("welcome_container");
welcome_container.classList.add("hidden");
document.getElementById("Selected Text").focus();
}
function show_welcome_container() {
welcome_container = document.getElementById("welcome_container");
welcome_container.classList.remove("hidden");
}
$el("#popup-container").addEventListener("click", function(event) { $el("#popup-container").addEventListener("click", function(event) {
if (event.target === this) closePopups(true); if (event.target === this) closePopups(true);
}); });

4
templates/index_new.html
View File

@@ -49,12 +49,12 @@
<div class="gamescreen" id="gamescreen" context-menu="gamescreen"> <div class="gamescreen" id="gamescreen" context-menu="gamescreen">
<div id="disconnect_message"><center><h1>Disconnected</h1></center></div> <div id="disconnect_message"><center><h1>Disconnected</h1></center></div>
<div id="welcome_container" class="welcome_container"> <div id="welcome_container" class="welcome_container" onclick="hide_welcome_container();">
<div id="welcome_text" class="var_sync_model_welcome" draggable="False"></div> <div id="welcome_text" class="var_sync_model_welcome" draggable="False"></div>
</div> </div>
<div class="gametext" id="Selected Text" contenteditable="false" tabindex="0" onkeyup="return set_edit(event);"> <div class="gametext" id="Selected Text" contenteditable="false" tabindex="0" onkeyup="return set_edit(event);">
<span id="story_prompt" class="var_sync_story_prompt var_sync_alt_story_prompt_in_ai rawtext hidden" chunk="-1"></span></div><!--don't move the /div down or it'll cause odd spacing issues in the UI---> <span id="story_prompt" class="var_sync_story_prompt var_sync_alt_story_prompt_in_ai rawtext" chunk="-1"></span></div><!--don't move the /div down or it'll cause odd spacing issues in the UI--->
</div> </div>
<!------------ Sequences ---------------------> <!------------ Sequences --------------------->