Fix mini player, make consistent wording and visual fixes

src/index.html

@@ -45,7 +45,7 @@
       <ul>
         <li v-on:click='subscriptions'><i class="fas fa-rss"></i>&nbsp;&nbsp;Subscriptions</li>
         <li v-on:click='popular'><i class="fas fa-users"></i>&nbsp;&nbsp;Most Popular</li>
-        <li v-on:click='saved'><i class="fas fa-star"></i>&nbsp;&nbsp;Saved</li>
+        <li v-on:click='saved'><i class="fas fa-star"></i>&nbsp;&nbsp;Favorites</li>
         <li v-on:click='history'><i class="fas fa-history"></i>&nbsp;&nbsp;History</li>
       </ul>
       <hr />

src/js/init.js

@@ -75,10 +75,15 @@ let init = function () {
         win = null;
     });
 
-  const template = [
-    {
-      label: 'File',
-      submenu: [
+    const template = [{
+            label: 'File',
+            submenu: [{
+                    label: 'Open New Window',
+                    click () { init() }
+            },
+              {role: 'quit'}
+            ]
+          },
         {
           label: 'Open New Window',
           click () { init() }
@@ -150,4 +155,4 @@ let active = function () {
  */
 app.on('ready', init);
 app.on('window-all-closed', allWindowsClosed);
-app.on('activate', active);
+app.on('activate', active);

src/js/player.js

@@ -41,10 +41,10 @@ function playVideo(videoId) {
   // Change the save button icon and text depending on if the user has saved the video or not.
   checkSavedVideo.then((results) => {
     if (results === false) {
-      playerView.savedText = 'SAVE';
+      playerView.savedText = 'FAVORITE';
       playerView.savedIconType = 'far unsaved';
     } else {
-      playerView.savedText = 'SAVED';
+      playerView.savedText = 'FAVORITED';
       playerView.savedIconType = 'fas saved';
     }
   });
@@ -190,38 +190,40 @@ function playVideo(videoId) {
  *
  * @return {Void}
  */
-function openMiniPlayer() {
-  let lastTime;
-  let videoHtml;
+ function openMiniPlayer() {
+   let lastTime;
+   let videoHtml;
 
-    // Grabs whatever the HTML is for the current video player.  Done this way to grab
-    // the HTML5 player (with varying qualities) as well as the YouTube embeded player.
-    if ($('.videoPlayer').length > 0) {
-        $('.videoPlayer').get(0).pause();
-        lastTime = $('.videoPlayer').get(0).currentTime;
-        videoHtml = $('.videoPlayer').get(0).outerHTML;
-    } else {
-        videoHtml = $('iframe').get(0).outerHTML;
-    }
+   // Grabs whatever the HTML is for the current video player.  Done this way to grab
+   // the HTML5 player (with varying qualities) as well as the YouTube embeded player.
+   if ($('.videoPlayer').length > 0) {
+     $('.videoPlayer').get(0).pause();
+     lastTime = $('.videoPlayer').get(0).currentTime;
+     videoHtml = $('.videoPlayer').get(0).outerHTML;
+   } else {
+     videoHtml = $('iframe').get(0).outerHTML;
+   }
 
-    // Create a new browser window.
-    const BrowserWindow = electron.remote.BrowserWindow;
+   // Create a new browser window.
+   const BrowserWindow = electron.remote.BrowserWindow;
 
-    let miniPlayer = new BrowserWindow({
-        width: 1200,
-        height: 710
-    });
+   let miniPlayer = new BrowserWindow({
+     width: 1200,
+     height: 710
+   });
 
-  // Use the miniPlayer.html template.
-  $.get('templates/miniPlayer.html', (template) => {
-    mustache.parse(template);
-    const rendered = mustache.render(template, {
-      videoHtml: videoHtml,
-      videoThumbnail: playerView.thumbnail,
-      startTime: lastTime,
-    });
-  });
-}
+   // Use the miniPlayer.html template.
+   $.get('templates/miniPlayer.html', (template) => {
+     mustache.parse(template);
+     const rendered = mustache.render(template, {
+       videoHtml: videoHtml,
+       videoThumbnail: playerView.thumbnail,
+       startTime: lastTime,
+     });
+     // Render the template to the new browser window.
+     miniPlayer.loadURL("data:text/html;charset=utf-8," + encodeURI(rendered));
+   });
+ }
 
 /**
  * Change the quality of the current video.

src/js/savedVideos.js

@@ -76,11 +76,11 @@ function toggleSavedVideo(videoId) {
 
   checkIfSaved.then((results) => {
     if (results === false) {
-      playerView.savedText = 'SAVED';
+      playerView.savedText = 'FAVORITED';
       playerView.savedIconType = 'fas saved';
       addSavedVideo(videoId);
     } else {
-      playerView.savedText = 'SAVE';
+      playerView.savedText = 'FAVORITE';
       playerView.savedIconType = 'far unsaved';
       removeSavedVideo(videoId);
     }

src/js/templates.js

@@ -73,7 +73,7 @@ let sideNavBar = new Vue({
     popular: (event) => {
       hideViews();
       if (loadingView.seen !== false){
-        loadingView.seen === false;
+        loadingView.seen = false;
       }
       if(popularView.videoList.length === 0){
         loadingView.seen = true;
@@ -86,20 +86,20 @@ let sideNavBar = new Vue({
     saved: (event) => {
       hideViews();
       if (loadingView.seen !== false){
-        loadingView.seen === false;
+        loadingView.seen = false;
       }
       if(savedView.videoList.length === 0){
         loadingView.seen = true;
       }
       headerView.seen = true;
-      headerView.title = 'Saved Videos';
+      headerView.title = 'Favorited Videos';
       savedView.seen = true;
       showSavedVideos();
     },
     history: (event) => {
       hideViews();
       if (loadingView.seen !== false){
-        loadingView.seen === false;
+        loadingView.seen = false;
       }
       if(historyView.videoList.length === 0){
         loadingView.seen = true;
@@ -112,7 +112,7 @@ let sideNavBar = new Vue({
     settings: (event) => {
       hideViews();
       if (loadingView.seen !== false){
-        loadingView.seen === false;
+        loadingView.seen = false;
       }
       settingsView.seen = true;
       updateSettingsView();
@@ -120,7 +120,7 @@ let sideNavBar = new Vue({
     about: (event) => {
       hideViews();
       if (loadingView.seen !== false){
-        loadingView.seen === false;
+        loadingView.seen = false;
       }
       aboutView.seen = true;
     }
@@ -152,7 +152,7 @@ let subscriptionView = new Vue({
       goToChannel(channelId);
     },
     toggleSave: (videoId) => {
-      addSavedVideo(videoId);
+      toggleSavedVideo(videoId);
     },
     copy: (site, videoId) => {
       const url = 'https://' + site + '/watch?v=' + videoId;

src/js/videos.js

@@ -90,6 +90,7 @@ function search(nextPageToken = '') {
     });
 
     searchView.nextPageToken = data.nextPageToken;
+    loadingView.seen = false;
   })
 }
 
@@ -374,9 +375,11 @@ function parseSearchText(url = '') {
     let urlSplit = input.split('/');
     if (match) {
         ft.log('Video found');
+        loadingView.seen = true;
         playVideo(match[2]);
     } else if (urlSplit[3] == 'channel') {
         ft.log('channel found');
+        loadingView.seen = true;
         goToChannel(urlSplit[4]);
     } else if (urlSplit[3] == 'user') {
         ft.log('user found');
@@ -387,10 +390,12 @@ function parseSearchText(url = '') {
         }, (data) => {
             ft.log('Channel Data: ', data.items[0].id);
             let channelID = data.items[0].id;
+            loadingView.seen = true;
             goToChannel(channelID);
         });
     } else {
         ft.log('Video not found');
+        loadingView.seen = true;
         search();
     }