From 6b0cb2352b145e803538f771d4b1ba837b88d690 Mon Sep 17 00:00:00 2001
From: FireMasterK <20838718+FireMasterK@users.noreply.github.com>
Date: Mon, 5 Jul 2021 00:12:10 +0530
Subject: [PATCH] Add option to loop current video.

---
 src/components/Player.vue     | 11 +++++++++--
 src/components/WatchVideo.vue | 12 +++++++++++-
 2 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/src/components/Player.vue b/src/components/Player.vue
index 7021adbe..3d9b2323 100644
--- a/src/components/Player.vue
+++ b/src/components/Player.vue
@@ -5,7 +5,13 @@
             style="width: 100%; height: 100%; max-height: 75vh; min-height: 250px; background: #000"
             ref="container"
         >
-            <video data-shaka-player class="uk-width-expand" :autoplay="shouldAutoPlay" ref="videoEl"></video>
+            <video
+                data-shaka-player
+                class="uk-width-expand"
+                :autoplay="shouldAutoPlay"
+                :loop="selectedAutoLoop"
+                ref="videoEl"
+            ></video>
         </div>
     </div>
 </template>
@@ -21,6 +27,7 @@ export default {
         video: Object,
         sponsors: Object,
         selectedAutoPlay: Boolean,
+        selectedAutoLoop: Boolean,
     },
     computed: {
         shouldAutoPlay: _this => {
@@ -109,7 +116,7 @@ export default {
                 });
 
                 videoEl.addEventListener("ended", () => {
-                    if (this.selectedAutoPlay && this.video.relatedStreams.length > 0) {
+                    if (!this.selectedAutoLoop && this.selectedAutoPlay && this.video.relatedStreams.length > 0) {
                         const params = this.$route.query;
                         let url = this.video.relatedStreams[0].url;
                         const searchParams = new URLSearchParams();
diff --git a/src/components/WatchVideo.vue b/src/components/WatchVideo.vue
index 112836a2..536a353e 100644
--- a/src/components/WatchVideo.vue
+++ b/src/components/WatchVideo.vue
@@ -3,7 +3,13 @@
         <ErrorHandler v-if="video && video.error" :message="video.message" :error="video.error" />
 
         <div v-show="!video.error">
-            <Player ref="videoPlayer" :video="video" :sponsors="sponsors" :selectedAutoPlay="selectedAutoPlay" />
+            <Player
+                ref="videoPlayer"
+                :video="video"
+                :sponsors="sponsors"
+                :selectedAutoPlay="selectedAutoPlay"
+                :selectedAutoLoop="selectedAutoLoop"
+            />
             <h1 class="uk-text-bold">{{ video.title }}</h1>
 
             <div uk-grid>
@@ -48,6 +54,9 @@
 
         <hr />
 
+        <b>Loop this Video:</b>&nbsp;
+        <input class="uk-checkbox" v-model="selectedAutoLoop" @change="onChange($event)" type="checkbox" />
+        <br />
         <b>Auto Play next Video:</b>&nbsp;
         <input class="uk-checkbox" v-model="selectedAutoPlay" @change="onChange($event)" type="checkbox" />
 
@@ -118,6 +127,7 @@ export default {
                 title: "Loading...",
             },
             sponsors: null,
+            selectedAutoLoop: false,
             selectedAutoPlay: null,
             showDesc: true,
             comments: null,