[Feature] Disable history and Watched indicator

src/js/layout.js

@@ -42,6 +42,7 @@ const tor = require('tor-request');
 
 let currentTheme = '';
 let useTor = false;
+let rememberHistory = true;
 let dialog = electron.remote.dialog; // Used for opening file browser to export / import subscriptions.
 let toastTimeout; // Timeout for toast notifications.
 let mouseTimeout; // Timeout for hiding the mouse cursor on video playback
@@ -199,4 +200,4 @@ function showVideoOptions(element) {
     } else {
         element.nextElementSibling.style.display = 'none'
     }
-}
+}

src/js/player.js

@@ -188,7 +188,9 @@ function playVideo(videoId) {
             return;
         }
 
-        addToHistory(videoId);
+        if (rememberHistory === true){
+          addToHistory(videoId);
+        }
 
         // Hide subtitles by default
         /*if (typeof (info['subtitles']) !== 'undefined' && Object.keys(info['subtitles']).length > 0) {

src/js/settings.js

@@ -58,6 +58,12 @@ function updateSettingsView() {
     } else {
       settingsView.useTor = false;
     }
+
+    if (rememberHistory) {
+      settingsView.history = true;
+    } else {
+      settingsView.history = false;
+    }
   });
 }
 
@@ -75,7 +81,9 @@ function checkDefaultSettings() {
   let settingDefaults = {
     'theme': 'light',
     'apiKey': settingsView.apiKey,
-    'useTor': false
+    'useTor': false,
+    'history': true,
+    'quality': '720'
   };
 
   console.log(settingDefaults);
@@ -110,6 +118,9 @@ function checkDefaultSettings() {
           case 'useTor':
             useTor = docs[0]['value'];
             break;
+          case 'history':
+            rememberHistory = docs[0]['value'];
+            break;
           default:
             break;
         }
@@ -126,9 +137,16 @@ function checkDefaultSettings() {
 function updateSettings() {
   let themeSwitch = document.getElementById('themeSwitch').checked;
   let torSwitch = document.getElementById('torSwitch').checked;
+  let historySwitch = document.getElementById('historySwitch').checked;
   let key = document.getElementById('api-key').value;
   let theme = 'light';
 
+  settingsView.useTor = torSwitch;
+  settingsView.history = historySwitch;
+  rememberHistory = historySwitch;
+
+  console.log(historySwitch);
+
   if (apiKeyBank.indexOf(key) == -1 && key !== '') {
     settingsView.apiKey = key;
   }
@@ -165,6 +183,17 @@ function updateSettings() {
     useTor = torSwitch;
   });
 
+  // Update tor usage.
+  settingsDb.update({
+    _id: 'history'
+  }, {
+    value: torSwitch
+  }, {}, function(err, numReplaced) {
+    console.log(err);
+    console.log(numReplaced);
+    useTor = torSwitch;
+  });
+
   // To any third party devs that fork the project, please be ethical and change the API key.
   settingsDb.update({
     _id: 'apiKey'

src/js/templates.js

@@ -258,7 +258,8 @@ let settingsView = new Vue({
     seen: false,
     useTheme: false,
     useTor: false,
-    apiKey: ''
+    apiKey: '',
+    history: true,
   },
   template: settingsTemplate
 });

src/js/videos.js

@@ -108,6 +108,16 @@ function displayVideo(videoData, listType = '') {
     let video = {};
     video.id = videoData.videoId;
 
+    historyDb.find({
+        videoId: video.id
+    }, (err, docs) => {
+        if (jQuery.isEmptyObject(docs)) {
+            // Do nothing
+        } else {
+            video.watched = true;
+        }
+    });
+
     let time = videoData.lengthSeconds;
     let hours = 0;
 

src/style/player.css

@@ -154,6 +154,16 @@ iframe {
     text-align: right;
 }
 
+.videoWatched {
+  width: 100%;
+  height: 155px;
+  background-color: black;
+  position: relative;
+  bottom: 187px;
+  opacity: 0.4;
+  pointer-events: none;
+}
+
 .videoPlayer {
     width: 100%;
     max-height: 1100px;

src/templates/settings.html

@@ -9,6 +9,8 @@
     <label for="themeSwitch" class="switch-label">Use Dark Theme</label>
     <input type="checkbox" id="torSwitch" name="set-name" class="switch-input" :checked='useTor'>
     <label for="torSwitch" class="switch-label">Use Tor for API calls</label>
+    <input type="checkbox" id="historySwitch" name="set-name" class="switch-input" :checked='history'>
+    <label for="historySwitch" class="switch-label">Remember History</label>
   </div>
   <div class='center'>
     <div onclick='importSubscriptions()' class='settingsButton'>

src/templates/videoTemplate.html

@@ -20,6 +20,9 @@
             <img v-on:click='play(video.id)' :src='video.thumbnail' />
             <p v-on:click='play(video.id)' class='videoDuration'>{{video.duration}}</p>
             <i class="fas fa-history" v-on:click='toggleSave(video.id)'></i>
+            <div v-if='video.watched' class='videoWatched'>
+              WATCHED
+            </div>
           </div>
           <p v-on:click='play(video.id)' class='videoTitle'>{{video.title}}</p>
           <p v-on:click='channel(video.channelId)' class='channelName'>{{video.channelName}}</p>