Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
chenpangpang
open-webui
Commits
948d29b6
Commit
948d29b6
authored
Aug 04, 2024
by
Zhuoran
Browse files
Add option to toggle scrolling to bottom when switching between branches
parent
a75a9c95
Changes
2
Show whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
43 additions
and
10 deletions
+43
-10
src/lib/components/chat/Messages.svelte
src/lib/components/chat/Messages.svelte
+14
-10
src/lib/components/chat/Settings/Interface.svelte
src/lib/components/chat/Settings/Interface.svelte
+29
-0
No files found.
src/lib/components/chat/Messages.svelte
View file @
948d29b6
...
@@ -146,12 +146,14 @@
...
@@ -146,12 +146,14 @@
await tick();
await tick();
if ($settings.scrollOnBranchChange) {
const element = document.getElementById('messages-container');
const element = document.getElementById('messages-container');
autoScroll = element.scrollHeight - element.scrollTop <= element.clientHeight + 50;
autoScroll = element.scrollHeight - element.scrollTop <= element.clientHeight + 50;
setTimeout(() => {
setTimeout(() => {
scrollToBottom();
scrollToBottom();
}, 100);
}, 100);
}
};
};
const showNextMessage = async (message) => {
const showNextMessage = async (message) => {
...
@@ -195,12 +197,14 @@
...
@@ -195,12 +197,14 @@
await tick();
await tick();
if ($settings.scrollOnBranchChange) {
const element = document.getElementById('messages-container');
const element = document.getElementById('messages-container');
autoScroll = element.scrollHeight - element.scrollTop <= element.clientHeight + 50;
autoScroll = element.scrollHeight - element.scrollTop <= element.clientHeight + 50;
setTimeout(() => {
setTimeout(() => {
scrollToBottom();
scrollToBottom();
}, 100);
}, 100);
}
};
};
const deleteMessageHandler = async (messageId) => {
const deleteMessageHandler = async (messageId) => {
...
...
src/lib/components/chat/Settings/Interface.svelte
View file @
948d29b6
...
@@ -22,6 +22,7 @@
...
@@ -22,6 +22,7 @@
let responseAutoCopy = false;
let responseAutoCopy = false;
let widescreenMode = false;
let widescreenMode = false;
let splitLargeChunks = false;
let splitLargeChunks = false;
let scrollOnBranchChange = true;
let userLocation = false;
let userLocation = false;
// Interface
// Interface
...
@@ -39,6 +40,11 @@
...
@@ -39,6 +40,11 @@
saveSettings({ splitLargeChunks: splitLargeChunks });
saveSettings({ splitLargeChunks: splitLargeChunks });
};
};
const togglesScrollOnBranchChange = async () => {
scrollOnBranchChange = !scrollOnBranchChange;
saveSettings({ scrollOnBranchChange: scrollOnBranchChange });
};
const togglewidescreenMode = async () => {
const togglewidescreenMode = async () => {
widescreenMode = !widescreenMode;
widescreenMode = !widescreenMode;
saveSettings({ widescreenMode: widescreenMode });
saveSettings({ widescreenMode: widescreenMode });
...
@@ -141,6 +147,7 @@
...
@@ -141,6 +147,7 @@
chatBubble = $settings.chatBubble ?? true;
chatBubble = $settings.chatBubble ?? true;
widescreenMode = $settings.widescreenMode ?? false;
widescreenMode = $settings.widescreenMode ?? false;
splitLargeChunks = $settings.splitLargeChunks ?? false;
splitLargeChunks = $settings.splitLargeChunks ?? false;
scrollOnBranchChange = $settings.scrollOnBranchChange ?? true;
chatDirection = $settings.chatDirection ?? 'LTR';
chatDirection = $settings.chatDirection ?? 'LTR';
userLocation = $settings.userLocation ?? false;
userLocation = $settings.userLocation ?? false;
...
@@ -318,6 +325,28 @@
...
@@ -318,6 +325,28 @@
</div>
</div>
</div>
</div>
<div>
<div class=" py-0.5 flex w-full justify-between">
<div class=" self-center text-xs">
{$i18n.t('Scroll to bottom when switching between branches')}
</div>
<button
class="p-1 px-3 text-xs flex rounded transition"
on:click={() => {
togglesScrollOnBranchChange();
}}
type="button"
>
{#if scrollOnBranchChange === true}
<span class="ml-2 self-center">{$i18n.t('On')}</span>
{:else}
<span class="ml-2 self-center">{$i18n.t('Off')}</span>
{/if}
</button>
</div>
</div>
<div>
<div>
<div class=" py-0.5 flex w-full justify-between">
<div class=" py-0.5 flex w-full justify-between">
<div class=" self-center text-xs">
<div class=" self-center text-xs">
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment