Begin preparing enqueue flow for SoundCloud tracks

tnyim · Aug 6, 2022 · 20cd0ba · 20cd0ba
1 parent 4473427
commit 20cd0ba
Show file tree

Hide file tree

Showing 11 changed files with 245 additions and 132 deletions.
diff --git a/app/src/Enqueue.svelte b/app/src/Enqueue.svelte
@@ -12,6 +12,7 @@
 
     let step = 0;
     let ticket: EnqueueMediaTicket;
+    let mediaType: "video" | "track" = "video";
     function onMediaSelected(event: CustomEvent<EnqueueMediaResponse>) {
         ticket = event.detail.getTicket();
         step = 1;
@@ -32,6 +33,16 @@
 
     let ongoingRaffleInfo: OngoingRaffleInfo;
 
+    $: {
+        if (typeof ticket !== "undefined") {
+            if (ticket.hasYoutubeVideoData()) {
+                mediaType = "video";
+            } else if (ticket.hasSoundcloudTrackData()) {
+                mediaType = "track";
+            }
+        }
+    }
+
     onMount(async () => {
         let resp = await apiClient.ongoingRaffleInfo();
         if (resp.hasRaffleInfo()) {
@@ -55,6 +66,7 @@
         on:ticketExpired={onTicketExpired}
         on:connectionLost={onConnectionLost}
         bind:ticket
+        {mediaType}
     >
         <svelte:fragment slot="raffle-info">
             {#if ongoingRaffleInfo !== undefined}
@@ -63,23 +75,23 @@
         </svelte:fragment>
     </EnqueuePayment>
 {:else if step == 2}
-    <EnqueueSuccess on:enqueueAnother={onUserCanceled} bind:ticket>
+    <EnqueueSuccess on:enqueueAnother={onUserCanceled} bind:ticket {mediaType}>
         <svelte:fragment slot="raffle-info">
             {#if ongoingRaffleInfo !== undefined}
                 <EnqueueRafflePromotion {ongoingRaffleInfo} />
             {/if}
         </svelte:fragment>
     </EnqueueSuccess>
 {:else if step == 3}
-    <EnqueueFailure on:enqueueAnother={onUserCanceled} bind:ticket>
+    <EnqueueFailure on:enqueueAnother={onUserCanceled} bind:ticket {mediaType}>
         <svelte:fragment slot="raffle-info">
             {#if ongoingRaffleInfo !== undefined}
                 <EnqueueRafflePromotion {ongoingRaffleInfo} />
             {/if}
         </svelte:fragment>
     </EnqueueFailure>
 {:else if step == 4}
-    <EnqueueFailure on:enqueueAnother={onUserCanceled} bind:ticket connectionLost={true}>
+    <EnqueueFailure on:enqueueAnother={onUserCanceled} bind:ticket connectionLost={true} {mediaType}>
         <svelte:fragment slot="raffle-info">
             {#if ongoingRaffleInfo !== undefined}
                 <EnqueueRafflePromotion {ongoingRaffleInfo} />

diff --git a/app/src/EnqueueFailure.svelte b/app/src/EnqueueFailure.svelte
@@ -9,6 +9,7 @@
     const dispatch = createEventDispatcher();
 
     export let ticket: EnqueueMediaTicket;
+    export let mediaType: "video" | "track";
     export let connectionLost = false;
 
     function enqueueAnother() {
@@ -22,9 +23,9 @@
 
 <Wizard>
     <div slot="step-info">
-        <h3 class="text-lg font-semibold leading-6 text-gray-900 dark:text-gray-200">Enqueue a video</h3>
+        <h3 class="text-lg font-semibold leading-6 text-gray-900 dark:text-gray-200">Enqueue a {mediaType}</h3>
         <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
-            <strong>Beware:</strong> if you just paid before the prices expired, it is possible your video was enqueued anyway.
+            <strong>Beware:</strong> if you just paid before the prices expired, it is possible your {mediaType} was enqueued anyway.
             Double-check before trying again!
         </p>
     </div>
@@ -36,7 +37,7 @@
                     Connection to the server lost. If you already paid, <strong
                         class="cursor-pointer hover:underline"
                         on:click={closeEnqueue}>Cancel</strong
-                    > and check the queue to see if your video was enqueued.
+                    > and check the queue to see if your {mediaType} was enqueued.
                 {:else}
                     Payment not received in time. If you did not make a payment yet, please try again.<br />
                     If you made a payment but it has not been taken into account, you will receive a refund once the JungleTV