Feature/new window right click (#2027)

* right click menu for open in a new window

* open video in new window when right click

* router link added to channel images for easier selection in the context of a context menu

* fix security bug user can visit other website via freetube

* simplify context menu entry condition

* createWindow in open new window adapted with the merged function

* Change the open new window selector for the origin of the page no matter the name of the website

* Keypress reintegrate into the code for accesibility

* Keypress reintegrate into the code for accesibility

* Fix style for sidenav subscription links

Co-authored-by: PikachuEXE <pikachuexe@gmail.com>

src/main/index.js

@@ -27,6 +27,13 @@ function runApp() {
         click: () => {
           browserWindow.webContents.send('showVideoStatistics')
         }
+      },
+      {
+        label: 'Open in a New Window',
+        visible: parameters.linkURL.includes((new URL(browserWindow.webContents.getURL())).origin),
+        click: () => {
+          createWindow({ replaceMainWindow: false, windowStartupUrl: parameters.linkURL, showWindowNow: true })
+        }
       }
     ]
   })

src/renderer/components/side-nav/side-nav.css

@@ -89,6 +89,11 @@
   transform: translateY(-50%);
 }
 
+.channelLink {
+  color: inherit;
+  text-decoration: inherit;
+}
+
 .channelThumbnail {
   border-radius: 50%;
   width: 35px;

src/renderer/components/side-nav/side-nav.js

@@ -77,7 +77,6 @@ export default Vue.extend({
     navigate: function (route) {
       this.$router.push('/' + route)
     },
-
     goToChannel: function (id) {
       this.$router.push({ path: `/channel/${id}` })
     }

src/renderer/components/side-nav/side-nav.vue

@@ -224,8 +224,12 @@
           :title="channel.name"
           role="button"
           tabindex="0"
-          @click="goToChannel(channel.id)"
           @keypress="goToChannel(channel.id)"
+          @click="goToChannel(channel.id)"
+        >
+          <router-link
+            :to="`/channel/${channel.id}`"
+            class="channelLink"
           >
             <div
               class="thumbnailContainer"
@@ -241,6 +245,7 @@
             >
               {{ channel.name }}
             </p>
+          </router-link>
         </div>
       </div>
     </div>

src/renderer/components/watch-video-info/watch-video-info.sass

@@ -86,3 +86,7 @@
     :deep(.iconDropdown)
       left: calc(50% - 20px)
       right: auto
+
+.channelLink
+  color: inherit
+  text-decoration: inherit

src/renderer/components/watch-video-info/watch-video-info.vue

@@ -13,19 +13,28 @@
           class="profileRow"
         >
           <div>
+            <router-link
+              :to="`/channel/${channelId}`"
+            >
               <img
                 :src="channelThumbnail"
                 class="channelThumbnail"
                 @click="goToChannel"
               >
+            </router-link>
           </div>
           <div>
+            <router-link
+              :to="`/channel/${channelId}`"
+              class="channelLink"
+            >
               <div
                 class="channelName"
                 @click="goToChannel"
               >
                 {{ channelName }}
               </div>
+            </router-link>
             <ft-button
               v-if="!hideUnsubscribeButton"
               :label="subscribedText"