web/queue: add gif pipeline & proper media type icons

web/src/lib/task-manager/queue.ts

@@ -1,11 +1,8 @@
-import { get } from "svelte/store";
-import { t } from "$lib/i18n/translations";
-import { addItem } from "$lib/state/task-manager/queue";
-import { createDialog } from "$lib/state/dialogs";
-import { openQueuePopover } from "$lib/state/queue-visibility";
 import { ffmpegMetadataArgs } from "$lib/util";
+import { addItem } from "$lib/state/task-manager/queue";
+import { openQueuePopover } from "$lib/state/queue-visibility";
 
-import type { CobaltPipelineItem } from "$lib/types/workers";
+import type { CobaltPipelineItem, CobaltPipelineResultFileType } from "$lib/types/workers";
 import type { CobaltLocalProcessingResponse, CobaltSaveRequestBody } from "$lib/types/api";
 
 export const getMediaType = (type: string) => {
@@ -56,6 +53,13 @@ export const createRemuxPipeline = (file: File) => {
     }
 }
 
+const mediaIcons: { [key: string]: CobaltPipelineResultFileType } = {
+    merge: "video",
+    mute: "video",
+    audio: "audio",
+    gif: "image"
+}
+
 export const createSavePipeline = (info: CobaltLocalProcessingResponse, request: CobaltSaveRequestBody) => {
     // TODO: proper error here
     if (!info.output?.filename || !info.output?.type) {
@@ -140,18 +144,23 @@ export const createSavePipeline = (info: CobaltLocalProcessingResponse, request:
             },
         });
     } else if (info.type === "gif") {
-        return createDialog({
+        pipeline.push({
-            id: "save-error",
+            worker: "encode",
-            type: "small",
+            workerId: crypto.randomUUID(),
-            meowbalt: "error",
+            parentId,
-            buttons: [
+            workerArgs: {
-                {
+                files: [],
-                    text: get(t)("button.gotit"),
+                ffargs: [
-                    main: true,
+                    "-vf",
-                    action: () => { },
+                    "scale=-1:-1:flags=lanczos,split[s0][s1];[s0]palettegen[p];[s1][p]paletteuse",
+                    "-loop", "0",
+                    "-f", "gif"
+                ],
+                output: {
+                    type: info.output.type,
+                    format: info.output.filename.split(".").pop(),
                 },
-            ],
+            },
-            bodyText: "audio and gif processing isn't implemented yet!",
         });
     }
 
@@ -163,7 +172,7 @@ export const createSavePipeline = (info: CobaltLocalProcessingResponse, request:
         originalRequest: request,
         filename: info.output.filename,
         mimeType: info.output.type,
-        mediaType: "video",
+        mediaType: mediaIcons[info.type],
     });
 
     openQueuePopover();