From 003b4e8218424df3f198722de70476cc51496a7e Mon Sep 17 00:00:00 2001
From: Fabio Manganiello <info@fabiomanganiello.com>
Date: Wed, 23 Feb 2022 21:51:45 +0100
Subject: [PATCH] First commit

---
 README.md | 20 ++++++++++++++-
 ug.js     | 76 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 95 insertions(+), 1 deletion(-)
 create mode 100644 ug.js

diff --git a/README.md b/README.md
index bdbc96a..2d5c66c 100644
--- a/README.md
+++ b/README.md
@@ -1,2 +1,20 @@
 # ultimate-guitar-mytabs
-Browser script to scrape and download your saved UltimateGuitar tabs to CSV/JSON
+
+This browser script allows you to scrape and download your saved UltimateGuitar tabs to JSON format.
+
+There are two ways to use this script:
+
+1. Install it as a Greasemonkey script (or whatever extension you use for custom UserScript).
+   Every time you browse to your UltimateGuitar page, the Download button will appear next to
+   the header.
+
+2. Manually paste the code in the browser developer console - the button will be added on the
+   fly. You can also manually call `getTabs` from the developer console to access, filter
+   and manipulate the list of objects.
+
+![Screenshot](https://i.ibb.co/WPmwQbT/837c447a43af.png)
+
+Note that the script will download all the tabs on the current page. If you want to download all
+of your tabs, then select _All_ from the top filter. The current order of the tabs on the page is
+also preserved in the downloaded JSON.
+
diff --git a/ug.js b/ug.js
new file mode 100644
index 0000000..1bbf7d4
--- /dev/null
+++ b/ug.js
@@ -0,0 +1,76 @@
+// ==UserScript==
+// @name           UltimateGuitar Library Downloader
+// @description    It adds a "Download as JSON" button to the mytabs page on UltimateGuitar.
+// @author         Fabio "Blacklight" Manganiello
+// @version        1.0
+// @grant          none
+// @include        https://www.ultimate-guitar.com/user/mytabs
+// ==/UserScript==
+
+/**
+ * There are two ways to use this script:
+ *
+ * 1. Install it as a Greasemonkey script (or whatever extension you use for custom UserScript).
+ *    Every time you browse to your UltimateGuitar page, the Download button will appear next to
+ *    the header.
+ *
+ * 2. Manually paste the code in the browser developer console - the button will be added on the
+ *    fly. You can also manually call `getTabs` from the developer console to access, filter
+ *    and manipulate the list of objects.
+ */
+
+
+function getTabs() {
+    let artist = null;
+    return [
+        ...document.querySelector('article[isdesktop=true] div').childNodes
+    ].slice(1).map(item => {
+        const childNodes = [...item.childNodes];
+        const parsedItem = {};
+
+        if (childNodes.length > 0) {
+            const cellContent = childNodes[0].innerText.trim();
+            if (cellContent.length)
+                artist = cellContent;
+        }
+
+        if (childNodes.length > 1) {
+            const cellContent = childNodes[1].innerText.trim();
+            if (cellContent.length)
+                parsedItem.title = cellContent;
+
+            const link = childNodes[1].querySelector('a').getAttribute('href');
+            if (link.length)
+                parsedItem.link = link;
+        }
+
+        if (!artist && parsedItem.title)
+            return;
+
+        parsedItem.artist = artist;
+        return parsedItem;
+    }).filter(item => item)
+}
+
+function downloadTabs() {
+    const tabs = getTabs();
+    window.open('data:application/json,' + encodeURIComponent(JSON.stringify(tabs)));
+}
+
+function addDownloadButton() {
+    const header = document.querySelector('main section header');
+    if (!header)
+        return;
+
+    if (header.querySelector('button.__download-btn'))
+        return;
+
+    const btn = document.createElement('button');
+    btn.classList.add('__download-btn');
+    btn.innerText = 'Download as JSON';
+    btn.onclick = downloadTabs;
+    header.querySelector('section').appendChild(btn);
+}
+
+window.onload = addDownloadButton;
+