mirror of
https://github.com/SillyTavern/SillyTavern.git
synced 2025-06-05 21:59:27 +02:00
Add lazy chat messages rendering
This commit is contained in:
@ -2472,6 +2472,22 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
<span data-i18n="Lazy Chat Loading">Lazy Chat Loading</span><br>
|
||||
<small># of messages (0 = disabled)</small>
|
||||
</div>
|
||||
<div class="range-block-range-and-counter">
|
||||
<div class="range-block-range">
|
||||
<input id="lazy_load" class="wide100p" type="range" min="0" max="100" step="10" value="0">
|
||||
<div class="slider_hint">
|
||||
<span>0</span>
|
||||
<span>50</span>
|
||||
<span>100</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<span data-i18n="Avatar Style">Avatar Style:</span><br>
|
||||
<label>
|
||||
|
@ -1193,6 +1193,16 @@ function printMessages() {
|
||||
chat.forEach(function (item, i, arr) {
|
||||
addOneMessage(item, { scroll: i === arr.length - 1 });
|
||||
});
|
||||
|
||||
if (power_user.lazy_load > 0) {
|
||||
const height = $('#chat').height();
|
||||
const scrollHeight = $('#chat').prop('scrollHeight');
|
||||
|
||||
// Only hide if oveflowing the scroll
|
||||
if (scrollHeight > height) {
|
||||
$('#chat').children('.mes').slice(0, -power_user.lazy_load).hide();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function clearChat() {
|
||||
@ -7144,6 +7154,17 @@ $(document).ready(function () {
|
||||
updateVisibleDivs('#rm_print_characters_block', true);
|
||||
}, 5));
|
||||
|
||||
$('#chat').on('scroll', async () => {
|
||||
// if on the start of the chat and has hidden messages
|
||||
if ($('#chat').scrollTop() === 0 && $('#chat').children('.mes').not(':visible').length > 0) {
|
||||
// show next hidden messages
|
||||
const prevHeight = $('#chat').prop('scrollHeight');
|
||||
$('#chat').children('.mes').not(':visible').slice(-power_user.lazy_load).show();
|
||||
const newHeight = $('#chat').prop('scrollHeight');
|
||||
$('#chat').scrollTop(newHeight - prevHeight);
|
||||
}
|
||||
});
|
||||
|
||||
$("#chat").on('mousewheel touchstart', () => {
|
||||
scrollLock = true;
|
||||
});
|
||||
|
@ -193,6 +193,7 @@ let power_user = {
|
||||
custom_stopping_strings_macro: true,
|
||||
fuzzy_search: false,
|
||||
encode_tags: false,
|
||||
lazy_load: 0,
|
||||
};
|
||||
|
||||
let themes = [];
|
||||
@ -688,6 +689,7 @@ function loadPowerUserSettings(settings, data) {
|
||||
$('#fuzzy_search_checkbox').prop("checked", power_user.fuzzy_search);
|
||||
$('#persona_show_notifications').prop("checked", power_user.persona_show_notifications);
|
||||
$('#encode_tags').prop("checked", power_user.encode_tags);
|
||||
$('#lazy_load').val(Number(power_user.lazy_load));
|
||||
|
||||
$("#console_log_prompts").prop("checked", power_user.console_log_prompts);
|
||||
$('#auto_fix_generated_markdown').prop("checked", power_user.auto_fix_generated_markdown);
|
||||
@ -2040,6 +2042,11 @@ $(document).ready(() => {
|
||||
saveSettingsDebounced();
|
||||
});
|
||||
|
||||
$('#lazy_load').on('input', function () {
|
||||
power_user.lazy_load = Number($(this).val());
|
||||
saveSettingsDebounced();
|
||||
});
|
||||
|
||||
$(window).on('focus', function () {
|
||||
browser_has_focus = true;
|
||||
});
|
||||
|
Reference in New Issue
Block a user