rixty/SillyTavern
1
0
Fork 0
mirror of https://github.com/SillyTavern/SillyTavern.git synced 2025-06-05 21:59:27 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2090 from Dakraid/feature/zoomed-avatar-tweaks

Browse Source 
Adjust style and add magnification to zoomed avatar
This commit is contained in:
Cohee
2024-04-15 00:44:27 +03:00
committed by GitHub
parent 4a553e1fc8 54eec3e215
commit f7eb57082a
7 changed files with 329 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
public/script.js
View File

@@ -10227,7 +10227,9 @@ jQuery(async function () {
const avatarSrc = isDataURL(thumbURL) ? thumbURL : charsPath + targetAvatarImg;
if ($(`.zoomed_avatar[forChar="${charname}"]`).length) {
console.debug('removing container as it already existed');
$(`.zoomed_avatar[forChar="${charname}"]`).remove();
$(`.zoomed_avatar[forChar="${charname}"]`).fadeOut(animation_duration, () => {
$(`.zoomed_avatar[forChar="${charname}"]`).remove();
});
} else {
console.debug('making new container from template');
const template = $('#zoomed_avatar_template').html();
@@ -10238,18 +10240,43 @@ jQuery(async function () {
newElement.find('.drag-grabber').attr('id', `zoomFor_${charname}header`);
$('body').append(newElement);
if (messageElement.attr('is_user') == 'true') { //handle user avatars
$(`.zoomed_avatar[forChar="${charname}"] img`).attr('src', thumbURL);
} else if (messageElement.attr('is_system') == 'true' && !isValidCharacter) { //handle system avatars
$(`.zoomed_avatar[forChar="${charname}"] img`).attr('src', thumbURL);
newElement.fadeIn(animation_duration);
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);
zoomedAvatarImgElement.attr('src', avatarSrc);
zoomedAvatarImgElement.attr('data-izoomify-url', avatarSrc);
}
loadMovingUIState();
$(`.zoomed_avatar[forChar="${charname}"]`).css('display', 'block');
$(`.zoomed_avatar[forChar="${charname}"]`).css('display', 'flex');
dragElement(newElement);
$(`.zoomed_avatar[forChar="${charname}"] img`).on('dragstart', (e) => {
if (power_user.zoomed_avatar_magnification) {
$('.zoomed_avatar_container').izoomify();
} else {
$(`.zoomed_avatar[forChar="${charname}"] .dragClose`).hide();
}
$('.zoomed_avatar').on('mouseup', (e) => {
if (e.target.closest('.drag-grabber')) {
return;
}
$(`.zoomed_avatar[forChar="${charname}"]`).fadeOut(animation_duration, () => {
$(`.zoomed_avatar[forChar="${charname}"]`).remove();
});
});
$('.zoomed_avatar, .zoomed_avatar .dragClose').on('click touchend', (e) => {
if (e.target.closest('.dragClose')) {
$(`.zoomed_avatar[forChar="${charname}"]`).fadeOut(animation_duration, () => {
$(`.zoomed_avatar[forChar="${charname}"]`).remove();
});
}
});
zoomedAvatarImgElement.on('dragstart', (e) => {
console.log('saw drag on avatar!');
e.preventDefault();
return false;