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

Made attached images clickable — no more fiddling with the spyglass pictogram. Augmented the "Enlarge" button's function to retain it.

Browse Source
This commit is contained in:
Gness Erquint
2025-04-01 05:35:24 +03:00
parent 26d0f01d69
commit 864859dd6b
2 changed files with 14 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
public/scripts/chats.js
View File

@@ -575,8 +575,8 @@ export function isExternalMediaAllowed() {
return !power_user.forbid_external_media; return !power_user.forbid_external_media;
} }
async function enlargeMessageImage() { function expandMessageImage(event) {
const mesBlock = $(this).closest('.mes'); const mesBlock = $(event.currentTarget).closest('.mes');
const mesId = mesBlock.attr('mesid'); const mesId = mesBlock.attr('mesid');
const message = chat[mesId]; const message = chat[mesId];
const imgSrc = message?.extra?.image; const imgSrc = message?.extra?.image;
@@ -620,7 +620,12 @@ async function enlargeMessageImage() {
popup.completeCancelled(); popup.completeCancelled();
}); });
await popup.show(); popup.show();
return img;
}
function expandAndZoomMessageImage(event) {
expandMessageImage(event).click();
} }
async function deleteMessageImage() { async function deleteMessageImage() {
@@ -1603,7 +1608,8 @@ jQuery(function () {
reloadCurrentChat(); reloadCurrentChat();
}); });
$(document).on('click', '.mes_img_enlarge', enlargeMessageImage); $(document).on('click', '.mes_img.img_inline', expandMessageImage);
$(document).on('click', '.mes_img_enlarge', expandAndZoomMessageImage);
$(document).on('click', '.mes_img_delete', deleteMessageImage); $(document).on('click', '.mes_img_delete', deleteMessageImage);
$('#file_form_input').on('change', async () => { $('#file_form_input').on('change', async () => {

4
public/style.css
View File

@@ -4990,6 +4990,10 @@ a:hover {
padding: 0.5rem; padding: 0.5rem;
} }
.mes_img.img_inline {
cursor: pointer;
}
.mes_img { .mes_img {
border-radius: 10px; border-radius: 10px;
max-width: 100%; max-width: 100%;