From 283bcdc905fa409a72e9c83067a0c772b778fff0 Mon Sep 17 00:00:00 2001
From: coomdev <coomer@coom.tech>
Date: Sat, 1 Jan 2022 22:01:17 +0100
Subject: [PATCH] Merge some of Zip's fixes

---
 src/main.ts | 22 ++++++++++++++++------
 1 file changed, 16 insertions(+), 6 deletions(-)

diff --git a/src/main.ts b/src/main.ts
index 2eb2b91..cc696da 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -87,19 +87,26 @@ const processPost = async (post: HTMLDivElement) => {
     </a>`;
     const a = document.createRange().createContextualFragment(cf).children[0] as HTMLAnchorElement;
     const type = await fileTypeFromBuffer(res.data);
-    let cont: HTMLImageElement | HTMLVideoElement;
+    let cont: HTMLImageElement | HTMLVideoElement | HTMLAudioElement;
     let w: number, h: number;
     if (type?.mime.startsWith("image")) {
         cont = document.createElement("img");
     } else if (type?.mime.startsWith("video")) {
         cont = document.createElement("video");
+    } else if (type?.mime.startsWith("audio")) {
+        cont = document.createElement("audio");
     } else
         return; // TODO: handle new file types??? Or direct "download"?
 
-    cont.src = URL.createObjectURL(new Blob([res.data]));
+    cont.src = URL.createObjectURL(new Blob([res.data], { type: type.mime }));
 
     await new Promise(res => {
-        cont.onload = res;
+        if (cont instanceof HTMLImageElement)
+            cont.onload = res;
+        else if (cont instanceof HTMLVideoElement)
+            cont.onloadedmetadata = res;
+        else if (cont instanceof HTMLAudioElement)
+            cont.onloadedmetadata = res;
     });
 
     if (cont instanceof HTMLImageElement) {
@@ -108,8 +115,12 @@ const processPost = async (post: HTMLDivElement) => {
     }
 
     if (cont instanceof HTMLVideoElement) {
-        w = cont.width;
-        h = cont.height;
+        w = cont.videoWidth;
+        h = cont.videoHeight;
+    }
+
+    if (cont instanceof HTMLAudioElement || cont instanceof HTMLVideoElement) {
+        cont.controls = true;
     }
 
     const contract = () => {
@@ -172,7 +183,6 @@ const startup = async () => {
     };
 
     let injected = false;
-    debugger;
     document.addEventListener('QRDialogCreation', <any>((e: CustomEvent<string>) => {
         if (injected)
             return;