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 #209 from one-some/UI2

Browse Source 
Fix recoloring on token switch and fix some tooltips
This commit is contained in:
ebolam
2022-10-14 14:37:56 -04:00
committed by GitHub
parent fddf1586c0 e28c862007
commit 31a35f1123
1 changed files with 23 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
static/koboldai.js
View File

@@ -260,7 +260,7 @@ function create_options(action) {
icon.setAttribute('data-glyph', "loop-circular"); icon.setAttribute('data-glyph', "loop-circular");
iconcell.append(icon); iconcell.append(icon);
delete_icon = $e("span", iconcell, {"classes": ["material-icons-outlined", "cursor", 'delete_option_icon'], delete_icon = $e("span", iconcell, {"classes": ["material-icons-outlined", "cursor", 'delete_option_icon'],
"title": "delete option", 'option_id': i, "tooltip": "Delete Option", 'option_id': i,
'option_chunk': action.id, 'textContent': 'delete'}); 'option_chunk': action.id, 'textContent': 'delete'});
delete_icon.onclick = function () { delete_icon.onclick = function () {
socket.emit("delete_option", {"chunk": this.getAttribute("option_chunk"), "option": this.getAttribute("option_id")}); socket.emit("delete_option", {"chunk": this.getAttribute("option_chunk"), "option": this.getAttribute("option_id")});
@@ -1658,9 +1658,9 @@ function world_info_entry(data) {
delete_icon = world_info_card.querySelector('#world_info_delete_'); delete_icon = world_info_card.querySelector('#world_info_delete_');
delete_icon.id = "world_info_delete_"+data.uid; delete_icon.id = "world_info_delete_"+data.uid;
delete_icon.setAttribute("uid", data.uid); delete_icon.setAttribute("uid", data.uid);
delete_icon.setAttribute("title", data.title); delete_icon.setAttribute("wi-title", data.title);
delete_icon.onclick = function () { delete_icon.onclick = function () {
if (confirm("This will delete world info "+this.getAttribute("title"))) { if (confirm("This will delete world info "+this.getAttribute("wi-title"))) {
if (parseInt(this.getAttribute("uid")) < 0) { if (parseInt(this.getAttribute("uid")) < 0) {
this.parentElement.parentElement.remove(); this.parentElement.parentElement.remove();
} else { } else {
@@ -2664,6 +2664,7 @@ function Change_Theme(theme) {
element.selected = false; element.selected = false;
} }
} }
recolorTokens();
} }
function palette_color(item) { function palette_color(item) {
@@ -2898,6 +2899,24 @@ function distortColor(rgb) {
return rgb; return rgb;
} }
function dec2Hex2(number) {
// Two padded hex number hack
let x = number.toString(16);
if (x.length === 1) return `0${x}`;
return x;
}
function recolorTokens() {
for (const contextContainer of document.querySelectorAll(".context-block")) {
let rgb = window.getComputedStyle(contextContainer)["background-color"].match(/(\d+), (\d+), (\d+)/).slice(1, 4).map(Number);
for (const tokenEl of contextContainer.querySelectorAll(".context-token")) {
let tokenColor = distortColor(rgb);
tokenColor = "#" + (tokenColor.map(dec2Hex2).join(""));
tokenEl.style.backgroundColor = tokenColor;
}
}
}
function update_context(data) { function update_context(data) {
$(".context-block").remove(); $(".context-block").remove();
@@ -2935,7 +2954,7 @@ function update_context(data) {
for (const [tokenId, token] of entry.tokens) { for (const [tokenId, token] of entry.tokens) {
let tokenColor = distortColor(rgb); let tokenColor = distortColor(rgb);
tokenColor = "#" + (tokenColor.map((x) => x.toString(16)).join("")); tokenColor = "#" + (tokenColor.map(dec2Hex2).join(""));
let tokenEl = $e("span", el, { let tokenEl = $e("span", el, {
classes: ["context-token"], classes: ["context-token"],
@@ -5084,7 +5103,6 @@ function initalizeTooltips() {
function registerElement(el) { function registerElement(el) {
// el should have attribute "tooltip" // el should have attribute "tooltip"
let text = el.getAttribute("tooltip"); let text = el.getAttribute("tooltip");
el.setAttribute("wawawa", "yeah")
el.addEventListener("mouseenter", function(event) { el.addEventListener("mouseenter", function(event) {
tooltip.innerText = text; tooltip.innerText = text;