imgfloat/server
1
0
Fork 0
mirror of https://github.com/imgfloat/server.git synced 2026-02-05 11:49:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

Move duration badge to settings

Browse Source
This commit is contained in:
Andreas Krühlmann
2025-12-11 01:40:46 +01:00
parent e63ece3aa0
commit 5a740bec23
1 changed files with 28 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/main/resources/static/js/admin.js
View File

@@ -1185,16 +1185,6 @@ function renderAssetList() {
meta.appendChild(name); meta.appendChild(name);
meta.appendChild(details); meta.appendChild(details);
const badges = document.createElement('div');
badges.className = 'badge-row asset-detail';
const durationLabel = getDurationBadge(asset);
if (durationLabel) {
badges.appendChild(createBadge(durationLabel, 'subtle'));
}
if (badges.children.length > 0) {
meta.appendChild(badges);
}
const actions = document.createElement('div'); const actions = document.createElement('div');
actions.className = 'actions'; actions.className = 'actions';
@@ -1436,6 +1426,8 @@ function captureVideoFrame(asset) {
video.playsInline = true; video.playsInline = true;
video.src = asset.url; video.src = asset.url;
video.addEventListener('loadedmetadata', () => recordDuration(asset.id, video.duration), { once: true });
const cleanup = () => { const cleanup = () => {
video.pause(); video.pause();
video.removeAttribute('src'); video.removeAttribute('src');
@@ -1591,6 +1583,8 @@ function updateSelectedAssetSummary(asset) {
assetInspector.classList.toggle('hidden', !asset && !assets.size); assetInspector.classList.toggle('hidden', !asset && !assets.size);
} }
ensureDurationMetadata(asset);
if (selectedAssetName) { if (selectedAssetName) {
selectedAssetName.textContent = asset ? (asset.name || `Asset ${asset.id.slice(0, 6)}`) : 'Choose an asset'; selectedAssetName.textContent = asset ? (asset.name || `Asset ${asset.id.slice(0, 6)}`) : 'Choose an asset';
} }
@@ -1667,6 +1661,30 @@ function updateSelectedAssetSummary(asset) {
} }
} }
function ensureDurationMetadata(asset) {
if (!asset || hasDuration(asset) || (!isVideoAsset(asset) && !isAudioAsset(asset))) {
return;
}
const element = document.createElement(isVideoAsset(asset) ? 'video' : 'audio');
element.preload = 'metadata';
element.muted = true;
element.playsInline = true;
element.src = asset.url;
const cleanup = () => {
element.removeAttribute('src');
element.load();
};
element.addEventListener('loadedmetadata', () => {
recordDuration(asset.id, element.duration);
cleanup();
}, { once: true });
element.addEventListener('error', cleanup, { once: true });
}
function applyTransformFromInputs() { function applyTransformFromInputs() {
const asset = getSelectedAsset(); const asset = getSelectedAsset();
if (!asset) return; if (!asset) return;