Add mp4 support

Author: penalosa

.DS_Store

@@ -1,7 +1,7 @@
 <script>
-  import { navigate, Link } from "svelte-routing";
-  import { TextField, TextAreaField, SelectField, MediaField } from "../forms";
-  import Data from "../Data.svelte";
+  import { navigate, Link } from 'svelte-routing';
+  import { TextField, TextAreaField, SelectField, MediaField } from '../forms';
+  import Data from '../Data.svelte';
   export let episode;
   export let dirty;
   let confirmDelete = false;
@@ -27,7 +27,7 @@
                 class="inline-block h-20 w-20 object-cover rounded-lg {!$episode
                   .Show.picture && 'bg-white'}"
                 src={$episode.Show.picture ??
-                  "https://cdn.freshair.radio/logos/FreshairBlackLogo.png"}
+                  'https://cdn.freshair.radio/logos/FreshairBlackLogo.png'}
                 alt=""
               />
             </div>
@@ -36,7 +36,7 @@
                 {$episode.Show.title}
               </p>
               <p class="font-medium text-gray-200 text-md ">
-                presented by {$episode.Show.meta.byline ?? ""}
+                presented by {$episode.Show.meta.byline ?? ''}
               </p>
             </div>
           </div>
@@ -127,21 +127,21 @@
           label="Broadcast in week starting..."
           bind:value={$episode.scheduling.week}
           options={[
-            "18th January",
-            "25th January",
-            "1st February",
-            "8th February",
-            "15th February",
-            "22nd February",
-            "1st March",
-            "8th March",
-            "15th March",
-            "22nd March",
-            "29th March",
-            "5th April",
-            "12th April",
-            "19th April",
-            "26th April"
+            '18th January',
+            '25th January',
+            '1st February',
+            '8th February',
+            '15th February',
+            '22nd February',
+            '1st March',
+            '8th March',
+            '15th March',
+            '22nd March',
+            '29th March',
+            '5th April',
+            '12th April',
+            '19th April',
+            '26th April'
           ]}
         />
         <MediaField
@@ -152,7 +152,7 @@
           processedValue={$episode.meta.published !== false && $episode.meta}
           label="Episode audio"
           class="col-span-6"
-          ct="audio/mpeg,audio/mp3"
+          ct="audio/mpeg,audio/mp3,audio/m4a,audio/x-m4a"
         />
       </dl>
     </div>

src/.DS_Store

@@ -1,5 +1,5 @@
 <script>
-  import { onMount, createEventDispatcher, onDestroy } from "svelte";
+  import { onMount, createEventDispatcher, onDestroy } from 'svelte';
   const dispatch = createEventDispatcher();
 
   let ws;
@@ -21,12 +21,12 @@
   let done = false;
   const setupProgressListening = (url) => {
     processing = true;
-    ws = new WebSocket("wss://ws.freshair.radio");
+    ws = new WebSocket('wss://ws.freshair.radio');
     ws.onmessage = (m) => {
       const data = JSON.parse(m.data);
-      if (data.type == "processingUpdate" && url == data.for) {
+      if (data.type == 'processingUpdate' && url == data.for) {
         processingPercentage = Math.round(data.progress);
-      } else if (data.type == "processingDone" && url == data.for) {
+      } else if (data.type == 'processingDone' && url == data.for) {
         done = true;
       }
       console.log(data);
@@ -36,7 +36,7 @@
     const reader = new FileReader();
     const xhr = new XMLHttpRequest();
     xhr.upload.addEventListener(
-      "progress",
+      'progress',
       (e) => {
         if (e.lengthComputable) {
           percentage = Math.round((e.loaded * 100) / e.total);
@@ -47,20 +47,20 @@
     );
 
     xhr.upload.addEventListener(
-      "load",
+      'load',
       (e) => {
         percentage = 100;
-        dispatch("uploaded", signed);
+        dispatch('uploaded', signed);
         if (process) {
           setupProgressListening(signed.access);
         }
       },
       false
     );
-    xhr.open("PUT", signed.signed);
-    xhr.setRequestHeader("x-amz-acl", "public-read");
-    xhr.setRequestHeader("Content-Type", "audio/mpeg");
-    xhr.overrideMimeType("audio/mpeg");
+    xhr.open('PUT', signed.signed);
+    xhr.setRequestHeader('x-amz-acl', 'public-read');
+    xhr.setRequestHeader('Content-Type', signed.mime);
+    xhr.overrideMimeType(signed.mime);
     reader.onload = (evt) => {
       xhr.send(evt.target.result);
     };
@@ -138,7 +138,7 @@
     {#if done}
       Uploaded
     {:else if processing}
-      {processingPercentage == 0 ? "Processing..." : `${processingPercentage}%`}
+      {processingPercentage == 0 ? 'Processing...' : `${processingPercentage}%`}
     {:else}
       {percentage}%
     {/if}