thubmnail fix for vid preview in shitpost mode upload

This commit is contained in:
2026-07-15 17:45:39 +02:00
parent 9e9fd4adf3
commit d53a635495

View File

@@ -1233,27 +1233,35 @@ window.initUploadForm = (selector) => {
mediaElem = document.createElement('img'); mediaElem = document.createElement('img');
mediaElem.src = URL.createObjectURL(file); mediaElem.src = URL.createObjectURL(file);
} else if (file.type.startsWith('video/')) { } else if (file.type.startsWith('video/')) {
mediaElem = document.createElement('video'); const videoElem = document.createElement('video');
mediaElem.src = URL.createObjectURL(file); videoElem.src = URL.createObjectURL(file);
mediaElem.muted = true; videoElem.muted = true;
mediaElem.controls = true; videoElem.controls = true;
mediaElem.loop = true; videoElem.loop = true;
if (isShitpost) { if (isShitpost) {
mediaElem.autoplay = false; videoElem.autoplay = false;
mediaElem.preload = 'none'; videoElem.preload = 'none';
mediaElem.classList.add('video-thumbnail-loading'); videoElem.classList.add('video-thumbnail-loading');
videoThumbnailQueue.add(file, (dataUrl) => { videoThumbnailQueue.add(file, (dataUrl) => {
if (dataUrl) { if (dataUrl) {
mediaElem.poster = dataUrl; videoElem.poster = dataUrl;
mediaElem.classList.remove('video-thumbnail-loading'); videoElem.classList.remove('video-thumbnail-loading');
} else { } else {
mediaElem.classList.remove('video-thumbnail-loading'); videoElem.classList.remove('video-thumbnail-loading');
} }
}); });
// Wrap immediately so mediaElem is always the rigid container
const videoWrapper = document.createElement('div');
videoWrapper.className = 'preview-media-small preview-video-wrapper';
videoElem.style.cssText = 'width:100%;height:100%;display:block;object-fit:contain;';
videoWrapper.appendChild(videoElem);
mediaElem = videoWrapper;
} else { } else {
mediaElem.autoplay = true; videoElem.autoplay = true;
mediaElem = videoElem;
} }
} else if (file.type.startsWith('audio/')) { } else if (file.type.startsWith('audio/')) {
mediaElem = document.createElement('audio'); mediaElem = document.createElement('audio');
@@ -1415,15 +1423,8 @@ window.initUploadForm = (selector) => {
} }
// preview-media-small sizing only applies to standalone (non-col) media // preview-media-small sizing only applies to standalone (non-col) media
if (!mediaCol) { if (!mediaCol) {
// In shitpost mode, wrap videos in a rigid container to prevent Chrome from // Videos in shitpost mode were already wrapped at creation time (above)
// expanding the video element when native controls are clicked if (!mediaElem.classList.contains('preview-media-small') && !mediaElem.classList.contains('preview-video-wrapper')) {
if (isShitpost && mediaElem.tagName === 'VIDEO') {
const videoWrapper = document.createElement('div');
videoWrapper.className = 'preview-media-small preview-video-wrapper';
mediaElem.style.cssText = 'width:100%;height:100%;display:block;object-fit:contain;';
videoWrapper.appendChild(mediaElem);
mediaElem = videoWrapper;
} else {
mediaElem.classList.add('preview-media-small'); mediaElem.classList.add('preview-media-small');
} }
} }