V0.1

.gitignore

@@ -0,0 +1 @@
+node_modules

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "discord.enabled": false
+}

LICENSE.md

@@ -0,0 +1,39 @@
+CC0 1.0 Universal
+==================
+
+Statement of Purpose
+---------------------
+
+The laws of most jurisdictions throughout the world automatically confer exclusive Copyright and Related Rights (defined below) upon the creator and subsequent owner(s) (each and all, an "owner") of an original work of authorship and/or a database (each, a "Work").
+
+Certain owners wish to permanently relinquish those rights to a Work for the purpose of contributing to a commons of creative, cultural and scientific works ("Commons") that the public can reliably and without fear of later claims of infringement build upon, modify, incorporate in other works, reuse and redistribute as freely as possible in any form whatsoever and for any purposes, including without limitation commercial purposes. These owners may contribute to the Commons to promote the ideal of a free culture and the further production of creative, cultural and scientific works, or to gain reputation or greater distribution for their Work in part through the use and efforts of others.
+
+For these and/or other purposes and motivations, and without any expectation of additional consideration or compensation, the person associating CC0 with a Work (the "Affirmer"), to the extent that he or she is an owner of Copyright and Related Rights in the Work, voluntarily elects to apply CC0 to the Work and publicly distribute the Work under its terms, with knowledge of his or her Copyright and Related Rights in the Work and the meaning and intended legal effect of CC0 on those rights.
+
+1. Copyright and Related Rights.
+--------------------------------
+A Work made available under CC0 may be protected by copyright and related or neighboring rights ("Copyright and Related Rights"). Copyright and Related Rights include, but are not limited to, the following:
+
+i. the right to reproduce, adapt, distribute, perform, display, communicate, and translate a Work;
+ii. moral rights retained by the original author(s) and/or performer(s);
+iii. publicity and privacy rights pertaining to a person's image or likeness depicted in a Work;
+iv. rights protecting against unfair competition in regards to a Work, subject to the limitations in paragraph 4(a), below;
+v. rights protecting the extraction, dissemination, use and reuse of data in a Work;
+vi. database rights (such as those arising under Directive 96/9/EC of the European Parliament and of the Council of 11 March 1996 on the legal protection of databases, and under any national implementation thereof, including any amended or successor version of such directive); and
+vii. other similar, equivalent or corresponding rights throughout the world based on applicable law or treaty, and any national implementations thereof.
+
+2. Waiver.
+-----------
+To the greatest extent permitted by, but not in contravention of, applicable law, Affirmer hereby overtly, fully, permanently, irrevocably and unconditionally waives, abandons, and surrenders all of Affirmer's Copyright and Related Rights and associated claims and causes of action, whether now known or unknown (including existing as well as future claims and causes of action), in the Work (i) in all territories worldwide, (ii) for the maximum duration provided by applicable law or treaty (including future time extensions), (iii) in any current or future medium and for any number of copies, and (iv) for any purpose whatsoever, including without limitation commercial, advertising or promotional purposes (the "Waiver"). Affirmer makes the Waiver for the benefit of each member of the public at large and to the detriment of Affirmer's heirs and successors, fully intending that such Waiver shall not be subject to revocation, rescission, cancellation, termination, or any other legal or equitable action to disrupt the quiet enjoyment of the Work by the public as contemplated by Affirmer's express Statement of Purpose.
+
+3. Public License Fallback.
+----------------------------
+Should any part of the Waiver for any reason be judged legally invalid or ineffective under applicable law, then the Waiver shall be preserved to the maximum extent permitted taking into account Affirmer's express Statement of Purpose. In addition, to the extent the Waiver is so judged Affirmer hereby grants to each affected person a royalty-free, non transferable, non sublicensable, non exclusive, irrevocable and unconditional license to exercise Affirmer's Copyright and Related Rights in the Work (i) in all territories worldwide, (ii) for the maximum duration provided by applicable law or treaty (including future time extensions), (iii) in any current or future medium and for any number of copies, and (iv) for any purpose whatsoever, including without limitation commercial, advertising or promotional purposes (the "License"). The License shall be deemed effective as of the date CC0 was applied by Affirmer to the Work. Should any part of the License for any reason be judged legally invalid or ineffective under applicable law, such partial invalidity or ineffectiveness shall not invalidate the remainder of the License, and in such case Affirmer hereby affirms that he or she will not (i) exercise any of his or her remaining Copyright and Related Rights in the Work or (ii) assert any associated claims and causes of action with respect to the Work, in either case contrary to Affirmer's express Statement of Purpose.
+
+4. Limitations and Disclaimers.
+--------------------------------
+
+a. No trademark or patent rights held by Affirmer are waived, abandoned, surrendered, licensed or otherwise affected by this document.
+b. Affirmer offers the Work as-is and makes no representations or warranties of any kind concerning the Work, express, implied, statutory or otherwise, including without limitation warranties of title, merchantability, fitness for a particular purpose, non infringement, or the absence of latent or other defects, accuracy, or the present or absence of errors, whether or not discoverable, all to the greatest extent permissible under applicable law.
+c. Affirmer disclaims responsibility for clearing rights of other persons that may apply to the Work or any use thereof, including without limitation any person's Copyright and Related Rights in the Work. Further, Affirmer disclaims responsibility for obtaining any necessary consents, permissions or other rights required for any use of the Work.
+d. Affirmer understands and acknowledges that Creative Commons is not a party to this document and has no duty or obligation with respect to this CC0 or use of the Work.

README.md

@@ -0,0 +1 @@
+# YouTube Presence · _What's watching there_

config.json

@@ -0,0 +1,5 @@
+{
+  "yt_client_id": "463097721130188830",
+  "ytm_client_id": "463151177836658699",
+  "api_key": "AIzaSyB3iCDuT_LkVdcTBRkO_8UtIJYJS7QJPy0"
+}

constants.js

@@ -0,0 +1,19 @@
+const chalk = require("chalk")
+
+let consolePrefix, win, menuBar, menuBarMenu, chromeConnected, presenceReady, presence, setup;
+
+module.exports = {
+  consolePrefix: chalk.bold(chalk.gray("<[ ") + chalk.bgRed(chalk.black(" Y") + chalk.white("T ")) + chalk.cyan(" Presence") + chalk.gray(" ]> ")),
+  win: "",
+  menuBar: "",
+  menuBarMenu: "",
+  chromeConnected: false,
+  presenceReady: false,
+  setup: false,
+  presence: {
+    details: "Waiting for music",
+    state: "to start playing...",
+    largeImageKey: "ytm_lg",
+    instance: true
+  }
+};

extension/background.js

@@ -0,0 +1,48 @@
+function updatePresence(tabId, changeInfo, tab) {
+  if (tab.url) {
+    // Create a URL object from the current tab URL
+    const url = new URL(tab.url);
+    // Parse data
+    const data = tab.url.startsWith("https://music.youtube.com/")
+    ? { connected: true, service: "ytm", url: tab.url }
+    : tab.url.startsWith("https://www.youtube.com/")
+    ? { type: "yt", url: tab.url }
+    : null;
+
+    if (!data) return;
+  
+    const settings = {
+      async: true,
+      crossDomain: true,
+      url: "http://localhost:3000/",
+      method: "POST",
+      headers: {
+        "content-type": "application/json"
+      },
+      processData: false,
+      data: JSON.stringify(data)
+    }
+  
+    $.ajax(settings)
+  }
+}
+
+chrome.tabs.onUpdated.addListener(updatePresence);
+
+function sendAlive() {
+  $.ajax({
+    async: true,
+    crossDomain: true,
+    url: "http://localhost:3000/",
+    method: "POST",
+    headers: {
+      "content-type": "application/json"
+    },
+    processData: false,
+    data: JSON.stringify({
+      connected: true
+    })
+  })
+}
+
+setInterval(sendAlive, 1*1000)

extension/handleYTM.js

@@ -0,0 +1,72 @@
+//* Start interval
+window.onload = function() {
+  setInterval(updateData, 1000);
+};
+
+//* Create used variables
+let urlForVideo, songTime, calcDifference;
+
+function updateData() {
+  if (document.location.href.includes("watch?v=")) urlForVideo = document.location.href;
+  songTime = $(".time-info.style-scope.ytmusic-player-bar").html();
+  calcDifference = songTime.split(" / ", 2);
+
+  var currentSongAuthors = []
+
+  $(".byline.ytmusic-player-bar").contents().each(function(index, item) {
+    if(item.classList != undefined) {
+      if(item.classList.contains("yt-simple-endpoint") == true) {
+        currentSongAuthors.push(item.innerHTML)
+      }
+    }
+  })
+  
+  var currentSongAuthorString = ""
+
+  if(currentSongAuthors.length == 0) {
+    currentSongAuthorString = $(".byline.ytmusic-player-bar").contents().first().text()
+  } else {
+    for(var i = 0; i < currentSongAuthors.length; i++) {
+      if(i == currentSongAuthors.length -1) {
+        currentSongAuthorString = currentSongAuthorString + " - " + currentSongAuthors[i]
+      } else {
+        if(i == 0) {
+          currentSongAuthorString = currentSongAuthorString + currentSongAuthors[i]
+        } else {
+          currentSongAuthorString = currentSongAuthorString + ", " + currentSongAuthors[i]
+        }
+      }
+    }
+  }
+
+  const data = {
+    connected: true,
+    service: "ytm",
+    url: urlForVideo,
+    currentSongTitle: $(".title.style-scope.ytmusic-player-bar").html(),
+    currentSongAuthor: currentSongAuthorString,
+    currentSongStartTime: getSeconds(calcDifference[0]),
+    currentSongEndTime: getSeconds(calcDifference[1])
+  };
+
+  const settings = {
+    async: true,
+    crossDomain: true,
+    url: "http://localhost:3000/",
+    method: "POST",
+    headers: {
+      "content-type": "application/json"
+    },
+    processData: false,
+    data: JSON.stringify(data)
+  };
+
+  $.ajax(settings);
+}
+
+function getSeconds(string) {
+  const a = string.split(":");
+
+  const seconds = +a[0] * 60 + +a[1];
+  return seconds;
+}

extension/manifest.json

@@ -0,0 +1,26 @@
+{
+  "name": "YT Presence",
+  "version": "0.1",
+  "description":
+    "Display your current video/song as a Rich Presence in Discord.",
+  "manifest_version": 2,
+  "icons": {
+    "512": "images/icon512.png"
+  },
+  "background": {
+    "scripts": ["jquery-3.2.1.min.js", "background.js"],
+    "persistent": true
+  },
+  "browser_action": {
+    "default_icon": {
+      "512": "images/icon512.png"
+    }
+  },
+  "content_scripts": [
+    {
+      "js": ["jquery-3.2.1.min.js", "handleYTM.js"],
+      "matches": ["https://music.youtube.com/*"]
+    }
+  ],
+  "permissions": ["http://localhost/*", "tabs"]
+}

extension/popup.css

@@ -0,0 +1,198 @@
+html,
+body {
+  margin: 0;
+  padding: 0;
+}
+
+body {
+  transition: 0.5s all ease-out;
+  width: 200px;
+  min-height: 200px;
+}
+
+button {
+  height: 30px;
+  width: 30px;
+  outline: none;
+}
+
+#header {
+  width: 100%;
+  height: 50px;
+  line-height: 50px;
+  background-color: #ce1d2a;
+  box-shadow: 0px 0px 8px 2px #cccccc;
+}
+
+#header h1 {
+  position: relative;
+  margin: 0;
+  padding: 0;
+  text-align: center;
+  font-size: 20px;
+  color: white;
+  font-weight: 900;
+}
+
+#footer {
+  overflow: hidden;
+  position: relative;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 50px;
+  text-align: center;
+  background-color: rgb(230, 230, 230);
+}
+
+#footer p {
+  margin-top: 5px;
+}
+
+#footer a {
+  text-decoration: none;
+  color: #2196f3;
+}
+
+#footer a:hover {
+  text-decoration: underline;
+  color: #1a76c2;
+}
+
+#footer #heart {
+  color: #ff0c1e;
+  font-size: 20px;
+}
+
+#heading {
+  width: 100%;
+  text-align: center;
+}
+
+#heading h1 {
+  margin: 5px;
+  padding: 0;
+  font-size: 20px;
+  font-weight: 700;
+}
+
+#optionsTable {
+  width: 100%;
+}
+
+#optionsTable table {
+  width: 90%;
+  margin-left: 5%;
+}
+
+#optionsTable th {
+  width: 50%;
+}
+
+#connectionStatus {
+  width: 100%;
+  height: 20px;
+}
+
+#connectionBar {
+  background-color: rgb(30, 243, 30);
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  line-height: 15px;
+}
+
+#connectionBar p {
+  margin: 0;
+  padding: 0;
+}
+
+.right {
+  float: right;
+}
+
+/* The switch - the box around the slider */
+
+.switch {
+  position: relative;
+  display: inline-block;
+  width: 35px;
+  height: 15px;
+}
+
+/* Hide default HTML checkbox */
+
+.switch input {
+  display: none;
+}
+
+/* The slider */
+
+.slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #ccc;
+  -webkit-transition: 0.25s;
+  transition: 0.25s;
+}
+
+.slider:before {
+  position: absolute;
+  content: "";
+  height: 17px;
+  width: 17px;
+  left: -2.5px;
+  top: -2.5px;
+  background-color: white;
+  -webkit-transition: 0.4s;
+  transition: 0.4s;
+  border: 1px solid lightgray;
+}
+
+input:checked + .slider {
+  background-color: #2196f3;
+}
+
+input:disabled + .slider {
+  background-color: rgb(160, 160, 160);
+  cursor: not-allowed;
+}
+
+input:disabled + .slider:before {
+  background-color: lightgray;
+  border: 1px solid rgb(160, 160, 160);
+  cursor: not-allowed;
+}
+
+input:focus + .slider {
+  box-shadow: 0 0 1px #2196f3;
+}
+
+input:checked + .slider:before {
+  -webkit-transform: translateX(20px);
+  -ms-transform: translateX(20px);
+  transform: translateX(20px);
+}
+
+/* Rounded sliders */
+
+.slider.round {
+  border-radius: 34px;
+}
+
+.slider.round:before {
+  border-radius: 50%;
+}
+
+.noselect {
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}

extension/popup.html

@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <link href="popup.css" rel="stylesheet">
+</head>
+
+<body>
+  <div id="header">
+    <h1 class="noselect">YT Presence</h1>
+  </div>
+  <div id="content">
+    <div id="heading">
+      <h1 class="noselect">Options</h1>
+    </div>
+    <div id="optionsTable">
+      <table>
+        <thead>
+          <tr>
+            <th></th>
+            <th></th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <td class="noselect">Enabled</td>
+            <td class="right">
+              <label class="switch">
+                <input class="togglePresence" type="checkbox">
+                <span class="slider round"></span>
+              </label>
+            </td>
+          </tr>
+          <tr>
+            <td class="noselect">YouTube</td>
+            <td class="right">
+              <label class="switch">
+                <input class="toggleYouTube" type="checkbox">
+                <span class="slider round"></span>
+              </label>
+            </td>
+          </tr>
+          <tr>
+            <td class="noselect">YouTube Music</td>
+            <td class="right">
+              <label class="switch">
+                <input class="toggleYouTubeMusic" type="checkbox">
+                <span class="slider round"></span>
+              </label>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+  </div>
+  <div id="footer">
+    <p class="noselect">Made with
+      <span id="heart">&hearts;</span> by
+      <strong>
+        <a target="_blank" title="Click to visit Timeraa's GitHub profile." draggable="false" href="https://github.com/Timeraa/">Timeraa</a>
+      </strong> &
+      <strong>
+        <a target="_blank" title="Click to visit RedstoneDaedalus's GitHub profile." draggable="false" href="https://github.com/RedstoneDaedalus/">RedstoneDaedalus</a>
+      </strong>
+    </p>
+  </div>
+  <div id="connectionStatus">
+    <div id="connectionBar">
+      <p class="noselect">Connected to server.</p>
+    </div>
+  </div>
+  <script src="popup.js"></script>
+</body>
+
+</html>

extension/popup.js

@@ -0,0 +1,68 @@
+const togglePresence = $(".togglePresence"),
+    toggleYouTube = $(".toggleYouTube"),
+    toggleYouTubeMusic = document.getElementsByClassName("toggleYouTubeMusic")[0];
+
+window.onload = function() {
+  togglePresence.on("change", switchPresence);
+  toggleYouTube.on("change", switchYouTube);
+  toggleYouTubeMusic.on("change", switchYouTubeMusic);
+
+  if (localStorage.enabled === "true") togglePresence.checked = true;
+  else {
+    togglePresence.checked = false;
+    toggleYouTube.checked = false;
+    toggleYouTubeMusic.checked = false;
+    toggleYouTube.disabled = true;
+    toggleYouTubeMusic.disabled = true;
+  }
+
+  if (localStorage.youtube === "true") {
+    toggleYouTube.checked = true;
+    toggleYouTube.disabled = false;
+  } else toggleYouTube.checked = false;
+
+  if (localStorage.youTubeMusic === "true") {
+    toggleYouTubeMusic.checked = true;
+    toggleYouTubeMusic.disabled = false;
+  } else toggleYouTubeMusic.checked = false;
+};
+
+function switchPresence() {
+  if (localStorage.enabled === "true") {
+    localStorage.enabled = "false";
+    localStorage.youTube = "false";
+    localStorage.youTubeMusic = "false";
+    toggleYouTube.checked = false;
+    toggleYouTube.disabled = true;
+    toggleYouTubeMusic.checked = false;
+    toggleYouTubeMusic.disabled = true;
+  } else {
+    localStorage.enabled = "true";
+    localStorage.youTube = "true";
+    localStorage.youTubeMusic = "true";
+    toggleYouTube.checked = true;
+    toggleYouTube.disabled = false;
+    toggleYouTubeMusic.checked = true;
+    toggleYouTubeMusic.disabled = false;
+  }
+}
+
+function switchYouTube() {
+  if (localStorage.youTube === "true") {
+    localStorage.youTube = "false";
+    toggleYouTube.checked = false;
+  } else {
+    localStorage.youTube = "true";
+    toggleYouTube.checked = true;
+  }
+}
+
+function switchYouTubeMusic() {
+  if (localStorage.youTubeMusic === "true") {
+    localStorageyouTubeMusic = "false";
+    toggleYouTubeMusic.checked = false;
+  } else {
+    localStorageyouTubeMusic = "true";
+    toggleYouTubeMusic.checked = true;
+  }
+}

handleYTM.js

@@ -0,0 +1,67 @@
+const DiscordRPC = require("discord-rpc");
+const YouTube = require("simple-youtube-api");
+const constants = require("./constants.js");
+const { ytm_client_id, api_key } = require("./config.json");
+const url = require("url");
+const Entities = require("html-entities").AllHtmlEntities;
+const entities = new Entities();
+
+const youtube = new YouTube(api_key);
+
+const rpc = new DiscordRPC.Client({ transport: "ipc" });
+
+let presence,
+  videoAuthor = "fetching...",
+  videoTitle = "fetching...",
+  serviceType,
+  startTime = new Date(),
+  endTime = new Date(),
+  lastTitle,
+  lastStartingTime,
+  setup = false;
+
+async function updatePresence(data) {
+  if (data.currentSongStartTime == lastStartingTime) {
+    if ((data.currentSongAuthor && data.currentSongTitle) != undefined) {
+    rpc.setActivity({
+      details: entities.decode(data.currentSongTitle),
+      state: entities.decode(data.currentSongAuthor),
+      smallImageKey: "pause",
+      smallImageText: "Playback paused.",
+      largeImageKey: "ytm_lg",
+      instance: true
+    });
+  }
+  } else {
+    startTime = new Date();
+    endTime =
+      Math.floor(startTime / 1000) -
+      data.currentSongStartTime +
+      data.currentSongEndTime;
+    lastTitle = data.currentSongTitle;
+    lastStartingTime = data.currentSongStartTime;
+
+    if (data.url.includes("watch?v=")) {
+      if ((data.currentSongAuthor && data.currentSongTitle) != undefined) {
+        rpc.setActivity({
+          details: entities.decode(data.currentSongTitle),
+          state: entities.decode(data.currentSongAuthor),
+          smallImageKey: "play",
+          smallImageText: "Playing back.",
+          largeImageKey: "ytm_lg",
+          startTimestamp: startTime,
+          endTimestamp: endTime,
+          instance: true
+        });
+      }
+    }
+  }
+}
+
+rpc.on("ready", () => {
+  constants.presenceReady = true;
+});
+
+exports.updatePresence = updatePresence;
+
+rpc.login(ytm_client_id).catch(console.error);

inv.html

@@ -0,0 +1,7 @@
+<html>
+<script type="text/javascript">
+</script>
+
+<h1>hi</h1>
+
+</html>

main.js

@@ -0,0 +1,24 @@
+var path = require('path')
+const {app, BrowserWindow} = require('electron')
+require('./menuBar/setup.js')
+var constants = require('./constants.js')
+require('update-electron-app')(
+  {
+    repo: 'Timeraa/YT-Presence',
+    updateInterval: '10 minutes',
+  }
+)
+
+function setup () {
+  require('./presenceHandler.js')
+  constants.win = new BrowserWindow({ 
+    width: 250, 
+    height: 250, 
+    show: false 
+  });
+  const invisPath = 'file://' + path.join(process.cwd() + '/menuBar/popup.html')
+
+  constants.win.loadURL(invisPath);
+}
+
+app.on('ready', setup)

menuBar/popup.css

@@ -0,0 +1,204 @@
+* {
+  font-family: "Open Sans", sans-serif;
+}
+
+html,
+body {
+  margin: 0;
+  padding: 0;
+  overflow: hidden;
+}
+
+body {
+  transition: 0.5s all ease-out;
+  width: 250px;
+}
+
+button {
+  height: 30px;
+  width: 30px;
+  outline: none;
+}
+
+#header {
+  width: 100%;
+  height: 50px;
+  line-height: 50px;
+  background-color: #ce1d2a;
+  box-shadow: 0px 0px 8px 2px #cccccc;
+}
+
+#header h1 {
+  position: relative;
+  margin: 0;
+  padding: 0;
+  text-align: center;
+  font-size: 20px;
+  color: white;
+  font-weight: 800;
+}
+
+#footer {
+  overflow: hidden;
+  position: relative;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 50px;
+  text-align: center;
+  background-color: rgb(230, 230, 230);
+  padding-bottom: 5px;
+}
+
+#footer p {
+  margin: 0;
+  padding: 0;
+}
+
+#footer a {
+  text-decoration: none;
+  color: #2196f3;
+}
+
+#footer a:hover {
+  text-decoration: underline;
+  color: #1a76c2;
+}
+
+#footer #heart {
+  color: #ff0c1e;
+  font-size: 20px;
+}
+
+#heading {
+  width: 100%;
+  text-align: center;
+}
+
+#heading h1 {
+  margin: 5px;
+  padding: 0;
+  font-size: 20px;
+  font-weight: 700;
+}
+
+#optionsTable {
+  width: 100%;
+}
+
+#optionsTable table {
+  width: 95%;
+  margin-left: 2.5%;
+}
+
+#optionsTable th {
+  width: 50%;
+}
+
+#connectionStatus {
+  width: 100%;
+  height: 25px;
+}
+
+#connectionBar {
+  background-color: rgb(30, 243, 30);
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  line-height: 15px;
+}
+
+#connectionBar p {
+  margin: 0;
+  padding: 0;
+}
+
+.right {
+  float: right;
+}
+
+/* The switch - the box around the slider */
+
+.switch {
+  position: relative;
+  display: inline-block;
+  width: 35px;
+  height: 15px;
+}
+
+/* Hide default HTML checkbox */
+
+.switch input {
+  display: none;
+}
+
+/* The slider */
+
+.slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #ccc;
+  -webkit-transition: 0.25s;
+  transition: 0.25s;
+}
+
+.slider:before {
+  position: absolute;
+  content: "";
+  height: 17px;
+  width: 17px;
+  left: -2.5px;
+  top: -2.5px;
+  background-color: white;
+  -webkit-transition: 0.4s;
+  transition: 0.4s;
+  border: 1px solid lightgray;
+}
+
+input:checked + .slider {
+  background-color: #2196f3;
+}
+
+input:disabled + .slider {
+  background-color: rgb(160, 160, 160);
+  cursor: not-allowed;
+}
+
+input:disabled + .slider:before {
+  background-color: lightgray;
+  border: 1px solid rgb(160, 160, 160);
+  cursor: not-allowed;
+}
+
+input:focus + .slider {
+  box-shadow: 0 0 1px #2196f3;
+}
+
+input:checked + .slider:before {
+  -webkit-transform: translateX(20px);
+  -ms-transform: translateX(20px);
+  transform: translateX(20px);
+}
+
+/* Rounded sliders */
+
+.slider.round {
+  border-radius: 34px;
+}
+
+.slider.round:before {
+  border-radius: 50%;
+}
+
+.noselect {
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}

menuBar/popup.html

@@ -0,0 +1,89 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <title>YouTube Presence</title>
+  <script>
+    // renderer process
+    var ipcRenderer = require('electron').ipcRenderer;
+    ipcRenderer.on('chromeConnected', function (event, store) {
+      console.log(store);
+    });
+  </script>
+  <script>if (typeof module === 'object') { window.module = module; module = undefined; }</script>
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700,800" rel="stylesheet">
+  <link href="popup.css" rel="stylesheet">
+  <script src="../jquery-3.2.1.min.js"></script>
+  <script src="popup.js"></script>
+
+  <script>if (window.module) module = window.module;</script>
+
+</head>
+
+<body>
+  <div id="header">
+    <h1 class="noselect">YT Presence</h1>
+  </div>
+  <div id="content">
+    <div id="heading">
+      <h1 class="noselect">Options</h1>
+    </div>
+    <div id="optionsTable">
+      <table>
+        <thead>
+          <tr>
+            <th></th>
+            <th></th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <td class="noselect">Enabled</td>
+            <td class="right">
+              <label class="switch">
+                <input class="togglePresence" type="checkbox">
+                <span class="slider round"></span>
+              </label>
+            </td>
+          </tr>
+          <tr>
+            <td class="noselect">YouTube</td>
+            <td class="right">
+              <label class="switch">
+                <input class="toggleYouTube" type="checkbox">
+                <span class="slider round"></span>
+              </label>
+            </td>
+          </tr>
+          <tr>
+            <td class="noselect">YouTube Music</td>
+            <td class="right">
+              <label class="switch">
+                <input class="toggleYouTubeMusic" type="checkbox">
+                <span class="slider round"></span>
+              </label>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+  </div>
+  <div id="footer">
+    <p class="noselect">Made with
+      <span id="heart">&hearts;</span> by
+      <strong>
+        <a target="_blank" title="Click to visit Timeraa's GitHub profile." draggable="false" href="https://github.com/Timeraa/">Timeraa</a>
+      </strong> &
+      <strong>
+        <a target="_blank" title="Click to visit RedstoneDaedalus's GitHub profile." draggable="false" href="https://github.com/RedstoneDaedalus/">RedstoneDaedalus</a>
+      </strong>
+    </p>
+  </div>
+  <div id="connectionStatus">
+    <div id="connectionBar">
+      <p class="noselect">Connected to server.</p>
+    </div>
+  </div>
+</body>
+
+</html>

menuBar/popup.js

@@ -0,0 +1,69 @@
+var togglePresence,
+    toggleYouTube,
+    toggleYouTubeMusic
+
+$(document).ready(function() {
+    togglePresence = $(".togglePresence"),
+    toggleYouTube = $(".toggleYouTube"),
+    toggleYouTubeMusic = $(".toggleYouTubeMusic");
+
+  togglePresence.change(switchPresence);
+  toggleYouTube.change(switchYouTube);
+  toggleYouTubeMusic.change(switchYouTubeMusic);
+
+  if (localStorage.enabled === "true") togglePresence.prop("checked", true)
+  else {
+    togglePresence.prop("checked", false)
+    toggleYouTube.prop("checked", false)
+    toggleYouTubeMusic.prop("checked", false)
+    toggleYouTube.attr("disabled", "disabled")
+    toggleYouTubeMusic.attr("disabled", "disabled")
+  }
+
+  if (localStorage.youTube === "true") {
+    
+    toggleYouTube.prop("checked", true)
+    toggleYouTube.removeAttr("disabled")
+  } else toggleYouTube.prop("checked", false)
+  
+  if (localStorage.youTubeMusic === "true") {
+    toggleYouTubeMusic.prop("checked", true)
+    toggleYouTubeMusic.removeAttr("disabled")
+  } else toggleYouTubeMusic.prop("checked", false)
+})
+
+function switchPresence() {
+  if (localStorage.enabled === "true") {
+    localStorage.enabled = "false";
+    localStorage.youTube = "false";
+    localStorage.youTubeMusic = "false";
+    toggleYouTube.prop("checked", false)
+    toggleYouTube.attr("disabled", "disabled")
+    toggleYouTubeMusic.prop("checked", false)
+    toggleYouTubeMusic.attr("disabled", "disabled")
+  } else {
+    localStorage.enabled = "true";
+    toggleYouTube.removeAttr("disabled")
+    toggleYouTubeMusic.removeAttr("disabled")
+  }
+}
+
+function switchYouTube() {
+  if (localStorage.youTube === "true") {
+    localStorage.youTube = "false";
+    toggleYouTube.prop("checked", false)
+  } else {
+    localStorage.youTube = "true";
+    toggleYouTube.prop("checked", true)
+  }
+}
+
+function switchYouTubeMusic() {
+  if (localStorage.youTubeMusic === "true") {
+    localStorage.youTubeMusic = "false";
+    toggleYouTubeMusic.prop("checked", false)
+  } else {
+    localStorage.youTubeMusic = "true";
+    toggleYouTubeMusic.prop("checked", true)
+  }
+}

menuBar/setup.js

@@ -0,0 +1,39 @@
+const Path = require('path')
+var MenuBar = require('menubar')
+const {app, Menu, MenuItem} = require('electron')
+var main = require("../main.js")
+var constants = require("../constants.js")
+
+constants.menuBar = MenuBar({
+  preloadWindow: true,
+  icon: "./menuBar/YT-Presence-Icon.png",
+  tooltip: "YouTube Presence",
+})
+
+constants.menuBar.on('ready', function() {
+  constants.menuBar.tray.setTitle(" Connecting...")
+  var menu = new Menu();
+  menu.append(new MenuItem({
+    label: "Show Panel",
+    click: function (menuItem, browserWindow, event) {
+      constants.win.show()
+    }
+  }))
+  menu.append(new MenuItem({
+    type: "separator"
+  }))
+  menu.append(new MenuItem({
+    label: "Check for Updates"
+  }))
+  menu.append(new MenuItem({
+    label: "About"
+  }))
+  menu.append(new MenuItem({
+    type: "separator"
+  }))
+  menu.append(new MenuItem({
+    label: "Quit",
+    role: "quit"
+  }))
+  constants.menuBar.tray.setContextMenu(menu)
+})

package.json

@@ -0,0 +1,25 @@
+{
+  "name": "yt-presence",
+  "version": "1.0.0",
+  "description": "Discord Rich Presence for YouTube and YouTube Music.",
+  "main": "main.js",
+  "scripts": {
+    "start": "electron ."
+  },
+  "repository": "https://github.com/Timeraa/YT-Presence.git",
+  "keywords": [],
+  "author": "Timeraa & RedstoneDaedalus",
+  "license": "MIT",
+  "devDependencies": {
+    "electron": "^2.0.4"
+  },
+  "dependencies": {
+    "chalk": "^2.4.1",
+    "discord-rpc": "^3.0.0-beta.12",
+    "express": "^4.16.3",
+    "html-entities": "^1.2.1",
+    "menubar": "^5.2.3",
+    "simple-youtube-api": "^5.0.2",
+    "update-electron-app": "^1.3.0"
+  }
+}

presenceHandler.js

@@ -0,0 +1,141 @@
+var {webContents} = require('electron')
+
+//* Require needed packages
+const Entities = require('html-entities').AllHtmlEntities
+const entities = new Entities()
+
+const chalk = require("chalk")
+const { yt_client_id, ytm_client_id, api_key } = require("./config")
+const express = require("express")
+var constants = require('./constants.js')
+let YTM = require('./handleYTM.js');
+
+//* Create APP
+const app = express()
+
+app.use(express.json());
+
+let data
+
+app.post("/", async (request, response) => {
+  data = request.body
+  if(data.connected === true) {
+    //* Check if presence is ready
+      if(constants.chromeConnected == false) {
+        constants.chromeConnected = true;
+        constants.menuBar.tray.setTitle(" Connected!")
+        console.log(constants.consolePrefix + chalk.green("Chrome client connected."))
+        setTimeout(function() {
+          constants.menuBar.tray.setTitle("")
+        }, 5*1000)
+      }
+      if(constants.chromeConnected == true && constants.presenceReady == true) {
+        if(serviceType(data.service) == "ytm") YTM.updatePresence(data)
+      }
+  }
+  return response.sendStatus(200);
+})
+
+function serviceType(service) {
+  switch(service) {
+    case "ytm":
+      return "ytm"
+    default:
+      return false
+  }
+}
+
+/*
+//* Define variables
+let presence,
+  videoAuthor = "fetching...",
+  videoTitle = "fetching...",
+  serviceType,
+  body,
+  startTime = Date.now(),
+  endTime = Date.now(),
+  lastTitle,
+  lastStartingTime,
+  currentVideo,
+  setup = false;
+
+//* Use JSON output
+app.use(express.json());
+
+app.post("/", async (request, response) => {
+  body = request.body;
+  if (body.type == "ytm") {
+    //* Set service type
+    serviceType = body.type;
+    if (body.currentSongTitle !== "") {
+      if (body.currentSongTitle !== lastTitle) {
+        //* Defile variables
+        startTime = Date.now();
+        endTime = Math.floor(startTime / 1000) - body.currentSongStartTime + body.currentSongEndTime;
+        lastTitle = body.currentSongTitle;
+        lastStartingTime = body.currentSongStartTime;
+
+        if (body.url.includes("watch?v=")) {
+          // Parse video URL
+          const videoURL = url.parse(
+            body.url.replace("https://music.youtube.com/", "https://www.youtube.com/")
+          );
+          // Fetch video from parsed URL
+          const video = await youtube.getVideoByID(videoURL.query.split("&")[0].slice(2, 255));
+          videoAuthor = video.channel.title.replace(" - Topic", "");
+          videoTitle = video.title
+        }
+      }
+
+      lastStartingTime += 1;
+
+      if (body.currentSongStartTime !== lastStartingTime) {
+        lastStartingTime = body.currentSongStartTime;
+
+        // Set presence data
+        presence = {
+          details: entities.decode(videoTitle),
+          state: entities.decode(videoAuthor),
+          smallImageKey: "pause",
+          smallImageText: "Playback paused.",
+          largeImageKey: "ytm_lg",
+          instance: true
+        };
+        // Update presence from data
+        updatePresence();
+      } else {
+        if (!isNaN(startTime) && !isNaN(endTime)) {
+          // Set presence data
+          presence = {
+            details: entities.decode(videoTitle),
+            state: entities.decode(videoAuthor),
+            smallImageKey: "play",
+            smallImageText: "Playing back.",
+            largeImageKey: "ytm_lg",
+            startTimestamp: startTime,
+            endTimestamp: endTime,
+            instance: true
+          };
+          // Update presence from data
+          updatePresence();
+        }
+      }
+    }
+  }
+  // Send a status of 200
+  return response.sendStatus(200);
+});
+
+//* Update Discord Status
+function updatePresence() {
+  //* Check what discord app to use
+  if (serviceType == "ytm") {
+    //* Update presence
+    discordYTM.updatePresence(presence);
+  }
+}
+
+*/
+
+//* Listen on port 3000
+app.listen(3000, () => console.log(constants.consolePrefix + chalk.green("is ready to use!")));

renderer.js

@@ -0,0 +1,3 @@
+// This file is required by the index.html file and will
+// be executed in the renderer process for that window.
+// All of the Node.js APIs are available in this process.