change preferences

src/components/PreferencesPage.vue

@@ -45,20 +45,21 @@
             @change="onChange($event)"
         />
     </label>
-    <label v-if="autoPlayVideo" class="pref" for="chkPriorityAutoPlay">
+    <label v-if="autoPlayVideo" class="pref" for="chkAutoPlayPreferUnwatched">
-        <div class="flex items-center">
+        <strong v-t="'actions.autoplay_prefer_unwatched'" />
-            <strong v-t="'actions.priority_autoplay'" />
-            <font-awesome-icon icon="circle-question" class="ml-2 peer" />
-            <div class="peer hidden peer-hover:block relative w-0 h-0">
-                <div
-                    class="absolute sm:min-w-xs min-w-[12rem] bottom-5 bg-black/80 rounded p-2"
-                    v-t="'actions.priority_autoplay_tooltip'"
-                />
-            </div>
-        </div>
         <input
-            id="chkPriorityAutoPlay"
+            id="chkAutoPlayPreferUnwatched"
-            v-model="priorityAutoPlay"
+            v-model="autoPlayPreferUnwatched"
+            class="checkbox"
+            type="checkbox"
+            @change="onChange($event)"
+        />
+    </label>
+    <label v-if="autoPlayVideo" class="pref" for="chkAutoPlayPreferSameAuthor">
+        <strong v-t="'actions.autoplay_prefer_same_author'" />
+        <input
+            id="chkAutoPlayPreferSameAuthor"
+            v-model="autoPlayPreferSameAuthor"
             class="checkbox"
             type="checkbox"
             @change="onChange($event)"
@@ -365,7 +366,8 @@ export default {
             minSegmentLength: 0,
             selectedTheme: "dark",
             autoPlayVideo: true,
-            priorityAutoPlay: false,
+            autoPlayPreferUnwatched: true,
+            autoPlayPreferSameAuthor: false,
             listen: false,
             resolutions: [144, 240, 360, 480, 720, 1080, 1440, 2160, 4320],
             defaultQuality: 0,
@@ -481,7 +483,8 @@ export default {
             this.minSegmentLength = Math.max(this.getPreferenceNumber("minSegmentLength", 0), 0);
             this.selectedTheme = this.getPreferenceString("theme", "dark");
             this.autoPlayVideo = this.getPreferenceBoolean("playerAutoPlay", true);
-            this.priorityAutoPlay = this.getPreferenceBoolean("priorityAutoPlay", false);
+            this.autoPlayPreferUnwatched = this.getPreferenceBoolean("playerAutoPlayUnwatched", true);
+            this.autoPlayPreferSameAuthor = this.getPreferenceBoolean("playerAutoPlaySameAuthor", false);
             this.listen = this.getPreferenceBoolean("listen", false);
             this.defaultQuality = Number(localStorage.getItem("quality"));
             this.bufferingGoal = Math.max(Number(localStorage.getItem("bufferGoal")), 10);
@@ -536,7 +539,8 @@ export default {
                 localStorage.setItem("minSegmentLength", this.minSegmentLength);
                 localStorage.setItem("theme", this.selectedTheme);
                 localStorage.setItem("playerAutoPlay", this.autoPlayVideo);
-                localStorage.setItem("priorityAutoPlay", this.priorityAutoPlay);
+                localStorage.setItem("playerAutoPlayUnwatched", this.autoPlayPreferUnwatched);
+                localStorage.setItem("playerAutoPlaySameAuthor", this.autoPlayPreferSameAuthor);
                 localStorage.setItem("listen", this.listen);
                 localStorage.setItem("quality", this.defaultQuality);
                 localStorage.setItem("bufferGoal", this.bufferingGoal);

src/components/WatchVideo.vue

@@ -302,8 +302,11 @@ export default {
         filteredRelatedStreams: _this => {
             return _this.video.relatedStreams?.filter(video => video.url !== _this.nextVideo?.url);
         },
-        priorityAutoPlay: _this => {
+        preferUnwatched: _this => {
-            return _this.getPreferenceBoolean("priorityAutoPlay", true) && !_this.isEmbed;
+            return _this.getPreferenceBoolean("playerAutoPlayUnwatched", true) && !_this.isEmbed;
+        },
+        preferAuthor: _this => {
+            return _this.getPreferenceBoolean("playerAutoPlaySameAuthor", false) && !_this.isEmbed;
         },
     },
     mounted() {
@@ -439,13 +442,13 @@ export default {
                         });
                         xmlDoc.querySelectorAll("br").forEach(elem => (elem.outerHTML = "\n"));
                         this.video.description = this.rewriteDescription(xmlDoc.querySelector("body").innerHTML);
-<<<<<<< HEAD
+                        this.updateWatched(this.video.relatedStreams).then(() => {
-                        if (this.priorityAutoPlay) {
+                            if (!this.isEmbed) {
-                            this.setNextVideo();
+                                if (!this.playlistId) {
-                        }
+                                    this.setNextVideo();
-=======
+                                }
-                        this.updateWatched(this.video.relatedStreams);
+                            }
->>>>>>> fb8482b007828a48d847b7175f0ac15938adbaab
+                        });
                     }
                 });
         },
@@ -580,37 +583,24 @@ export default {
         onTimeUpdate(time) {
             this.currentTime = time;
         },
-        async getWatchedRelatedVideos() {
+        setNextVideo() {
-            var tx = window.db.transaction("watch_history", "readwrite");
+            if (!this.preferUnwatched && !this.preferAuthor) {
-            var store = tx.objectStore("watch_history");
+                this.nextVideo = this.video.relatedStreams[0];
-            const results = [];
+                return;
-            for (let i = 0; i < this.video.relatedStreams.length; i++) {
+            }
-                const video = this.video.relatedStreams[i];
+            if (!this.preferUnwatched) {
-                const id = video.url.replace("/watch?v=", "");
+                this.nextVideo = this.video.relatedStreams.find(video => video.uploaderUrl === this.video.uploaderUrl);
-                const request = store.get(id);
+                if (!this.nextVideo) this.nextVideo = this.video.relatedStreams[0];
-                results.push(request);
+                return;
             }
-            const data = results.map(result => {
-                return new Promise(resolve => {
-                    result.onsuccess = function (event) {
-                        const video = event.target.result;
-                        resolve(video);
-                    };
-                    result.onerror = function () {
-                        resolve(null);
-                    };
-                });
-            });
-            return Promise.all(data);
-        },
-        async setNextVideo() {
-            const data = (await this.getWatchedRelatedVideos()).filter(video => video);
             for (let i = 0; i < this.video.relatedStreams.length; i++) {
                 let foundAuthorMatch = false;
                 const video = this.video.relatedStreams[i];
-                const id = video.url.replace("/watch?v=", "");
+                if (!video.watched) {
-                const watched = data.find(video => video.videoId === id);
+                    if (!this.preferAuthor) {
-                if (!watched) {
+                        this.nextVideo = video;
+                        break;
+                    }
                     if (video.uploaderUrl === this.video.uploaderUrl) {
                         this.nextVideo = video;
                         foundAuthorMatch = true;

src/locales/en.json

@@ -49,8 +49,8 @@
         "dark": "Dark",
         "light": "Light",
         "autoplay_video": "Autoplay Video",
-        "priority_autoplay": "Priority Autoplay",
+        "autoplay_prefer_unwatched": "Prefer unwatched videos",
-        "priority_autoplay_tooltip": "Prioritize unwatched videos from the same channel when selecting next video from related streams.",
+        "autoplay_prefer_same_author": "Prefer videos from the same author",
         "audio_only": "Audio Only",
         "default_quality": "Default Quality",
         "buffering_goal": "Buffering Goal (in seconds)",

src/main.js

@@ -21,7 +21,6 @@ import {
     faServer,
     faDonate,
     faBookmark,
-    faCircleQuestion,
 } from "@fortawesome/free-solid-svg-icons";
 import { faGithub, faBitcoin, faYoutube } from "@fortawesome/free-brands-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
@@ -49,7 +48,6 @@ library.add(
     faServer,
     faDonate,
     faBookmark,
-    faCircleQuestion,
 );
 
 import router from "@/router/router.js";
@@ -210,15 +208,24 @@ const mixin = {
             if (window.db && this.getPreferenceBoolean("watchHistory", false)) {
                 var tx = window.db.transaction("watch_history", "readonly");
                 var store = tx.objectStore("watch_history");
-                videos.map(async video => {
+                return Promise.all(
-                    var request = store.get(video.url.substr(-11));
+                    videos.map(
-                    request.onsuccess = function (event) {
+                        video =>
-                        if (event.target.result) {
+                            new Promise(resolve => {
-                            video.watched = true;
+                                var request = store.get(video.url.substr(-11));
-                            video.currentTime = event.target.result.currentTime;
+                                request.onsuccess = function (event) {
-                        }
+                                    if (event.target.result) {
-                    };
+                                        video.watched = true;
-                });
+                                        video.currentTime = event.target.result.currentTime;
+                                    }
+                                    resolve();
+                                };
+                                request.onerror = function () {
+                                    resolve();
+                                };
+                            }),
+                    ),
+                );
             }
         },
         getLocalSubscriptions() {