david/video_upscaler
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement advanced AI enhancements UI tracking, styling, requirements, and documentation modal

Browse Source
This commit is contained in:
david
2026-06-24 13:45:34 -04:00
parent 212291ea94
commit 7b7cb2866a
7 changed files with 236 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/app.js
+54 -6
View File
@@ -600,6 +600,10 @@ generateVideoPreviewBtn.addEventListener("click", async () => {
const filterSharpen = document.getElementById("filter-sharpen");
const filterFps = document.getElementById("filter-fps");
const aiFaceRestoration = document.getElementById("ai-face-restoration");
const aiRifeInterpolation = document.getElementById("ai-rife-interpolation");
const aiAudioDenoise = document.getElementById("ai-audio-denoise");
const transcodeFormat = transcodeSelect.value;
try {
@@ -626,7 +630,10 @@ generateVideoPreviewBtn.addEventListener("click", async () => {
interpolation: filterFps.checked,
webhook_url: null,
transcode_format: transcodeFormat,
is_preview: true
is_preview: true,
ai_face_restoration: aiFaceRestoration ? aiFaceRestoration.checked : false,
ai_rife_interpolation: aiRifeInterpolation ? aiRifeInterpolation.checked : false,
ai_audio_denoise: aiAudioDenoise ? aiAudioDenoise.checked : false
})
});
@@ -711,6 +718,10 @@ startUpscaleBtn.addEventListener("click", async () => {
const filterSharpen = document.getElementById("filter-sharpen");
const filterFps = document.getElementById("filter-fps");
const webhookUrl = document.getElementById("webhook-url");
const aiFaceRestoration = document.getElementById("ai-face-restoration");
const aiRifeInterpolation = document.getElementById("ai-rife-interpolation");
const aiAudioDenoise = document.getElementById("ai-audio-denoise");
try {
const res = await fetch("/api/upscale/start", {
@@ -733,7 +744,10 @@ startUpscaleBtn.addEventListener("click", async () => {
denoise: filterDenoise.checked,
sharpen: filterSharpen.checked,
interpolation: filterFps.checked,
webhook_url: webhookUrl.value.trim() || null
webhook_url: webhookUrl.value.trim() || null,
ai_face_restoration: aiFaceRestoration ? aiFaceRestoration.checked : false,
ai_rife_interpolation: aiRifeInterpolation ? aiRifeInterpolation.checked : false,
ai_audio_denoise: aiAudioDenoise ? aiAudioDenoise.checked : false
})
});
@@ -816,6 +830,10 @@ function updateProgressUI(data) {
statusText = "Queued in pipeline. Waiting for GPU lock...";
} else if (data.status === "extracting") {
statusText = "Extracting video frames...";
} else if (data.status === "restoring_faces") {
statusText = "GFPGAN: Running Face Restoration on upscaled frames...";
} else if (data.status === "interpolating") {
statusText = "RIFE: Interpolating frames for smooth motion...";
} else if (data.status === "assembling") {
statusText = "Assembling video preview and audio tracks...";
}
@@ -891,6 +909,10 @@ function updateProgressUI(data) {
appendLogLine("FFmpeg: Splitting video stream to high-fidelity JPG frames...", "info");
} else if (data.status === "upscaling") {
appendLogLine(`Vulkan GPU: Processing frame ${data.current_frame} of ${data.total_frames} (ETA: ${data.eta})...`, "info");
} else if (data.status === "restoring_faces") {
appendLogLine("GFPGAN: Running Face Restoration on upscaled frames...", "info");
} else if (data.status === "interpolating") {
appendLogLine("RIFE: Interpolating frames for smooth motion...", "info");
} else if (data.status === "assembling") {
appendLogLine("FFmpeg: Reassembling enhanced frames & merging audio tracks...", "info");
} else if (data.status === "completed") {
@@ -1021,7 +1043,7 @@ async function checkActiveJobs() {
const jobs = await res.json();
const activeJob = jobs.find(job =>
["queued", "analyzing", "extracting", "upscaling", "assembling"].includes(job.status)
["queued", "analyzing", "extracting", "upscaling", "restoring_faces", "interpolating", "assembling"].includes(job.status)
);
if (activeJob) {
@@ -1318,7 +1340,7 @@ async function loadQueue() {
const jobs = await res.json();
const displayJobs = jobs.filter(job =>
["queued", "analyzing", "extracting", "upscaling", "assembling", "completed", "failed", "cancelled", "interrupted"].includes(job.status)
["queued", "analyzing", "extracting", "upscaling", "restoring_faces", "interpolating", "assembling", "completed", "failed", "cancelled", "interrupted"].includes(job.status)
);
if (displayJobs.length === 0) {
@@ -1380,7 +1402,7 @@ async function loadQueue() {
<i class="fa-solid fa-trash"></i> Clear
</button>
`;
} else if (["queued", "analyzing", "extracting", "upscaling", "assembling"].includes(job.status)) {
} else if (["queued", "analyzing", "extracting", "upscaling", "restoring_faces", "interpolating", "assembling"].includes(job.status)) {
actionsHtml = `
${reorderHtml}
<button class="btn btn-primary btn-small btn-view-job" data-id="${job.job_id}">
@@ -1401,7 +1423,7 @@ async function loadQueue() {
`;
}
const showProgress = ["analyzing", "extracting", "upscaling", "assembling"].includes(job.status);
const showProgress = ["analyzing", "extracting", "upscaling", "restoring_faces", "interpolating", "assembling"].includes(job.status);
const progressStyle = showProgress ? "display: block;" : "display: none;";
item.innerHTML = `
@@ -1757,6 +1779,32 @@ async function initializeApp() {
loadUploadsBrowser();
});
}
// Register documentation modal handlers
const docsBtn = document.getElementById("docs-btn");
const docsModal = document.getElementById("docs-modal");
const docsCloseBtn = document.getElementById("docs-modal-close-btn");
if (docsBtn && docsModal) {
docsBtn.addEventListener("click", () => {
docsModal.style.display = "flex";
document.body.style.overflow = "hidden";
});
}
if (docsCloseBtn && docsModal) {
docsCloseBtn.addEventListener("click", () => {
docsModal.style.display = "none";
document.body.style.overflow = "";
});
docsModal.addEventListener("click", (e) => {
if (e.target === docsModal) {
docsModal.style.display = "none";
document.body.style.overflow = "";
}
});
}
}
initializeApp();