Fix chords not updating on youtube url change; fix few unresolved chords

extension/background.js

@@ -8,22 +8,30 @@ function getID(url_string) {
 }
 
 function getImgName(name) {
-  var arr = name.split(":");
-
-  if (arr[0] == "A#")
-    arr[0] = "Bb";
-  else if (arr[0] == "D#")
-    arr[0] = "Eb";
-  else if (arr[0] == "Db")
-    arr[0] = "C#";
-  else if (arr[0] == "G#")
-    arr[0] = "Ab";
-
-  left = arr[0];
-  if (arr[0][arr[0].length - 1] == "#")
-    left = arr[0].slice(0, arr[0].length - 1) + "s";
+  var arr = name.split("/")[0].split(":");
+
+  var chord = normalizeChordForImage(arr[0]);
+
+  if (chord[chord.length - 1] == "#")
+    chord = chord.slice(0, chord.length - 1) + "s";
   // console.log(name, arr);
-  return left + "_" + arr[1] + ".png";
+
+  return chord + "_" + arr[1] + ".png";
+}
+
+function normalizeChordForImage(chord){
+  if (chord == "A#")
+    return "Bb";
+  if (chord == "D#")
+    return "Eb";
+  if (chord == "Db")
+    return "C#";
+  if (chord == "G#")
+    return "Ab";
+  if (chord == "Gb")
+    return "F#";
+
+  return chord;
 }
 
 function generateChordsURL(chords) {
@@ -73,6 +81,9 @@ function handleResponse(data, tabId) {
   const chordify_url = data["url"];
   const all_chords = getUniqueChords(data["chords"]);
   const chords = generateChordsURL(all_chords);
+
+  console.log(chords);
+
   sendMsg({
     message: summary,
     url: chordify_url,
@@ -82,7 +93,7 @@ function handleResponse(data, tabId) {
 }
 
 function OnYoutubeLoad(details) {
-  console.log("DomLoaded: ", details.url, details.tabId);
+  console.log("DomLoaded: ", details);
 
   const id = getID(details.url);
   const chordify_api = "https://chordify.net/song/data/youtube:" + id + "?vocabulary=extended_inversions";
@@ -95,9 +106,9 @@ function OnYoutubeLoad(details) {
 
   xhr.onreadystatechange = function () {
     if (xhr.readyState == XMLHttpRequest.DONE) {
-      console.log("DONE", xhr.status);
+      console.log("Received Response", xhr.response);
+
       if (xhr.status == 200) {
-        // console.log("Received Response", xhr.response);
         if (xhr.response == "")
           sendMsg({
             message: "Na",
@@ -116,10 +127,13 @@ function OnYoutubeLoad(details) {
   xhr.send(chordify_api);
 }
 
-browser.webRequest.onBeforeRequest.addListener(
-  OnYoutubeLoad,
-  { urls: ["*://*.youtube.com/watch*"] }
-);
+function handleYoutubeUrlChange(tabId, changeInfo, tabInfo) {
+  if (changeInfo.url) {
+    console.log("Tab: " + tabId + " URL changed to " + changeInfo.url);
+    OnYoutubeLoad({url: changeInfo.url, tabId: tabId});
+  }
+}
+browser.tabs.onUpdated.addListener(handleYoutubeUrlChange, {urls: ["*://*.youtube.com/*"]});
 
 // function showLove(tabId){
 //   sendMsg({
@@ -169,4 +183,4 @@ function onChordifyLoad(details) {
 browser.webRequest.onBeforeRequest.addListener(
   onChordifyLoad,
   { urls: ["*://*.chordify.net/chords/*"] }
-);
+);

extension/contentScript.js

@@ -1,46 +1,65 @@
-waitForElementToDisplay(500);
-function waitForElementToDisplay(time) {
-    if(window.document.getElementById("mm") != undefined) {
-        window.document.getElementById("mm").style.opacity = "0";
-        console.log("background removed");
-    	return;
-    }
-    else {
-        setTimeout(function() {
-            waitForElementToDisplay(time);
-        }, time);
-    }
-}
+function watchAndExecute(time, func) {
+  if(func()){
+    return;
+  }
 
-waitForBottom(500);
-function waitForBottom(time) {
-    if(window.document.getElementsByClassName("dstubn").length > 0 && window.document.getElementsByClassName("dstubn")[0].childNodes.length > 0) {
-        window.document.getElementsByClassName("dstubn")[0].childNodes[0].click();
-        console.log("bottom ad closed");
-    	return;
-    }
-    else {
-        setTimeout(function() {
-            waitIconRight(time);
-        }, time);
-    }
+  setTimeout(() => watchAndExecute(time, func), time);
 }
 
-waitIconRight(2000);
-function waitIconRight(time) {
-    if(window.document.getElementById("play-button") != undefined) {
-        // await delay(10000);
-        var ele = window.document.getElementById("play-button");
-        console.log("right-icon");
-        ele.click();
-    	return;
+// Delete top advertisement
+watchAndExecute(500, function(){
+  if(window.document.getElementById("mm") != undefined) {
+    window.document.getElementById("mm").remove();
+    console.log("top Ad and background removed");
+
+    if(window.document.getElementById("popup") != undefined){
+      window.document.getElementById("popup").remove();
     }
-    else {
-        setTimeout(function() {
-            waitIconRight(time);
-        }, time);
+    return true;
+  }
+
+  return false;
+});
+
+watchAndExecute(500, function(){
+  if(window.document.getElementsByClassName("dstubn").length > 0 && window.document.getElementsByClassName("dstubn")[0].childNodes.length > 0) {
+    window.document.getElementsByClassName("dstubn")[0].childNodes[0].click();
+    console.log("bottom ad closed");
+    return true;
+  }
+
+  return false;
+});
+
+watchAndExecute(2000, function(){
+  if(window.document.getElementById("play-button") != undefined) {
+    var ele = window.document.getElementById("play-button");
+    console.log("right-icon");
+    ele.click();
+    return true;
+  }
+
+  return false;
+});
+
+// Choose Ukulele and play
+watchAndExecute(2000, function(){
+  if(window.document.getElementsByClassName("i1q78294").length == 4) {
+    // Choose Ukulele
+    window.document.getElementsByClassName("i1q78294")[1].click();
+
+    // play
+    window.document.getElementById("play-button").click();
+
+    // close bottom Ad
+    if(window.document.getElementsByClassName("icon-close").length >= 1){
+      window.document.getElementsByClassName("icon-close")[1].click();
     }
-}
 
-// document.getElementsByClassName("dstubn")[0].childNodes[0].click()
-console.log("Content script executed.");
+    return true;
+  }
+
+  return false;
+});
+
+console.log("Content script executed.");

extension/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 2,
   "name": "Chordify",
   "description": "Chordify",
-  "version": "0.6b",
+  "version": "0.8b",
   "applications": {
     "gecko": {
       "strict_min_version": "57.0"

extension/script.js

@@ -56,7 +56,9 @@ function handleMessage(request, sender, sendResponse) {
   // if(request.host == "chordify.net")
   //   waitForElementToDisplay2();
   // else
-  waitForElementToDisplay("menu-container", 500, request);
+  console.log("chordify", request.url);
+
+  waitForElementToDisplay("owner-and-teaser", 500, request);
 }
 
 browser.runtime.onMessage.addListener(handleMessage);

server.py

@@ -4,6 +4,9 @@
 
 import requests
 
+import logging
+logging.getLogger("werkzeug").disabled = True
+
 app = Flask(__name__)
 
 @app.route('/', methods = ['POST', 'GET'])
@@ -14,9 +17,19 @@ def mainFunc():
 		url = request.data
 
 	req = requests.get(url)
-	data = req.text
+	print(url)
+	# print(req.status_code)
+	text_data = req.text
+
+	if req.status_code != 404:
+		json_data = req.json()
+		print(json_data["title"])
+		print(json_data["url"])
+	else:
+		print(req.status_code)
+		text_data = ""
 
-	resp = flask.make_response(data)
+	resp = flask.make_response(text_data)
 	resp.headers["Access-Control-Allow-Origin"] = "*"
 
 	return resp
@@ -32,4 +45,4 @@ def mainFunc():
 # 	return resp
 
 if __name__ == '__main__':
-    app.run(debug=False)
+    app.run(debug=True, port=5000)