Update regarding image previews.
Some checks failed
CI / lint (push) Failing after 19s
Details
CI / test (3.8) (push) Failing after 18s
Details
CI / test (3.12) (push) Failing after 19s
Details
CI / test (3.9) (push) Failing after 19s
Details
CI / build (push) Failing after 20s
Details
CI / test (3.11) (push) Failing after 38s
Details
CI / test (3.10) (push) Failing after 39s
Details

Browse Source
This commit is contained in:
retoor 2025-12-12 19:00:51 +01:00
parent 213c299603
commit 7e8362f85a
2 changed files with 8 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
js/components/image-preview.js
View File

@ -10,7 +10,7 @@ import { buildDevrantImageUrl, isGifUrl } from '../utils/url.js';
class ImagePreview extends BaseComponent {
static get observedAttributes() {
return ['src', 'width', 'height', 'alt'];
return ['src', 'width', 'height', 'alt', 'external'];
}
init() {
@ -23,14 +23,15 @@ class ImagePreview extends BaseComponent {
const width = this.getAttr('width');
const height = this.getAttr('height');
const alt = this.getAttr('alt') || 'Image';
const external = this.hasAttribute('external');
if (!src) {
this.setHtml('');
return;
}
const imageUrl = buildDevrantImageUrl(src);
const isGif = isGifUrl(imageUrl);
const imageUrl = external ? src : buildDevrantImageUrl(src);
const isGif = isGifUrl(src);
const aspectRatio = width && height ? width / height : null;
this.addClass('image-preview');
@ -71,7 +72,8 @@ class ImagePreview extends BaseComponent {
const src = this.getAttr('src');
if (!src) return;
const imageUrl = buildDevrantImageUrl(src);
const external = this.hasAttribute('external');
const imageUrl = external ? src : buildDevrantImageUrl(src);
const lightbox = document.createElement('image-lightbox');
lightbox.setAttribute('src', imageUrl);

3
js/components/rant-content.js
View File

@ -53,11 +53,12 @@ class RantContent extends BaseComponent {
let html = `<div class="content-text">${renderedText}</div>`;
if (images.length > 0) {
const isExternal = links && links.length > 0;
html += `
<div class="content-images">
${images.map(url => {
const safeUrl = sanitizeUrl(url);
return safeUrl ? `<image-preview src="${safeUrl}"></image-preview>` : '';
return safeUrl ? `<image-preview src="${safeUrl}"${isExternal ? ' external' : ''}></image-preview>` : '';
}).join('')}
</div>
`;