From 8ae7a366276d38d313a3d96873fa0e5c484711ef Mon Sep 17 00:00:00 2001
From: Bnyro <yannick.fehler@web.de>
Date: Sat, 10 Sep 2022 19:08:50 +0200
Subject: [PATCH 1/2] hide watched videos in the feed

---
 src/components/FeedPage.vue        |  2 +-
 src/components/PreferencesPage.vue |  7 +++++++
 src/components/VideoItem.vue       | 25 ++++++++++++++++++++++++-
 src/locales/en.json                |  3 ++-
 4 files changed, 34 insertions(+), 3 deletions(-)

diff --git a/src/components/FeedPage.vue b/src/components/FeedPage.vue
index fea59f56..882196a6 100644
--- a/src/components/FeedPage.vue
+++ b/src/components/FeedPage.vue
@@ -18,7 +18,7 @@
     <hr />
 
     <div class="video-grid">
-        <VideoItem v-for="video in videos" :key="video.url" :video="video" />
+        <VideoItem :is-feed="true" v-for="video in videos" :key="video.url" :video="video" />
     </div>
 </template>
 
diff --git a/src/components/PreferencesPage.vue b/src/components/PreferencesPage.vue
index 1ff5bc7e..3a857369 100644
--- a/src/components/PreferencesPage.vue
+++ b/src/components/PreferencesPage.vue
@@ -116,6 +116,10 @@
             @change="onChange($event)"
         />
     </label>
+    <label v-if="watchHistory" class="pref" for="chkHideWatched">
+        <strong v-t="'actions.hide_watched'" />
+        <input id="chkHideWatched" v-model="hideWatched" class="checkbox" type="checkbox" @change="onChange($event)" />
+    </label>
     <label class="pref" for="ddlEnabledCodecs">
         <strong v-t="'actions.enabled_codecs'" />
         <select
@@ -366,6 +370,7 @@ export default {
             minimizeRecommendations: false,
             watchHistory: false,
             searchHistory: false,
+            hideWatched: false,
             selectedLanguage: "en",
             languages: [
                 { code: "ar", name: "Arabic" },
@@ -505,6 +510,7 @@ export default {
             this.enabledCodecs = this.getPreferenceString("enabledCodecs", "vp9,avc").split(",");
             this.disableLBRY = this.getPreferenceBoolean("disableLBRY", false);
             this.proxyLBRY = this.getPreferenceBoolean("proxyLBRY", false);
+            this.hideWatched = this.getPreferenceBoolean("hideWatched", false);
             if (this.selectedLanguage != "en") {
                 try {
                     this.CountryMap = await import(`../utils/CountryMaps/${this.selectedLanguage}.json`).then(
@@ -564,6 +570,7 @@ export default {
                 localStorage.setItem("enabledCodecs", this.enabledCodecs.join(","));
                 localStorage.setItem("disableLBRY", this.disableLBRY);
                 localStorage.setItem("proxyLBRY", this.proxyLBRY);
+                localStorage.setItem("hideWatched", this.hideWatched);
 
                 if (shouldReload) window.location.reload();
             }
diff --git a/src/components/VideoItem.vue b/src/components/VideoItem.vue
index 013d16cc..ae243da9 100644
--- a/src/components/VideoItem.vue
+++ b/src/components/VideoItem.vue
@@ -1,5 +1,5 @@
 <template>
-    <div>
+    <div v-if="showVideo">
         <router-link
             :to="{
                 path: '/watch',
@@ -141,6 +141,10 @@ export default {
                 return {};
             },
         },
+        isFeed: {
+            type: Boolean,
+            default: false,
+        },
         height: { type: String, default: "118" },
         width: { type: String, default: "210" },
         hideChannel: { type: Boolean, default: false },
@@ -151,8 +155,12 @@ export default {
     data() {
         return {
             showModal: false,
+            showVideo: true,
         };
     },
+    mounted() {
+        this.shouldShowVideo();
+    },
     methods: {
         removeVideo() {
             if (confirm(this.$t("actions.delete_playlist_video_confirm"))) {
@@ -173,6 +181,21 @@ export default {
                 });
             }
         },
+        shouldShowVideo() {
+            if (!this.isFeed || !this.getPreferenceBoolean("hideWatched", false)) return;
+
+            const objectStore = window.db.transaction("watch_history", "readonly").objectStore("watch_history");
+            objectStore.openCursor().onsuccess = event => {
+                const cursor = event.target.result;
+                if (cursor) {
+                    if (cursor.value.videoId === this.video.url.replace("/watch?v=", "")) {
+                        this.showVideo = false;
+                        return;
+                    }
+                    cursor.continue();
+                }
+            };
+        },
     },
     computed: {
         short() {
diff --git a/src/locales/en.json b/src/locales/en.json
index d97260ef..2bae4579 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -107,7 +107,8 @@
         "copy_link": "Copy link",
         "time_code": "Time code (in seconds)",
         "show_chapters": "Chapters",
-        "store_search_history": "Store Search history"
+        "store_search_history": "Store Search history",
+        "hide_watched": "Hide watched videos in the feed"
     },
     "comment": {
         "pinned_by": "Pinned by",

From 6d14103e61e08e5da64b84be8fd690dbdbfafd00 Mon Sep 17 00:00:00 2001
From: Kavin <20838718+FireMasterK@users.noreply.github.com>
Date: Sun, 2 Oct 2022 14:42:49 +0100
Subject: [PATCH 2/2] Improve querying and check if 90% of video is watched.

---
 src/components/VideoItem.vue | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)

diff --git a/src/components/VideoItem.vue b/src/components/VideoItem.vue
index ae243da9..1c71b1e4 100644
--- a/src/components/VideoItem.vue
+++ b/src/components/VideoItem.vue
@@ -185,14 +185,12 @@ export default {
             if (!this.isFeed || !this.getPreferenceBoolean("hideWatched", false)) return;
 
             const objectStore = window.db.transaction("watch_history", "readonly").objectStore("watch_history");
-            objectStore.openCursor().onsuccess = event => {
-                const cursor = event.target.result;
-                if (cursor) {
-                    if (cursor.value.videoId === this.video.url.replace("/watch?v=", "")) {
-                        this.showVideo = false;
-                        return;
-                    }
-                    cursor.continue();
+            const request = objectStore.get(this.video.url.substr(-11));
+            request.onsuccess = event => {
+                const video = event.target.result;
+                if (video && (video.currentTime ?? 0) > video.duration * 0.9) {
+                    this.showVideo = false;
+                    return;
                 }
             };
         },