Merge pull request #458 from ebolam/Model_Plugins

UI2 visual fixes
This commit is contained in:
henk717
2023-09-08 03:17:02 +02:00
committed by GitHub
3 changed files with 57 additions and 37 deletions

View File

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

View File

@@ -957,7 +957,6 @@ function var_changed(data) {
if (current_action <= 0) {
//console.log("setting action_count to "+current_action);
const storyPrompt = $el("#story_prompt");
if (storyPrompt) storyPrompt.classList.remove("hidden");
scroll_trigger_element = undefined;
document.getElementById("Selected Text").onscroll = undefined;
}
@@ -1807,31 +1806,6 @@ function model_settings_checker() {
valid = (check_value < this.check_data['value']);
}
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) {
for (const temp of this.check_data['sum']) {
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) {
@@ -3388,6 +3388,10 @@ function gametextwatcher(records) {
if (!dirty_chunks.includes("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 {
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;
if (!dirty_chunks.includes(node.previousElementSibling.getAttribute("chunk"))) {
dirty_chunks.push(node.previousElementSibling.getAttribute("chunk"));
}
} else {
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
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.nextElementSibling.remove();
}
@@ -6100,6 +6107,17 @@ function closePopups(userAction=false) {
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) {
if (event.target === this) closePopups(true);
});

View File

@@ -49,12 +49,12 @@
<div class="gamescreen" id="gamescreen" context-menu="gamescreen">
<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>
<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>
<!------------ Sequences --------------------->