QOL: Move source code under the src directory. (#1318)

src/plugins/navigation/back.ts

@@ -0,0 +1,13 @@
+import { BrowserWindow } from 'electron';
+
+import style from './style.css';
+
+import { injectCSS } from '../utils';
+
+export function handle(win: BrowserWindow) {
+  injectCSS(win.webContents, style, () => {
+    win.webContents.send('navigation-css-ready');
+  });
+}
+
+export default handle;

src/plugins/navigation/front.ts

@@ -0,0 +1,20 @@
+import { ipcRenderer } from 'electron';
+
+import forwardHTML from './templates/forward.html';
+import backHTML from './templates/back.html';
+
+import { ElementFromHtml } from '../utils';
+
+export function run() {
+  ipcRenderer.on('navigation-css-ready', () => {
+    const forwardButton = ElementFromHtml(forwardHTML);
+    const backButton = ElementFromHtml(backHTML);
+    const menu = document.querySelector('#right-content');
+
+    if (menu) {
+      menu.prepend(backButton, forwardButton);
+    }
+  });
+}
+
+export default run;

src/plugins/navigation/style.css

@@ -0,0 +1,35 @@
+.navigation-item {
+  font-family: Roboto, Noto Naskh Arabic UI, Arial, sans-serif;
+  font-size: 20px;
+  line-height: var(--ytmusic-title-1_-_line-height);
+  font-weight: 500;
+  --yt-endpoint-color: #fff;
+  --yt-endpoint-hover-color: #fff;
+  --yt-endpoint-visited-color: #fff;
+  display: inline-flex;
+  align-items: center;
+  color: rgba(255, 255, 255, 0.5);
+  cursor: pointer;
+  margin: 0 var(--ytd-rich-grid-item-margin);
+}
+
+.navigation-item:hover {
+  color: #fff;
+}
+
+.navigation-icon {
+  display: inline-flex;
+  -ms-flex-align: center;
+  -webkit-align-items: center;
+  align-items: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  vertical-align: middle;
+  fill: var(--iron-icon-fill-color, currentcolor);
+  stroke: none;
+  width: var(--iron-icon-width, 24px);
+  height: var(--iron-icon-height, 24px);
+  animation: var(--iron-icon_-_animation);
+}

src/plugins/navigation/templates/back.html

@@ -0,0 +1,33 @@
+<div
+        class="style-scope ytmusic-pivot-bar-renderer navigation-item"
+        onclick="history.back()"
+        role="tab"
+        tab-id="FEmusic_back"
+>
+    <div
+            aria-disabled="false"
+            class="search-icon style-scope ytmusic-search-box"
+            role="button"
+            tabindex="0"
+            title="Go to previous page"
+    >
+        <div
+                class="tab-icon style-scope paper-icon-button navigation-icon"
+                id="icon"
+        >
+            <svg
+                    class="style-scope iron-icon"
+                    focusable="false"
+                    preserveAspectRatio="xMidYMid meet"
+                    style="pointer-events: none; display: block; width: 100%; height: 100%"
+                    viewBox="0 0 492 492"
+            >
+                <g class="style-scope iron-icon">
+                    <path
+                            d="M109.3 265.2l218.9 218.9c5.1 5.1 11.8 7.9 19 7.9s14-2.8 19-7.9l16.1-16.1c10.5-10.5 10.5-27.6 0-38.1L198.6 246.1 382.7 62c5.1-5.1 7.9-11.8 7.9-19 0-7.2-2.8-14-7.9-19L366.5 7.9c-5.1-5.1-11.8-7.9-19-7.9-7.2 0-14 2.8-19 7.9L109.3 227c-5.1 5.1-7.9 11.9-7.8 19.1 0 7.2 2.8 14 7.8 19.1z"
+                    ></path>
+                </g>
+            </svg>
+        </div>
+    </div>
+</div>

src/plugins/navigation/templates/forward.html

@@ -0,0 +1,35 @@
+<div
+  class="style-scope ytmusic-pivot-bar-renderer navigation-item"
+  onclick="history.forward()"
+  role="tab"
+  tab-id="FEmusic_next"
+>
+  <div
+    aria-disabled="false"
+    class="search-icon style-scope ytmusic-search-box"
+    role="button"
+    tabindex="0"
+    title="Go to next page"
+  >
+    <div
+      class="tab-icon style-scope paper-icon-button navigation-icon"
+      id="icon"
+    >
+      <svg
+        class="style-scope iron-icon"
+        focusable="false"
+        preserveAspectRatio="xMidYMid meet"
+        style="pointer-events: none; display: block; width: 100%; height: 100%;"
+        viewBox="0 0 492 492"
+      >
+        <g class="style-scope iron-icon">
+          <path
+            d="M382.7,226.8L163.7,7.9c-5.1-5.1-11.8-7.9-19-7.9s-14,2.8-19,7.9L109.5,24c-10.5,10.5-10.5,27.6,0,38.1
+                    l183.9,183.9L109.3,430c-5.1,5.1-7.9,11.8-7.9,19c0,7.2,2.8,14,7.9,19l16.1,16.1c5.1,5.1,11.8,7.9,19,7.9s14-2.8,19-7.9L382.7,265
+                    c5.1-5.1,7.9-11.9,7.8-19.1C390.5,238.7,387.8,231.9,382.7,226.8z"
+          ></path>
+        </g>
+      </svg>
+    </div>
+  </div>
+</div>