From 041d665bc5bb85658c308ed9627a4fe73e417307 Mon Sep 17 00:00:00 2001 From: somebody Date: Fri, 30 Sep 2022 17:55:20 -0500 Subject: [PATCH 1/4] Spruced up the title a bit, now includes story title --- static/koboldai.js | 25 +++++++++++++++++++++++-- 1 file changed, 23 insertions(+), 2 deletions(-) diff --git a/static/koboldai.js b/static/koboldai.js index c0f04108..48c991a5 100644 --- a/static/koboldai.js +++ b/static/koboldai.js @@ -97,6 +97,9 @@ const context_menu_actions = [ // {label: "View Token Probabilities", icon: "account_tree", visibilityCondition: "SELECTION", click: view_selection_probabilities}, ]; +// Elements +const titleInput = document.querySelector(".var_sync_story_story_name"); + const map1 = new Map() map1.set('Top K Sampling', 0) @@ -485,9 +488,9 @@ function update_status_bar(data) { } } if ((percent_complete == 0) || (percent_complete == 100)) { - document.title = "KoboldAI Client"; + updateTitle(); } else { - document.title = "KoboldAI Client Generating (" + percent_complete + "%)"; + document.title = `(${percent_complete}%) KoboldAI Client`; } } @@ -628,6 +631,14 @@ function var_changed(data) { item.textContent = fix_text(data.value); } } + + // TODO: Add old value and new value to detail? + item.dispatchEvent(new CustomEvent("sync", { + detail: {}, + bubbles: false, + cancelable: true, + composed: false, + })); } //alternative syncing method var elements_to_change = document.getElementsByClassName("var_sync_alt_"+data.classname.replace(" ", "_")+"_"+data.name.replace(" ", "_")); @@ -4403,6 +4414,11 @@ function position_context_menu(contextMenu, x, y) { contextMenu.style.top = `${y}px`; } +function updateTitle() { + if (!titleInput.innerText) return; + document.title = `${titleInput.innerText} - KoboldAI Client`; +} + $(document).ready(function(){ on_colab = document.getElementById("on_colab").textContent == "true"; @@ -4669,6 +4685,11 @@ $(document).ready(function(){ let wiCard = document.getElementById(`world_info_${uid}`); highlightEl(wiCard); }); + + titleInput.addEventListener("input", updateTitle); + titleInput.addEventListener("sync", updateTitle); + + updateTitle(); }); document.addEventListener("keydown", function(event) { From eea2bc84624afc5b298c82e2984dbcd35b3f6b2d Mon Sep 17 00:00:00 2001 From: somebody Date: Fri, 30 Sep 2022 18:35:37 -0500 Subject: [PATCH 2/4] Update for $el --- static/koboldai.js | 8 ++++---- templates/index_new.html | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/static/koboldai.js b/static/koboldai.js index 48c991a5..97a12e06 100644 --- a/static/koboldai.js +++ b/static/koboldai.js @@ -97,9 +97,7 @@ const context_menu_actions = [ // {label: "View Token Probabilities", icon: "account_tree", visibilityCondition: "SELECTION", click: view_selection_probabilities}, ]; -// Elements -const titleInput = document.querySelector(".var_sync_story_story_name"); - +function $el(selector) { return document.querySelector(selector); } const map1 = new Map() map1.set('Top K Sampling', 0) @@ -4415,12 +4413,13 @@ function position_context_menu(contextMenu, x, y) { } function updateTitle() { + const titleInput = $el(".var_sync_story_story_name"); if (!titleInput.innerText) return; document.title = `${titleInput.innerText} - KoboldAI Client`; } $(document).ready(function(){ - on_colab = document.getElementById("on_colab").textContent == "true"; + on_colab = $el("#on_colab").textContent == "true"; if (colab_cookies != null) { for (const cookie of Object.keys(colab_cookies)) { @@ -4686,6 +4685,7 @@ $(document).ready(function(){ highlightEl(wiCard); }); + const titleInput = $el(".var_sync_story_story_name"); titleInput.addEventListener("input", updateTitle); titleInput.addEventListener("sync", updateTitle); diff --git a/templates/index_new.html b/templates/index_new.html index 9c413c8a..ebdb21f5 100644 --- a/templates/index_new.html +++ b/templates/index_new.html @@ -22,7 +22,7 @@ - + From 48d1399cad866400a6801d975da2ca17f6d8b46e Mon Sep 17 00:00:00 2001 From: somebody Date: Fri, 30 Sep 2022 19:17:00 -0500 Subject: [PATCH 3/4] Bug fix for WI jump --- static/koboldai.js | 145 +++++++++++++++++++++++++++------------------ 1 file changed, 86 insertions(+), 59 deletions(-) diff --git a/static/koboldai.js b/static/koboldai.js index 97a12e06..988866e5 100644 --- a/static/koboldai.js +++ b/static/koboldai.js @@ -49,7 +49,6 @@ var world_info_data = {}; var world_info_folder_data = {}; var saved_settings = {}; var finder_selection_index = -1; -var on_colab; var colab_cookies = null; var wi_finder_data = []; var wi_finder_offset = 0; @@ -61,6 +60,7 @@ var finder_waiting_id = null; var control_held = false; var actions_data = {}; var setup_wi_toggles = []; +const on_colab = $el("#on_colab").textContent == "true"; // name, desc, icon, func const finder_actions = [ @@ -97,7 +97,12 @@ const context_menu_actions = [ // {label: "View Token Probabilities", icon: "account_tree", visibilityCondition: "SELECTION", click: view_selection_probabilities}, ]; -function $el(selector) { return document.querySelector(selector); } +function $el(selector) { + // We do not preemptively fetch all elements upon execution (wall of consts) + // due to the layer of mental overhead it adds to debugging and reading + // code in general. + return document.querySelector(selector); +} const map1 = new Map() map1.set('Top K Sampling', 0) @@ -4418,53 +4423,58 @@ function updateTitle() { document.title = `${titleInput.innerText} - KoboldAI Client`; } -$(document).ready(function(){ - on_colab = $el("#on_colab").textContent == "true"; +//// INIT //// - if (colab_cookies != null) { - for (const cookie of Object.keys(colab_cookies)) { - setCookie(cookie, colab_cookies[cookie]); - } - colab_cookies = null; - } +document.onkeydown = detect_key_down; +document.onkeyup = detect_key_up; +document.getElementById("input_text").onkeydown = detect_enter_submit; - //create_theming_elements(); - document.onkeydown = detect_key_down; - document.onkeyup = detect_key_up; - document.getElementById("input_text").onkeydown = detect_enter_submit; - - // Tweak registering - for (const tweakContainer of document.getElementsByClassName("tweak-container")) { - let toggle = tweakContainer.querySelector("input"); +/* -- Colab Cookie Handling -- */ +if (colab_cookies != null) { + for (const cookie of Object.keys(colab_cookies)) { + setCookie(cookie, colab_cookies[cookie]); + } + colab_cookies = null; +} - $(toggle).change(function(e) { - let path = $(this).closest(".tweak-container")[0].getAttribute("tweak-path"); - let id = `tweak-${path}`; +//create_theming_elements(); - if (this.checked) { - let style = document.createElement("link"); - style.rel = "stylesheet"; - style.href = `/themes/tweaks/${path}.css`; - style.id = id; - document.head.appendChild(style); - } else { - let el = document.getElementById(id); - if (el) el.remove(); - } +/* -- Tweak Registering -- */ +for (const tweakContainer of document.getElementsByClassName("tweak-container")) { + let toggle = tweakContainer.querySelector("input"); - save_tweaks(); - }); - } - - process_cookies(); + $(toggle).change(function(e) { + let path = $(this).closest(".tweak-container")[0].getAttribute("tweak-path"); + let id = `tweak-${path}`; - $("#context-viewer-close").click(function() { - document.getElementById("context-viewer-container").classList.add("hidden"); + if (this.checked) { + let style = document.createElement("link"); + style.rel = "stylesheet"; + style.href = `/themes/tweaks/${path}.css`; + style.id = id; + document.head.appendChild(style); + } else { + let el = document.getElementById(id); + if (el) el.remove(); + } + + save_tweaks(); }); +} - $(".token_breakdown").click(function() { - document.getElementById("context-viewer-container").classList.remove("hidden"); - }); +process_cookies(); + +$("#context-viewer-close").click(function() { + $el(".context-viewer-container").classList.add("hidden"); +}); + +$(".token_breakdown").click(function() { + $el("#context-viewer-container").classList.remove("hidden"); +}); + +/* -- Drag and Drop -- */ +(function() { + let lastTarget = null; document.body.addEventListener("drop", function(e) { e.preventDefault(); @@ -4484,8 +4494,6 @@ $(document).ready(function(){ } }); - let lastTarget = null; - document.body.addEventListener("dragover", function(e) { e.preventDefault(); }); @@ -4500,8 +4508,15 @@ $(document).ready(function(){ $("#file-upload-notice")[0].classList.add("hidden"); }); +})(); - // Parse settings for search thingey +/* -- Finder -- */ +(function() { + const finderContainer = document.getElementById("finder-container"); + const finderInput = document.getElementById("finder-input"); + const finderIcon = document.getElementById("finder-icon"); + + // Parse settings for Finder for (const el of $(".setting_label")) { let name = el.children[0].innerText; @@ -4515,7 +4530,7 @@ $(document).ready(function(){ func: function () { highlightEl(el.parentElement) }, }); } - + for (const el of $(".collapsable_header")) { // https://stackoverflow.com/a/11347962 let headerText = $(el.children[0]).contents().filter(function() { @@ -4529,10 +4544,6 @@ $(document).ready(function(){ }); } - const finderContainer = document.getElementById("finder-container"); - const finderInput = document.getElementById("finder-input"); - const finderIcon = document.getElementById("finder-icon"); - finderIcon.addEventListener("click", cycleFinderMode); finderInput.addEventListener("keyup", updateSearchListings); finderInput.addEventListener("keydown", function(event) { @@ -4578,24 +4589,28 @@ $(document).ready(function(){ finder_selection_index = future; updateFinderSelection(delta); }); - + finderContainer.addEventListener("click", function(e) { if (e.target !== this) return; finderContainer.classList.add("hidden"); }); +})(); - // Debug file +/* -- Debug File -- */ +(function() { + const debugContainer = document.getElementById("debug-file-container"); // TODO: All of this generic backdrop code really sucks. There should be a // standardised thing for popups that adds the dimmed backdrop and standard // closing, etc. - const debugContainer = document.getElementById("debug-file-container"); - debugContainer.addEventListener("click", function(e) { debugContainer.classList.add("hidden"); }); +})(); - // Context menu + +/* -- Context Menu -- */ +(function() { const contextMenu = $e("div", document.body, {id: "context-menu", classes: ["hidden"]}); for (const action of context_menu_actions) { @@ -4657,26 +4672,31 @@ $(document).ready(function(){ window.addEventListener("blur", function(event) { contextMenu.classList.add("hidden"); }); +})(); - // Change appearance of WI when holding control + +/* -- WI Ctrl+Click To Jump -- */ +(function() { document.addEventListener("keydown", function(event) { + // Change appearance of WI when holding control if (event.key !== "Control") return; control_held = true; const style = ".wi_match { text-decoration: underline; cursor: pointer; }"; $e("style", document.head, {id: "wi-link-style", innerText: style}) }); - + // Remove on up document.addEventListener("keyup", function(event) { if (event.key !== "Control") return; control_held = false; - document.querySelector("#wi-link-style").remove(); + const style = document.querySelector("#wi-link-style") + if (style) style.remove(); }); document.getElementById("Selected Text").addEventListener("click", function(event) { - // Control click on WI entry + // Control click on WI entry to jump if (!event.target.classList.contains("wi_match")) return; if (!control_held) return; @@ -4684,14 +4704,21 @@ $(document).ready(function(){ let wiCard = document.getElementById(`world_info_${uid}`); highlightEl(wiCard); }); +})(); +/* -- Update Tab Title on Input and Sync -- */ +(function() { const titleInput = $el(".var_sync_story_story_name"); titleInput.addEventListener("input", updateTitle); titleInput.addEventListener("sync", updateTitle); + // Title may not have been sent by this point. Fear not; We abort if + // there's no title. If we have missed the title sync, however, this will + // save us. updateTitle(); -}); +})(); +/* -- Shortcuts -- */ document.addEventListener("keydown", function(event) { if (!event.ctrlKey) return; From b9169e59915e059838e8fff877c9019030fae415 Mon Sep 17 00:00:00 2001 From: somebody Date: Fri, 30 Sep 2022 19:32:19 -0500 Subject: [PATCH 4/4] Don't open custom context menu when ctrl is held --- static/koboldai.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/static/koboldai.js b/static/koboldai.js index 988866e5..fe24984e 100644 --- a/static/koboldai.js +++ b/static/koboldai.js @@ -4632,6 +4632,9 @@ $(".token_breakdown").click(function() { } $("#gamescreen").contextmenu(function(event) { + // If control is held, do not run our custom logic or cancel the browser's. + if (event.ctrlKey) return; + // Don't open browser context menu event.preventDefault();