Add chromium support:

- replace all calls to .bytes() and .toBase64() with functions which call those methods when avaliable, but fall back to more supported methods for compatiability
- remove unneeded console.log calls (will improve error info later)
- move audio definition to start of class to prevent multiple audio sources

src/pages/index.astro

···
       }
     }
 
+    const blobBytes = async (blob: Blob) => {
+      if ("bytes" in blob) return blob.bytes();
+      return new Response(blob).arrayBuffer().then((buffer) => {
+        const uint = new Uint8Array(buffer);
+        return uint;
+      });
+    };
+
+    const uint8array64 = (arru8: Uint8Array) => {
+      if ("toBase64" in arru8) return arru8.toBase64();
+
+      function _arrayBufferToBase64(bytes: Uint8Array) {
+        var binary = "";
+        var len = bytes.byteLength;
+        for (var i = 0; i < len; i++) {
+          binary += String.fromCharCode(bytes[i]);
+        }
+        return btoa(binary);
+      }
+      return _arrayBufferToBase64(arru8);
+    };
+
     class CreateDong extends HTMLElement {
       connectedCallback() {
         const shadow = this.attachShadow({ mode: "open" });
···
           if (image.type === "" || audio.type === "")
             return console.warn("Mime types invalid");
 
-          console.log(
-            image.size,
-            audio.size,
-            await image.bytes(),
-            await audio.bytes()
-          );
-
           const dongFile = new File(
             [
               // version
···
               (() => {
                 const value = new Uint32Array(1);
                 value[0] = image.size;
-                console.log("image size: ", image.size, value);
                 return value;
               })(),
               // audio type
···
               (() => {
                 const value = new Uint32Array(1);
                 value[0] = audio.size;
-                console.log("audio size: ", audio.size, value);
                 return value;
               })(),
               // image data
-              await image.bytes(),
+              await blobBytes(image),
               // audio data
-              await audio.bytes(),
+              await blobBytes(audio),
             ],
             `${prompt("Filename:") ?? "file"}.dong`,
             {
               type: "application/prs.vielle.dong",
             }
-          );
-
-          console.log(
-            dongFile,
-            dongFile.size,
-            await dongFile.text(),
-            await dongFile.bytes()
           );
 
           // download the dong file
···
         // image
         const image = document.createElement("img");
 
+        // do not append as this is only for playing audio
+        // loaded here to prevent overlaying the sound
+        const audio = document.createElement("audio");
+
+
         dongSelect.type = "file";
         dongSelect.accept = ".dong";
         loadButton.type = "submit";
···
           // get files
           const dongFile = dongSelect.files[0];
 
-          console.log(dongFile, dongFile.size); //, await dongFile.bytes());
-
           // get first 2 bytes and verify
-          const version = new Uint8Array(await dongFile.slice(0, 2).bytes());
+          const version = new Uint8Array(await blobBytes(dongFile.slice(0, 2)));
           if (version[0] !== 0xd0 || version[1] !== 2)
             return console.warn("Invalid file");
 
···
 
           // get next 4 bytes and get image size
           const imgSize = new Uint32Array(
-            (await dongFile.slice(258, 262).bytes()).buffer
+            (await blobBytes(dongFile.slice(258, 262))).buffer
           )[0];
 
           // get next 256 bytes and get mime type
···
 
           // get next 4 bytes and get image size
           const audSize = new Uint32Array(
-            (await dongFile.slice(518, 522).bytes()).buffer
+            (await blobBytes(dongFile.slice(518, 522))).buffer
           )[0];
 
-          const imageBytes = await dongFile.slice(522, 522 + imgSize).bytes();
-          const audioBytes = await dongFile
-            .slice(522 + imgSize, 522 + imgSize + audSize)
-            .bytes();
+          const imageBytes = await blobBytes(
+            dongFile.slice(522, 522 + imgSize)
+          );
+          const audioBytes = await blobBytes(
+            dongFile.slice(522 + imgSize, 522 + imgSize + audSize)
+          );
 
-          image.src = `data:${imgMimeType};base64,${imageBytes.toBase64()}`;
+          image.src = `data:${imgMimeType};base64,${uint8array64(imageBytes)}`;
 
           // audio play
-          const audio = document.createElement("audio");
-          audio.src = `data:${audMimeType};base64,${audioBytes.toBase64()}`;
+          audio.src = `data:${audMimeType};base64,${uint8array64(audioBytes)}`;
           audio.play();
-
-          console.log(
-            imgMimeType,
-            audMimeType,
-            imgSize,
-            audSize,
-            imageBytes,
-            audioBytes,
-            btoa(String.fromCharCode(...imageBytes)),
-            image,
-            shadow
-          );
         });
       }
     }
···
       href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array/toBase6400"
       >here</a
     >.) Please use firefox, a gecko based browser, safari, or a webkit based
-    browser. (iOs has no issues with this site regardless of browser)<br>
-    Contact me if chrome starts working or you encounter any issues (up to u to figure out how)
+    browser. (iOs has no issues with this site regardless of browser)<br />
+    Contact me if chrome starts working or you encounter any issues (up to u to figure
+    out how)
   </h1>
 
   <create-dong></create-dong>