mirror of
https://github.com/SillyTavern/SillyTavern.git
synced 2025-06-05 21:59:27 +02:00
Add option to toggle magnification behaviour
This commit is contained in:
@ -3739,6 +3739,11 @@
|
||||
<span data-i18n="Tags as Folders">Tags as Folders</span>
|
||||
<i title="Recent change: Tags must be marked as folders in the Tag Management menu to appear as such. Click here to bring it up." class="tags_view right_menu_button fa-solid fa-circle-exclamation"></i>
|
||||
</label>
|
||||
<label for="zoomed_avatar_magnification" class="checkbox_label" title="Enable magnification for zoomed avatar display." data-i18n="[title]Enable magnification for zoomed avatar display.">
|
||||
<input id="zoomed_avatar_magnification" type="checkbox" />
|
||||
<span data-i18n="Avatar Hover Magnification">Avatar Hover Magnification</span>
|
||||
<i title="Enables a magnification effect on hover when you display the zoomed avatar after clicking an avatar's image in chat." class="right_menu_button fa-solid fa-circle-exclamation"></i>
|
||||
</label>
|
||||
</div>
|
||||
<h4><span data-i18n="Miscellaneous">Miscellaneous</span></h4>
|
||||
<div title="If set in the advanced character definitions, this field will be displayed in the characters list." data-i18n="[title]If set in the advanced character definitions, this field will be displayed in the characters list.">
|
||||
|
@ -10226,28 +10226,27 @@ jQuery(async function () {
|
||||
|
||||
$('body').append(newElement);
|
||||
newElement.fadeIn();
|
||||
if (messageElement.attr('is_user') == 'true') { //handle user avatars
|
||||
$(`.zoomed_avatar[forChar="${charname}"] img`).attr('src', thumbURL);
|
||||
$(`.zoomed_avatar[forChar="${charname}"] img`).attr('data-izoomify-url', thumbURL);
|
||||
} else if (messageElement.attr('is_system') == 'true' && !isValidCharacter) { //handle system avatars
|
||||
$(`.zoomed_avatar[forChar="${charname}"] img`).attr('src', thumbURL);
|
||||
$(`.zoomed_avatar[forChar="${charname}"] img`).attr('data-izoomify-url', thumbURL);
|
||||
const zoomedAvatarImgElement = $(`.zoomed_avatar[forChar="${charname}"] img`);
|
||||
if (messageElement.attr('is_user') == 'true' || (messageElement.attr('is_system') == 'true' && !isValidCharacter)) { //handle user and system avatars
|
||||
zoomedAvatarImgElement.attr('src', thumbURL);
|
||||
zoomedAvatarImgElement.attr('data-izoomify-url', thumbURL);
|
||||
} else if (messageElement.attr('is_user') == 'false') { //handle char avatars
|
||||
$(`.zoomed_avatar[forChar="${charname}"] img`).attr('src', avatarSrc);
|
||||
$(`.zoomed_avatar[forChar="${charname}"] img`).attr('data-izoomify-url', avatarSrc);
|
||||
zoomedAvatarImgElement.attr('src', avatarSrc);
|
||||
zoomedAvatarImgElement.attr('data-izoomify-url', avatarSrc);
|
||||
}
|
||||
loadMovingUIState();
|
||||
$(`.zoomed_avatar[forChar="${charname}"]`).css('display', 'flex');
|
||||
dragElement(newElement);
|
||||
|
||||
$('.zoomed_avatar_container').izoomify();
|
||||
if (power_user.zoomed_avatar_magnification)
|
||||
$('.zoomed_avatar_container').izoomify();
|
||||
|
||||
$(`.zoomed_avatar[forChar="${charname}"] img`).on('click', (e) => {
|
||||
zoomedAvatarImgElement.on('click', (e) => {
|
||||
$(`.zoomed_avatar[forChar="${charname}"]`).fadeOut();
|
||||
setTimeout(function() { $(`.zoomed_avatar[forChar="${charname}"]`).remove(); }, 410);
|
||||
});
|
||||
|
||||
$(`.zoomed_avatar[forChar="${charname}"] img`).on('dragstart', (e) => {
|
||||
zoomedAvatarImgElement.on('dragstart', (e) => {
|
||||
console.log('saw drag on avatar!');
|
||||
e.preventDefault();
|
||||
return false;
|
||||
|
@ -247,6 +247,7 @@ let power_user = {
|
||||
encode_tags: false,
|
||||
servers: [],
|
||||
bogus_folders: false,
|
||||
zoomed_avatar_magnification: false,
|
||||
show_tag_filters: false,
|
||||
aux_field: 'character_version',
|
||||
restore_user_input: true,
|
||||
@ -1303,6 +1304,13 @@ async function applyTheme(name) {
|
||||
printCharactersDebounced();
|
||||
},
|
||||
},
|
||||
{
|
||||
key: 'zoomed_avatar_magnification',
|
||||
action: async () => {
|
||||
$('#zoomed_avatar_magnification').prop('checked', power_user.zoomed_avatar_magnification);
|
||||
printCharactersDebounced();
|
||||
},
|
||||
},
|
||||
{
|
||||
key: 'reduced_motion',
|
||||
action: async () => {
|
||||
@ -1498,6 +1506,7 @@ function loadPowerUserSettings(settings, data) {
|
||||
$('#auto_fix_generated_markdown').prop('checked', power_user.auto_fix_generated_markdown);
|
||||
$('#auto_scroll_chat_to_bottom').prop('checked', power_user.auto_scroll_chat_to_bottom);
|
||||
$('#bogus_folders').prop('checked', power_user.bogus_folders);
|
||||
$('#zoomed_avatar_magnification').prop('checked', power_user.zoomed_avatar_magnification);
|
||||
$(`#tokenizer option[value="${power_user.tokenizer}"]`).attr('selected', true);
|
||||
$(`#send_on_enter option[value=${power_user.send_on_enter}]`).attr('selected', true);
|
||||
$('#import_card_tags').prop('checked', power_user.import_card_tags);
|
||||
@ -2148,6 +2157,7 @@ async function saveTheme(name = undefined) {
|
||||
hotswap_enabled: power_user.hotswap_enabled,
|
||||
custom_css: power_user.custom_css,
|
||||
bogus_folders: power_user.bogus_folders,
|
||||
zoomed_avatar_magnification: power_user.zoomed_avatar_magnification,
|
||||
reduced_motion: power_user.reduced_motion,
|
||||
compact_input_area: power_user.compact_input_area,
|
||||
};
|
||||
@ -3410,8 +3420,13 @@ $(document).ready(() => {
|
||||
});
|
||||
|
||||
$('#bogus_folders').on('input', function () {
|
||||
const value = !!$(this).prop('checked');
|
||||
power_user.bogus_folders = value;
|
||||
power_user.bogus_folders = !!$(this).prop('checked');
|
||||
printCharactersDebounced();
|
||||
saveSettingsDebounced();
|
||||
});
|
||||
|
||||
$('#zoomed_avatar_magnification').on('input', function () {
|
||||
power_user.zoomed_avatar_magnification = !!$(this).prop('checked');
|
||||
printCharactersDebounced();
|
||||
saveSettingsDebounced();
|
||||
});
|
||||
|
Reference in New Issue
Block a user