AI/text-generation-webui
1
0
Fork 0
mirror of https://github.com/oobabooga/text-generation-webui.git synced 2024-09-19 15:56:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Lint the javascript code

Browse Source
This commit is contained in:
oobabooga 2023-10-07 19:07:57 -07:00
parent 8614c9d085
commit cf4d89ee65
4 changed files with 174 additions and 174 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

220
js/main.js
View File

@ -1,33 +1,33 @@
let main_parent = document.getElementById('chat-tab').parentNode; let main_parent = document.getElementById("chat-tab").parentNode;
let extensions = document.getElementById('extensions'); let extensions = document.getElementById("extensions");
main_parent.childNodes[0].classList.add("header_bar"); main_parent.childNodes[0].classList.add("header_bar");
main_parent.style = "padding: 0; margin: 0"; main_parent.style = "padding: 0; margin: 0";
main_parent.parentNode.style = "gap: 0"; main_parent.parentNode.style = "gap: 0";
main_parent.parentNode.parentNode.style = "padding: 0"; main_parent.parentNode.parentNode.style = "padding: 0";
document.querySelector('.header_bar').addEventListener('click', function(event) { document.querySelector(".header_bar").addEventListener("click", function(event) {
if (event.target.tagName === 'BUTTON') { if (event.target.tagName === "BUTTON") {
const buttonText = event.target.textContent.trim(); const buttonText = event.target.textContent.trim();
let chat_visible = (buttonText == 'Chat'); let chat_visible = (buttonText == "Chat");
let default_visible = (buttonText == 'Default'); let default_visible = (buttonText == "Default");
let notebook_visible = (buttonText == 'Notebook'); let notebook_visible = (buttonText == "Notebook");
// Check if one of the generation tabs is visible // Check if one of the generation tabs is visible
if (chat_visible || notebook_visible || default_visible) { if (chat_visible || notebook_visible || default_visible) {
extensions.style.display = 'flex'; extensions.style.display = "flex";
if (chat_visible) { if (chat_visible) {
extensions.style.maxWidth = "880px"; extensions.style.maxWidth = "880px";
extensions.style.padding = "0px"; extensions.style.padding = "0px";
} else { } else {
extensions.style.maxWidth = "none"; extensions.style.maxWidth = "none";
extensions.style.padding = "15px"; extensions.style.padding = "15px";
} }
} else { } else {
extensions.style.display = 'none'; extensions.style.display = "none";
}
} }
}
}); });
//------------------------------------------------ //------------------------------------------------
@ -48,49 +48,49 @@ document.addEventListener("keydown", function(event) {
else if (event.ctrlKey && event.key == "s") { else if (event.ctrlKey && event.key == "s") {
event.preventDefault(); event.preventDefault();
var showControlsElement = document.getElementById('show-controls'); var showControlsElement = document.getElementById("show-controls");
if (showControlsElement && showControlsElement.childNodes.length >= 4) { if (showControlsElement && showControlsElement.childNodes.length >= 4) {
showControlsElement.childNodes[3].click(); showControlsElement.childNodes[3].click();
var arr = document.getElementById('chat-input').childNodes[2].childNodes; var arr = document.getElementById("chat-input").childNodes[2].childNodes;
arr[arr.length - 1].focus(); arr[arr.length - 1].focus();
} }
} }
// Regenerate on Ctrl + Enter // Regenerate on Ctrl + Enter
else if (event.ctrlKey && event.key === 'Enter') { else if (event.ctrlKey && event.key === "Enter") {
event.preventDefault(); event.preventDefault();
document.getElementById('Regenerate').click(); document.getElementById("Regenerate").click();
} }
// Continue on Alt + Enter // Continue on Alt + Enter
else if (event.altKey && event.key === 'Enter') { else if (event.altKey && event.key === "Enter") {
event.preventDefault(); event.preventDefault();
document.getElementById('Continue').click(); document.getElementById("Continue").click();
} }
// Remove last on Ctrl + Shift + Backspace // Remove last on Ctrl + Shift + Backspace
else if (event.ctrlKey && event.shiftKey && event.key === 'Backspace') { else if (event.ctrlKey && event.shiftKey && event.key === "Backspace") {
event.preventDefault(); event.preventDefault();
document.getElementById('Remove-last').click(); document.getElementById("Remove-last").click();
} }
// Copy last on Ctrl + Shift + K // Copy last on Ctrl + Shift + K
else if (event.ctrlKey && event.shiftKey && event.key === 'K') { else if (event.ctrlKey && event.shiftKey && event.key === "K") {
event.preventDefault(); event.preventDefault();
document.getElementById('Copy-last').click(); document.getElementById("Copy-last").click();
} }
// Replace last on Ctrl + Shift + L // Replace last on Ctrl + Shift + L
else if (event.ctrlKey && event.shiftKey && event.key === 'L') { else if (event.ctrlKey && event.shiftKey && event.key === "L") {
event.preventDefault(); event.preventDefault();
document.getElementById('Replace-last').click(); document.getElementById("Replace-last").click();
} }
// Impersonate on Ctrl + Shift + M // Impersonate on Ctrl + Shift + M
else if (event.ctrlKey && event.shiftKey && event.key === 'M') { else if (event.ctrlKey && event.shiftKey && event.key === "M") {
event.preventDefault(); event.preventDefault();
document.getElementById('Impersonate').click(); document.getElementById("Impersonate").click();
} }
}); });
@ -98,7 +98,7 @@ document.addEventListener("keydown", function(event) {
//------------------------------------------------ //------------------------------------------------
// Position the chat typing dots // Position the chat typing dots
//------------------------------------------------ //------------------------------------------------
typing = document.getElementById('typing-container'); typing = document.getElementById("typing-container");
typingParent = typing.parentNode; typingParent = typing.parentNode;
typingSibling = typing.previousElementSibling; typingSibling = typing.previousElementSibling;
typingSibling.insertBefore(typing, typingSibling.childNodes[2]); typingSibling.insertBefore(typing, typingSibling.childNodes[2]);
@ -106,12 +106,12 @@ typingSibling.insertBefore(typing, typingSibling.childNodes[2]);
//------------------------------------------------ //------------------------------------------------
// Chat scrolling // Chat scrolling
//------------------------------------------------ //------------------------------------------------
const targetElement = document.getElementById('chat').parentNode.parentNode.parentNode; const targetElement = document.getElementById("chat").parentNode.parentNode.parentNode;
targetElement.classList.add('pretty_scrollbar'); targetElement.classList.add("pretty_scrollbar");
targetElement.classList.add('chat-parent'); targetElement.classList.add("chat-parent");
let isScrolled = false; let isScrolled = false;
targetElement.addEventListener('scroll', function() { targetElement.addEventListener("scroll", function() {
let diff = targetElement.scrollHeight - targetElement.clientHeight; let diff = targetElement.scrollHeight - targetElement.clientHeight;
if(Math.abs(targetElement.scrollTop - diff) <= 10 || diff == 0) { if(Math.abs(targetElement.scrollTop - diff) <= 10 || diff == 0) {
isScrolled = false; isScrolled = false;
@ -128,14 +128,14 @@ const observer = new MutationObserver(function(mutations) {
} }
const firstChild = targetElement.children[0]; const firstChild = targetElement.children[0];
if (firstChild.classList.contains('generating')) { if (firstChild.classList.contains("generating")) {
typing.parentNode.classList.add('visible-dots'); typing.parentNode.classList.add("visible-dots");
document.getElementById('stop').style.display = 'flex'; document.getElementById("stop").style.display = "flex";
document.getElementById('Generate').style.display = 'none'; document.getElementById("Generate").style.display = "none";
} else { } else {
typing.parentNode.classList.remove('visible-dots'); typing.parentNode.classList.remove("visible-dots");
document.getElementById('stop').style.display = 'none'; document.getElementById("stop").style.display = "none";
document.getElementById('Generate').style.display = 'flex'; document.getElementById("Generate").style.display = "flex";
} }
}); });
@ -156,10 +156,10 @@ observer.observe(targetElement, config);
//------------------------------------------------ //------------------------------------------------
// Notebook box scrolling // Notebook box scrolling
//------------------------------------------------ //------------------------------------------------
const notebookElement = document.querySelector('#textbox-notebook textarea'); const notebookElement = document.querySelector("#textbox-notebook textarea");
let notebookScrolled = false; let notebookScrolled = false;
notebookElement.addEventListener('scroll', function() { notebookElement.addEventListener("scroll", function() {
let diff = notebookElement.scrollHeight - notebookElement.clientHeight; let diff = notebookElement.scrollHeight - notebookElement.clientHeight;
if(Math.abs(notebookElement.scrollTop - diff) <= 10 || diff == 0) { if(Math.abs(notebookElement.scrollTop - diff) <= 10 || diff == 0) {
notebookScrolled = false; notebookScrolled = false;
@ -181,10 +181,10 @@ notebookObserver.observe(notebookElement.parentNode.parentNode.parentNode, confi
//------------------------------------------------ //------------------------------------------------
// Default box scrolling // Default box scrolling
//------------------------------------------------ //------------------------------------------------
const defaultElement = document.querySelector('#textbox-default textarea'); const defaultElement = document.querySelector("#textbox-default textarea");
let defaultScrolled = false; let defaultScrolled = false;
defaultElement.addEventListener('scroll', function() { defaultElement.addEventListener("scroll", function() {
let diff = defaultElement.scrollHeight - defaultElement.clientHeight; let diff = defaultElement.scrollHeight - defaultElement.clientHeight;
if(Math.abs(defaultElement.scrollTop - diff) <= 10 || diff == 0) { if(Math.abs(defaultElement.scrollTop - diff) <= 10 || diff == 0) {
defaultScrolled = false; defaultScrolled = false;
@ -206,20 +206,20 @@ defaultObserver.observe(defaultElement.parentNode.parentNode.parentNode, config)
//------------------------------------------------ //------------------------------------------------
// Add some scrollbars // Add some scrollbars
//------------------------------------------------ //------------------------------------------------
const textareaElements = document.querySelectorAll('.add_scrollbar textarea'); const textareaElements = document.querySelectorAll(".add_scrollbar textarea");
for(i = 0; i < textareaElements.length; i++) { for(i = 0; i < textareaElements.length; i++) {
textareaElements[i].classList.remove('scroll-hide'); textareaElements[i].classList.remove("scroll-hide");
textareaElements[i].classList.add('pretty_scrollbar'); textareaElements[i].classList.add("pretty_scrollbar");
textareaElements[i].style.resize = "none"; textareaElements[i].style.resize = "none";
} }
//------------------------------------------------ //------------------------------------------------
// Remove some backgrounds // Remove some backgrounds
//------------------------------------------------ //------------------------------------------------
const noBackgroundelements = document.querySelectorAll('.no-background'); const noBackgroundelements = document.querySelectorAll(".no-background");
for(i = 0; i < noBackgroundelements.length; i++) { for(i = 0; i < noBackgroundelements.length; i++) {
noBackgroundelements[i].parentNode.style.border = 'none'; noBackgroundelements[i].parentNode.style.border = "none";
noBackgroundelements[i].parentNode.parentNode.parentNode.style.alignItems = 'center'; noBackgroundelements[i].parentNode.parentNode.parentNode.style.alignItems = "center";
} }
//------------------------------------------------ //------------------------------------------------
@ -228,89 +228,89 @@ for(i = 0; i < noBackgroundelements.length; i++) {
// https://github.com/SillyTavern/SillyTavern/blob/6c8bd06308c69d51e2eb174541792a870a83d2d6/public/script.js // https://github.com/SillyTavern/SillyTavern/blob/6c8bd06308c69d51e2eb174541792a870a83d2d6/public/script.js
//------------------------------------------------ //------------------------------------------------
var buttonsInChat = document.querySelectorAll("#chat-tab:not(.old-ui) #chat-buttons button"); var buttonsInChat = document.querySelectorAll("#chat-tab:not(.old-ui) #chat-buttons button");
var button = document.getElementById('hover-element-button'); var button = document.getElementById("hover-element-button");
var menu = document.getElementById('hover-menu'); var menu = document.getElementById("hover-menu");
function showMenu() { function showMenu() {
menu.style.display = 'flex'; // Show the menu menu.style.display = "flex"; // Show the menu
} }
function hideMenu() { function hideMenu() {
menu.style.display = 'none'; // Hide the menu menu.style.display = "none"; // Hide the menu
document.querySelector('#chat-input textarea').focus(); document.querySelector("#chat-input textarea").focus();
} }
if (buttonsInChat.length > 0) { if (buttonsInChat.length > 0) {
for (let i = buttonsInChat.length - 1; i >= 0; i--) { for (let i = buttonsInChat.length - 1; i >= 0; i--) {
const thisButton = buttonsInChat[i]; const thisButton = buttonsInChat[i];
menu.appendChild(thisButton); menu.appendChild(thisButton);
thisButton.addEventListener("click", () => { thisButton.addEventListener("click", () => {
hideMenu(); hideMenu();
}); });
const buttonText = thisButton.textContent; const buttonText = thisButton.textContent;
const matches = buttonText.match(/(\(.*?\))/); const matches = buttonText.match(/(\(.*?\))/);
if (matches && matches.length > 1) { if (matches && matches.length > 1) {
// Apply the transparent-substring class to the matched substring // Apply the transparent-substring class to the matched substring
const substring = matches[1]; const substring = matches[1];
const newText = buttonText.replace(substring, `&nbsp;<span class="transparent-substring">${substring.slice(1, -1)}</span>`); const newText = buttonText.replace(substring, `&nbsp;<span class="transparent-substring">${substring.slice(1, -1)}</span>`);
thisButton.innerHTML = newText; thisButton.innerHTML = newText;
}
} }
}
} else { } else {
buttonsInChat = document.querySelectorAll("#chat-tab.old-ui #chat-buttons button"); buttonsInChat = document.querySelectorAll("#chat-tab.old-ui #chat-buttons button");
for (let i = 0; i < buttonsInChat.length; i++) { for (let i = 0; i < buttonsInChat.length; i++) {
buttonsInChat[i].textContent = buttonsInChat[i].textContent.replace(/ \(.*?\)/, ''); buttonsInChat[i].textContent = buttonsInChat[i].textContent.replace(/ \(.*?\)/, "");
} }
document.getElementById('gr-hover-container').style.display = 'none'; document.getElementById("gr-hover-container").style.display = "none";
} }
function isMouseOverButtonOrMenu() { function isMouseOverButtonOrMenu() {
return menu.matches(':hover') || button.matches(':hover'); return menu.matches(":hover") || button.matches(":hover");
} }
button.addEventListener('mouseenter', function () { button.addEventListener("mouseenter", function () {
showMenu(); showMenu();
}); });
button.addEventListener('click', function () { button.addEventListener("click", function () {
showMenu(); showMenu();
}); });
// Add event listener for mouseleave on the button // Add event listener for mouseleave on the button
button.addEventListener('mouseleave', function () { button.addEventListener("mouseleave", function () {
// Delay to prevent menu hiding when the mouse leaves the button into the menu // Delay to prevent menu hiding when the mouse leaves the button into the menu
setTimeout(function () { setTimeout(function () {
if (!isMouseOverButtonOrMenu()) { if (!isMouseOverButtonOrMenu()) {
hideMenu(); hideMenu();
} }
}, 100); }, 100);
}); });
// Add event listener for mouseleave on the menu // Add event listener for mouseleave on the menu
menu.addEventListener('mouseleave', function () { menu.addEventListener("mouseleave", function () {
// Delay to prevent menu hide when the mouse leaves the menu into the button // Delay to prevent menu hide when the mouse leaves the menu into the button
setTimeout(function () { setTimeout(function () {
if (!isMouseOverButtonOrMenu()) { if (!isMouseOverButtonOrMenu()) {
hideMenu(); hideMenu();
} }
}, 100); }, 100);
}); });
// Add event listener for click anywhere in the document // Add event listener for click anywhere in the document
document.addEventListener('click', function (event) { document.addEventListener("click", function (event) {
// Check if the click is outside the button/menu and the menu is visible // Check if the click is outside the button/menu and the menu is visible
if (!isMouseOverButtonOrMenu() && menu.style.display === 'flex') { if (!isMouseOverButtonOrMenu() && menu.style.display === "flex") {
hideMenu(); hideMenu();
} }
}); });
//------------------------------------------------ //------------------------------------------------
// Relocate the "Show controls" checkbox // Relocate the "Show controls" checkbox
//------------------------------------------------ //------------------------------------------------
var elementToMove = document.getElementById('show-controls'); var elementToMove = document.getElementById("show-controls");
var parent = elementToMove.parentNode; var parent = elementToMove.parentNode;
for (var i = 0; i < 2; i++) { for (var i = 0; i < 2; i++) {
parent = parent.parentNode; parent = parent.parentNode;
@ -321,10 +321,10 @@ parent.insertBefore(elementToMove, parent.firstChild);
//------------------------------------------------ //------------------------------------------------
// Make the chat input grow upwards instead of downwards // Make the chat input grow upwards instead of downwards
//------------------------------------------------ //------------------------------------------------
document.getElementById('show-controls').parentNode.style.position = 'absolute'; document.getElementById("show-controls").parentNode.style.position = "absolute";
document.getElementById('show-controls').parentNode.style.bottom = '0px'; document.getElementById("show-controls").parentNode.style.bottom = "0px";
//------------------------------------------------ //------------------------------------------------
// Focus on the chat input // Focus on the chat input
//------------------------------------------------ //------------------------------------------------
document.querySelector('#chat-input textarea').focus() document.querySelector("#chat-input textarea").focus();

50
js/save_files.js
View File

@ -1,40 +1,40 @@
// Functions for downloading JSON files // Functions for downloading JSON files
function getCurrentTimestamp() { function getCurrentTimestamp() {
const now = new Date(); const now = new Date();
const timezoneOffset = now.getTimezoneOffset() * 60000; // Convert to milliseconds const timezoneOffset = now.getTimezoneOffset() * 60000; // Convert to milliseconds
const localTime = new Date(now.getTime() - timezoneOffset); const localTime = new Date(now.getTime() - timezoneOffset);
const formattedTimestamp = localTime.toISOString().replace(/[-:]/g, '').slice(0, 15); const formattedTimestamp = localTime.toISOString().replace(/[-:]/g, "").slice(0, 15);
return formattedTimestamp; return formattedTimestamp;
} }
function saveFile(contents, filename) { function saveFile(contents, filename) {
const element = document.createElement('a'); const element = document.createElement("a");
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(contents)); element.setAttribute("href", "data:text/plain;charset=utf-8," + encodeURIComponent(contents));
element.setAttribute('download', filename); element.setAttribute("download", filename);
element.style.display = 'none'; element.style.display = "none";
document.body.appendChild(element); document.body.appendChild(element);
element.click(); element.click();
document.body.removeChild(element); document.body.removeChild(element);
} }
function saveHistory(history, character, mode) { function saveHistory(history, character, mode) {
let path = null; let path = null;
if (['chat', 'chat-instruct'].includes(mode) && character && character.trim() !== '') { if (["chat", "chat-instruct"].includes(mode) && character && character.trim() !== "") {
path = `history_${character}_${getCurrentTimestamp()}.json`; path = `history_${character}_${getCurrentTimestamp()}.json`;
} else { } else {
try { try {
path = `history_${mode}_${getCurrentTimestamp()}.json`; path = `history_${mode}_${getCurrentTimestamp()}.json`;
} catch (error) { } catch (error) {
path = `history_${getCurrentTimestamp()}.json`; path = `history_${getCurrentTimestamp()}.json`;
}
} }
saveFile(history, path); }
saveFile(history, path);
} }
function saveSession(session) { function saveSession(session) {
let path = null; let path = null;
path = `session_${getCurrentTimestamp()}.json`; path = `session_${getCurrentTimestamp()}.json`;
saveFile(session, path); saveFile(session, path);
} }

30
js/show_controls.js
View File

@ -2,21 +2,21 @@ const belowChatInput = document.querySelectorAll("#chat-tab > div > :nth-child(n
const chatParent = document.querySelector(".chat-parent"); const chatParent = document.querySelector(".chat-parent");
function toggle_controls(value) { function toggle_controls(value) {
if (value) { if (value) {
belowChatInput.forEach(element => { belowChatInput.forEach(element => {
element.style.display = "inherit"; element.style.display = "inherit";
}); });
chatParent.classList.remove("bigchat"); chatParent.classList.remove("bigchat");
document.getElementById('chat-input-row').classList.remove("bigchat"); document.getElementById("chat-input-row").classList.remove("bigchat");
document.getElementById('chat-col').classList.remove("bigchat"); document.getElementById("chat-col").classList.remove("bigchat");
} else { } else {
belowChatInput.forEach(element => { belowChatInput.forEach(element => {
element.style.display = "none"; element.style.display = "none";
}); });
chatParent.classList.add("bigchat"); chatParent.classList.add("bigchat");
document.getElementById('chat-input-row').classList.add("bigchat") document.getElementById("chat-input-row").classList.add("bigchat");
document.getElementById('chat-col').classList.add("bigchat"); document.getElementById("chat-col").classList.add("bigchat");
} }
} }

48
js/switch_tabs.js
View File

@ -1,15 +1,15 @@
let chat_tab = document.getElementById('chat-tab'); let chat_tab = document.getElementById("chat-tab");
let main_parent = chat_tab.parentNode; let main_parent = chat_tab.parentNode;
function scrollToTop() { function scrollToTop() {
window.scrollTo({ window.scrollTo({
top: 0, top: 0,
// behavior: 'smooth' // behavior: 'smooth'
}); });
} }
function findButtonsByText(buttonText) { function findButtonsByText(buttonText) {
const buttons = document.getElementsByTagName('button'); const buttons = document.getElementsByTagName("button");
const matchingButtons = []; const matchingButtons = [];
buttonText = buttonText.trim(); buttonText = buttonText.trim();
@ -26,34 +26,34 @@ function findButtonsByText(buttonText) {
} }
function switch_to_chat() { function switch_to_chat() {
let chat_tab_button = main_parent.childNodes[0].childNodes[1]; let chat_tab_button = main_parent.childNodes[0].childNodes[1];
chat_tab_button.click(); chat_tab_button.click();
scrollToTop(); scrollToTop();
} }
function switch_to_default() { function switch_to_default() {
let default_tab_button = main_parent.childNodes[0].childNodes[4]; let default_tab_button = main_parent.childNodes[0].childNodes[4];
default_tab_button.click(); default_tab_button.click();
scrollToTop(); scrollToTop();
} }
function switch_to_notebook() { function switch_to_notebook() {
let notebook_tab_button = main_parent.childNodes[0].childNodes[7]; let notebook_tab_button = main_parent.childNodes[0].childNodes[7];
notebook_tab_button.click(); notebook_tab_button.click();
findButtonsByText('Raw')[1].click() findButtonsByText("Raw")[1].click();
scrollToTop(); scrollToTop();
} }
function switch_to_generation_parameters() { function switch_to_generation_parameters() {
let parameters_tab_button = main_parent.childNodes[0].childNodes[10]; let parameters_tab_button = main_parent.childNodes[0].childNodes[10];
parameters_tab_button.click(); parameters_tab_button.click();
findButtonsByText('Generation')[0].click() findButtonsByText("Generation")[0].click();
scrollToTop(); scrollToTop();
} }
function switch_to_character() { function switch_to_character() {
let parameters_tab_button = main_parent.childNodes[0].childNodes[10]; let parameters_tab_button = main_parent.childNodes[0].childNodes[10];
parameters_tab_button.click(); parameters_tab_button.click();
findButtonsByText('Character')[0].click() findButtonsByText("Character")[0].click();
scrollToTop(); scrollToTop();
} }