From 8e1dad680033c1bfb9e2c169b0eaecfb36643801 Mon Sep 17 00:00:00 2001 From: RossAscends <124905043+RossAscends@users.noreply.github.com> Date: Fri, 6 Sep 2024 01:48:21 +0900 Subject: [PATCH 1/8] initial reversion commit --- public/index.html | 44 ++++++++++++++++----------------- public/script.js | 24 ++++++++++++------ public/scripts/instruct-mode.js | 14 ++++++++--- public/scripts/power-user.js | 20 +++++++++------ public/scripts/utils.js | 7 +++++- public/style.css | 1 + 6 files changed, 68 insertions(+), 42 deletions(-) diff --git a/public/index.html b/public/index.html index dffe456df..fc67b8966 100644 --- a/public/index.html +++ b/public/index.html @@ -3089,14 +3089,14 @@ Story String -
+
-
+
@@ -3104,7 +3104,7 @@ Chat Start
-
+
@@ -3182,7 +3182,7 @@
-
+
-
+
@@ -3323,7 +3323,7 @@
-
+
-
+
@@ -3361,38 +3361,38 @@ System Prompt Suffix
-
+
User Message Prefix -
+
User Message Suffix -
+
Assistant Message Prefix -
+
Assistant Message Suffix -
+
System Message Prefix -
+
System Message Suffix -
+
@@ -3408,37 +3408,37 @@
First Assistant Prefix -
+
Last Assistant Prefix -
+
First User Prefix -
+
Last User Prefix -
+
System Instruction Prefix -
+
Stop Sequence -
+
User Filler Message -
+
@@ -6504,4 +6504,4 @@ - + \ No newline at end of file diff --git a/public/script.js b/public/script.js index 8d9197280..c501c437e 100644 --- a/public/script.js +++ b/public/script.js @@ -10577,6 +10577,9 @@ jQuery(async function () { stopScriptExecution(); }); + const chromeUaIdx = navigator.userAgent.lastIndexOf('Chrome/'); + const chromeVersion = navigator.userAgent.substring(chromeUaIdx + 7, navigator.userAgent.indexOf('.', chromeUaIdx)); + $('.drawer-toggle').on('click', function () { var icon = $(this).find('.drawer-icon'); var drawer = $(this).parent().find('.drawer-content'); @@ -10616,10 +10619,13 @@ jQuery(async function () { } // Set the height of "autoSetHeight" textareas within the drawer to their scroll height - $(this).closest('.drawer').find('.drawer-content textarea.autoSetHeight').each(async function () { - await resetScrollHeight($(this)); - return; - }); + + if (chromeUaIdx == -1 || Number(chromeVersion) < 123) { + $(this).closest('.drawer').find('.drawer-content textarea.autoSetHeight').each(async function () { + await resetScrollHeight($(this)); + return; + }); + } } else if (drawerWasOpenAlready) { //to close manually icon.toggleClass('closedIcon openIcon'); @@ -10691,10 +10697,12 @@ jQuery(async function () { $(this).closest('.inline-drawer').find('.inline-drawer-content').stop().slideToggle(); // Set the height of "autoSetHeight" textareas within the inline-drawer to their scroll height - $(this).closest('.inline-drawer').find('.inline-drawer-content textarea.autoSetHeight').each(async function () { - await resetScrollHeight($(this)); - return; - }); + if (chromeUaIdx == -1 || Number(chromeVersion) < 123) { + $(this).closest('.inline-drawer').find('.inline-drawer-content textarea.autoSetHeight').each(async function () { + await resetScrollHeight($(this)); + return; + }); + } }); $(document).on('click', '.inline-drawer-maximize', function () { diff --git a/public/scripts/instruct-mode.js b/public/scripts/instruct-mode.js index a1bac800c..23edce78f 100644 --- a/public/scripts/instruct-mode.js +++ b/public/scripts/instruct-mode.js @@ -7,7 +7,7 @@ import { power_user, context_presets, } from './power-user.js'; -import { regexFromString } from './utils.js'; +import { regexFromString, resetScrollHeight } from './utils.js'; /** * @type {any[]} Instruct mode presets. @@ -42,6 +42,9 @@ const controls = [ { id: 'instruct_system_same_as_user', property: 'system_same_as_user', isCheckbox: true, trigger: true }, ]; +const chromeUaIdx = navigator.userAgent.lastIndexOf('Chrome/'); +const chromeVersion = navigator.userAgent.substring(chromeUaIdx + 7, navigator.userAgent.indexOf('.', chromeUaIdx)); + /** * Migrates instruct mode settings into the evergreen format. * @param {object} settings Instruct mode settings. @@ -95,11 +98,14 @@ export async function loadInstructMode(data) { if (control.isCheckbox) { $element.prop('checked', power_user.instruct[control.property]); } else { - $element[0].innerText = (power_user.instruct[control.property]); + $element.val(power_user.instruct[control.property]); } $element.on('input', async function () { - power_user.instruct[control.property] = control.isCheckbox ? !!$(this).prop('checked') : $(this)[0].innerText; + power_user.instruct[control.property] = control.isCheckbox ? !!$(this).prop('checked') : $(this).val; + if (chromeUaIdx == -1 || Number(chromeVersion) < 123) { + await resetScrollHeight($(this)); + } saveSettingsDebounced(); }); @@ -663,7 +669,7 @@ jQuery(() => { if (control.isCheckbox) { $element.prop('checked', power_user.instruct[control.property]).trigger('input'); } else { - $element[0].innerText = (power_user.instruct[control.property]); + $element.val(power_user.instruct[control.property]); $element.trigger('input'); } } diff --git a/public/scripts/power-user.js b/public/scripts/power-user.js index 93b974252..f57a15914 100644 --- a/public/scripts/power-user.js +++ b/public/scripts/power-user.js @@ -105,6 +105,9 @@ export const persona_description_positions = { NONE: 9, }; +const chromeUaIdx = navigator.userAgent.lastIndexOf('Chrome/'); +const chromeVersion = navigator.userAgent.substring(chromeUaIdx + 7, navigator.userAgent.indexOf('.', chromeUaIdx)); + let power_user = { tokenizer: tokenizers.BEST_MATCH, token_padding: 64, @@ -1740,20 +1743,23 @@ async function loadContextSettings() { if (control.isCheckbox) { $element.prop('checked', power_user.context[control.property]); } else { - $element[0].innerText = power_user.context[control.property]; + $element.val(power_user.context[control.property]); } console.log(`Setting ${$element.prop('id')} to ${power_user.context[control.property]}`); // If the setting already exists, no need to duplicate it // TODO: Maybe check the power_user object for the setting instead of a flag? - $element.on('input keyup', async function () { - const value = control.isCheckbox ? !!$(this).prop('checked') : $(this)[0].innerText; + $element.on('input', async function () { + const value = control.isCheckbox ? !!$(this).prop('checked') : $(this).val(); if (control.isGlobalSetting) { power_user[control.property] = value; } else { power_user.context[control.property] = value; } - + console.log(`Setting ${$element.prop('id')} to ${value}`); + if (chromeUaIdx == -1 || Number(chromeVersion) < 123) { + await resetScrollHeight($(this)); + } saveSettingsDebounced(); }); }); @@ -1793,7 +1799,7 @@ async function loadContextSettings() { .prop('checked', control.isGlobalSetting ? power_user[control.property] : power_user.context[control.property]) .trigger('input'); } else { - $element[0].innerText = (control.isGlobalSetting ? power_user[control.property] : power_user.context[control.property]); + $element.val(control.isGlobalSetting ? power_user[control.property] : power_user.context[control.property]); $element.trigger('input'); } } @@ -3096,7 +3102,7 @@ $(document).ready(() => { }); $('#start_reply_with').on('input', function () { - power_user.user_prompt_bias = String($(this)[0].innerText); + power_user.user_prompt_bias = String($(this).val); saveSettingsDebounced(); }); @@ -3628,7 +3634,7 @@ $(document).ready(() => { }); $('#custom_stopping_strings').on('input', function () { - power_user.custom_stopping_strings = String($(this)[0].innerText).trim(); + power_user.custom_stopping_strings = String($(this).val).trim(); saveSettingsDebounced(); }); diff --git a/public/scripts/utils.js b/public/scripts/utils.js index 8f0ca59a7..025eb599e 100644 --- a/public/scripts/utils.js +++ b/public/scripts/utils.js @@ -2027,8 +2027,13 @@ export function toggleDrawer(drawer, expand = true) { content.style.display = 'none'; } + const chromeUaIdx = navigator.userAgent.lastIndexOf('Chrome/'); + const chromeVersion = navigator.userAgent.substring(chromeUaIdx + 7, navigator.userAgent.indexOf('.', chromeUaIdx)); + // Set the height of "autoSetHeight" textareas within the inline-drawer to their scroll height - content.querySelectorAll('textarea.autoSetHeight').forEach(resetScrollHeight); + if (chromeUaIdx == -1 || Number(chromeVersion) < 123) { + content.querySelectorAll('textarea.autoSetHeight').forEach(resetScrollHeight); + } } export async function fetchFaFile(name) { diff --git a/public/style.css b/public/style.css index b75b776b8..e59fc75ef 100644 --- a/public/style.css +++ b/public/style.css @@ -1176,6 +1176,7 @@ textarea { textarea.autoSetHeight { max-height: 50vh; max-height: 50dvh; + field-sizing: content; } input, From ac0c33eb7669cfbbb7b8cd8460a94e9c6dca5135 Mon Sep 17 00:00:00 2001 From: Cohee <18619528+Cohee1207@users.noreply.github.com> Date: Thu, 5 Sep 2024 20:00:45 +0300 Subject: [PATCH 2/8] Use CSS.supports to determine auto-fit validity --- public/script.js | 8 ++------ public/scripts/group-chats.js | 12 ++++++++---- public/scripts/instruct-mode.js | 5 +---- public/scripts/openai.js | 8 +++++--- public/scripts/power-user.js | 5 +---- public/scripts/utils.js | 5 +---- 6 files changed, 18 insertions(+), 25 deletions(-) diff --git a/public/script.js b/public/script.js index c501c437e..6e25210ff 100644 --- a/public/script.js +++ b/public/script.js @@ -10577,9 +10577,6 @@ jQuery(async function () { stopScriptExecution(); }); - const chromeUaIdx = navigator.userAgent.lastIndexOf('Chrome/'); - const chromeVersion = navigator.userAgent.substring(chromeUaIdx + 7, navigator.userAgent.indexOf('.', chromeUaIdx)); - $('.drawer-toggle').on('click', function () { var icon = $(this).find('.drawer-icon'); var drawer = $(this).parent().find('.drawer-content'); @@ -10619,8 +10616,7 @@ jQuery(async function () { } // Set the height of "autoSetHeight" textareas within the drawer to their scroll height - - if (chromeUaIdx == -1 || Number(chromeVersion) < 123) { + if (!CSS.supports('field-sizing', 'content')) { $(this).closest('.drawer').find('.drawer-content textarea.autoSetHeight').each(async function () { await resetScrollHeight($(this)); return; @@ -10697,7 +10693,7 @@ jQuery(async function () { $(this).closest('.inline-drawer').find('.inline-drawer-content').stop().slideToggle(); // Set the height of "autoSetHeight" textareas within the inline-drawer to their scroll height - if (chromeUaIdx == -1 || Number(chromeVersion) < 123) { + if (!CSS.supports('field-sizing', 'content')) { $(this).closest('.inline-drawer').find('.inline-drawer-content textarea.autoSetHeight').each(async function () { await resetScrollHeight($(this)); return; diff --git a/public/scripts/group-chats.js b/public/scripts/group-chats.js index 83f0d0a99..82772a8bd 100644 --- a/public/scripts/group-chats.js +++ b/public/scripts/group-chats.js @@ -1491,9 +1491,11 @@ function select_group_chats(groupId, skipAnimation) { } // Toggle textbox sizes, as input events have not fired here - $('#rm_group_chats_block .autoSetHeight').each(element => { - resetScrollHeight(element); - }); + if (!CSS.supports('field-sizing', 'content')) { + $('#rm_group_chats_block .autoSetHeight').each(element => { + resetScrollHeight(element); + }); + } eventSource.emit('groupSelected', { detail: { id: openGroupId, group: group } }); } @@ -1965,7 +1967,9 @@ function doCurMemberListPopout() { jQuery(() => { $(document).on('input', '#rm_group_chats_block .autoSetHeight', function () { - resetScrollHeight($(this)); + if (!CSS.supports('field-sizing', 'content')) { + resetScrollHeight($(this)); + } }); $(document).on('click', '.group_select', function () { diff --git a/public/scripts/instruct-mode.js b/public/scripts/instruct-mode.js index 23edce78f..b4aa080c0 100644 --- a/public/scripts/instruct-mode.js +++ b/public/scripts/instruct-mode.js @@ -42,9 +42,6 @@ const controls = [ { id: 'instruct_system_same_as_user', property: 'system_same_as_user', isCheckbox: true, trigger: true }, ]; -const chromeUaIdx = navigator.userAgent.lastIndexOf('Chrome/'); -const chromeVersion = navigator.userAgent.substring(chromeUaIdx + 7, navigator.userAgent.indexOf('.', chromeUaIdx)); - /** * Migrates instruct mode settings into the evergreen format. * @param {object} settings Instruct mode settings. @@ -103,7 +100,7 @@ export async function loadInstructMode(data) { $element.on('input', async function () { power_user.instruct[control.property] = control.isCheckbox ? !!$(this).prop('checked') : $(this).val; - if (chromeUaIdx == -1 || Number(chromeVersion) < 123) { + if (!CSS.supports('field-sizing', 'content')) { await resetScrollHeight($(this)); } saveSettingsDebounced(); diff --git a/public/scripts/openai.js b/public/scripts/openai.js index 913b9c06b..c044c9796 100644 --- a/public/scripts/openai.js +++ b/public/scripts/openai.js @@ -5281,9 +5281,11 @@ $(document).ready(async function () { saveSettingsDebounced(); }); - $(document).on('input', '#openai_settings .autoSetHeight', function () { - resetScrollHeight($(this)); - }); + if (!CSS.supports('field-sizing', 'content')) { + $(document).on('input', '#openai_settings .autoSetHeight', function () { + resetScrollHeight($(this)); + }); + } if (!isMobile()) { $('#model_openrouter_select').select2({ diff --git a/public/scripts/power-user.js b/public/scripts/power-user.js index f57a15914..5270623ae 100644 --- a/public/scripts/power-user.js +++ b/public/scripts/power-user.js @@ -105,9 +105,6 @@ export const persona_description_positions = { NONE: 9, }; -const chromeUaIdx = navigator.userAgent.lastIndexOf('Chrome/'); -const chromeVersion = navigator.userAgent.substring(chromeUaIdx + 7, navigator.userAgent.indexOf('.', chromeUaIdx)); - let power_user = { tokenizer: tokenizers.BEST_MATCH, token_padding: 64, @@ -1757,7 +1754,7 @@ async function loadContextSettings() { power_user.context[control.property] = value; } console.log(`Setting ${$element.prop('id')} to ${value}`); - if (chromeUaIdx == -1 || Number(chromeVersion) < 123) { + if (!CSS.supports('field-sizing', 'content')) { await resetScrollHeight($(this)); } saveSettingsDebounced(); diff --git a/public/scripts/utils.js b/public/scripts/utils.js index 025eb599e..fc83b4a50 100644 --- a/public/scripts/utils.js +++ b/public/scripts/utils.js @@ -2027,11 +2027,8 @@ export function toggleDrawer(drawer, expand = true) { content.style.display = 'none'; } - const chromeUaIdx = navigator.userAgent.lastIndexOf('Chrome/'); - const chromeVersion = navigator.userAgent.substring(chromeUaIdx + 7, navigator.userAgent.indexOf('.', chromeUaIdx)); - // Set the height of "autoSetHeight" textareas within the inline-drawer to their scroll height - if (chromeUaIdx == -1 || Number(chromeVersion) < 123) { + if (!CSS.supports('field-sizing', 'content')) { content.querySelectorAll('textarea.autoSetHeight').forEach(resetScrollHeight); } } From dec85c42f7e6db537ea06484972e514f64d790da Mon Sep 17 00:00:00 2001 From: Cohee <18619528+Cohee1207@users.noreply.github.com> Date: Thu, 5 Sep 2024 20:07:37 +0300 Subject: [PATCH 3/8] These should be function calls --- public/scripts/instruct-mode.js | 2 +- public/scripts/power-user.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/public/scripts/instruct-mode.js b/public/scripts/instruct-mode.js index b4aa080c0..400dcc9da 100644 --- a/public/scripts/instruct-mode.js +++ b/public/scripts/instruct-mode.js @@ -99,7 +99,7 @@ export async function loadInstructMode(data) { } $element.on('input', async function () { - power_user.instruct[control.property] = control.isCheckbox ? !!$(this).prop('checked') : $(this).val; + power_user.instruct[control.property] = control.isCheckbox ? !!$(this).prop('checked') : $(this).val(); if (!CSS.supports('field-sizing', 'content')) { await resetScrollHeight($(this)); } diff --git a/public/scripts/power-user.js b/public/scripts/power-user.js index 5270623ae..2eb7aaf11 100644 --- a/public/scripts/power-user.js +++ b/public/scripts/power-user.js @@ -3099,7 +3099,7 @@ $(document).ready(() => { }); $('#start_reply_with').on('input', function () { - power_user.user_prompt_bias = String($(this).val); + power_user.user_prompt_bias = String($(this).val()); saveSettingsDebounced(); }); @@ -3631,7 +3631,7 @@ $(document).ready(() => { }); $('#custom_stopping_strings').on('input', function () { - power_user.custom_stopping_strings = String($(this).val).trim(); + power_user.custom_stopping_strings = String($(this).val()).trim(); saveSettingsDebounced(); }); From 1d390195fef75093a465bec2a25d55399b481106 Mon Sep 17 00:00:00 2001 From: Cohee <18619528+Cohee1207@users.noreply.github.com> Date: Thu, 5 Sep 2024 20:12:29 +0300 Subject: [PATCH 4/8] Remove obsolete styles --- public/style.css | 12 +----------- 1 file changed, 1 insertion(+), 11 deletions(-) diff --git a/public/style.css b/public/style.css index e59fc75ef..189bc39cd 100644 --- a/public/style.css +++ b/public/style.css @@ -5455,16 +5455,6 @@ body:not(.movingUI) .drawer-content.maximized { opacity: 0.7; } -#advanced-formatting-button div[contenteditable] { +#AdvancedFormatting .autoSetHeight { overflow-wrap: anywhere; - max-height: 50vh; - max-height: 50dvh; - resize: vertical; - overflow: auto; - min-height: 1.8em; - white-space: preserve-breaks; } - -div[contenteditable] br { - display: revert; -} \ No newline at end of file From 5c7b95cc152482632fdd4cff3ca23e508a0728e9 Mon Sep 17 00:00:00 2001 From: Cohee <18619528+Cohee1207@users.noreply.github.com> Date: Thu, 5 Sep 2024 20:13:59 +0300 Subject: [PATCH 5/8] Move CSS check up --- public/scripts/group-chats.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/public/scripts/group-chats.js b/public/scripts/group-chats.js index 82772a8bd..8b1c60f80 100644 --- a/public/scripts/group-chats.js +++ b/public/scripts/group-chats.js @@ -1966,11 +1966,11 @@ function doCurMemberListPopout() { } jQuery(() => { - $(document).on('input', '#rm_group_chats_block .autoSetHeight', function () { - if (!CSS.supports('field-sizing', 'content')) { + if (!CSS.supports('field-sizing', 'content')) { + $(document).on('input', '#rm_group_chats_block .autoSetHeight', function () { resetScrollHeight($(this)); - } - }); + }); + } $(document).on('click', '.group_select', function () { const groupId = $(this).attr('chid') || $(this).attr('grid') || $(this).data('id'); From 733bb8404484e3a1f9e8dbde3a1a72119d8d49bf Mon Sep 17 00:00:00 2001 From: Cohee <18619528+Cohee1207@users.noreply.github.com> Date: Thu, 5 Sep 2024 20:16:58 +0300 Subject: [PATCH 6/8] Fix "system as user" toggle --- public/index.html | 2 +- public/scripts/instruct-mode.js | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/public/index.html b/public/index.html index fc67b8966..9a495629b 100644 --- a/public/index.html +++ b/public/index.html @@ -6504,4 +6504,4 @@ - \ No newline at end of file + diff --git a/public/scripts/instruct-mode.js b/public/scripts/instruct-mode.js index 400dcc9da..9efd92dc3 100644 --- a/public/scripts/instruct-mode.js +++ b/public/scripts/instruct-mode.js @@ -614,13 +614,13 @@ jQuery(() => { if (state) { $('#instruct_system_sequence_block').addClass('disabled'); $('#instruct_system_suffix_block').addClass('disabled'); - $('#instruct_system_sequence').prop('contenteditable', false); - $('#instruct_system_suffix').prop('contenteditable', false); + $('#instruct_system_sequence').prop('readOnly', true); + $('#instruct_system_suffix').prop('readOnly', true); } else { $('#instruct_system_sequence_block').removeClass('disabled'); $('#instruct_system_suffix_block').removeClass('disabled'); - $('#instruct_system_sequence').prop('contenteditable', true); - $('#instruct_system_suffix').prop('contenteditable', true); + $('#instruct_system_sequence').prop('readOnly', false); + $('#instruct_system_suffix').prop('readOnly', false); } }); From e335b62b0bcc5b075635cf7920fffa009fd338be Mon Sep 17 00:00:00 2001 From: Cohee <18619528+Cohee1207@users.noreply.github.com> Date: Thu, 5 Sep 2024 20:20:42 +0300 Subject: [PATCH 7/8] Remove CSS height set on system sequences --- public/scripts/instruct-mode.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/public/scripts/instruct-mode.js b/public/scripts/instruct-mode.js index 9efd92dc3..0767fad61 100644 --- a/public/scripts/instruct-mode.js +++ b/public/scripts/instruct-mode.js @@ -111,9 +111,6 @@ export async function loadInstructMode(data) { } }); - $('#instruct_system_sequence').css('height', 'auto'); - $('#instruct_system_suffix').css('height', 'auto'); - instruct_presets.forEach((preset) => { const name = preset.name; const option = document.createElement('option'); From 185079595d9c43f2c5144d87453fecde4862cd08 Mon Sep 17 00:00:00 2001 From: Cohee <18619528+Cohee1207@users.noreply.github.com> Date: Thu, 5 Sep 2024 20:22:36 +0300 Subject: [PATCH 8/8] Disabled cursor behaves weirdly --- public/css/st-tailwind.css | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/public/css/st-tailwind.css b/public/css/st-tailwind.css index 1f0975e48..69f5843a9 100644 --- a/public/css/st-tailwind.css +++ b/public/css/st-tailwind.css @@ -494,12 +494,15 @@ } input:disabled, -textarea:disabled, -#AdvancedFormatting .disabled { +textarea:disabled { cursor: not-allowed; filter: brightness(0.5); } +#AdvancedFormatting .disabled { + filter: brightness(0.5); +} + .debug-red { border: 1px solid red !important; }