I guess merge works too

Docs/Guide__Installing.md

@@ -0,0 +1,324 @@
+# Downloading, Installing & Using
+
+**Contents**
+
+- [Downloading, Installing & Using](#downloading-installing--using)
+  - [Downloading](#downloading)
+    - [Desktop (all OS supported by these browsers)](#desktop-all-os-supported-by-these-browsers)
+      - [Chromium Based Browsers](#chromium-based-browsers)
+      - [Firefox Based Browsers](#firefox-based-browsers)
+    - [Mobile](#mobile)
+      - [Android](#android)
+      - [iOS](#ios)
+      - [Userscript](#userscript)
+  - [Installation](#installation)
+    - [Desktop](#desktop)
+      - [**Chromium based browsers**](#chromium-based-browsers-1)
+        - [From Chrome Webstore](#from-chrome-webstore)
+        - [From crx/zip file](#from-crxzip-file)
+        - [From unzipped folder](#from-unzipped-folder)
+      - [**Firefox Based Browsers**](#firefox-based-browsers-1)
+        - [From addon store](#from-addon-store)
+        - [From xpi/jar/zip file](#from-xpijarzip-file)
+    - [Mobile](#mobile-1)
+      - [Android](#android-1)
+        - [App from Play Store](#app-from-play-store)
+        - [On Firefox](#on-firefox)
+      - [iOS](#ios-1)
+  - [Using](#using)
+  - [Updating](#updating)
+    - [Extension / Addon](#extension--addon)
+  - [Miscellaneous](#miscellaneous)
+    - [Using YouTube website as an app with an extension](#using-youtube-website-as-an-app-with-an-extension)
+      - [Desktop](#desktop-1)
+        - [Chromium Based Browsers](#chromium-based-browsers-2)
+        - [Firefox Based Browsers](#firefox-based-browsers-2)
+      - [Mobile](#mobile-2)
+        - [Firefox Based Browsers](#firefox-based-browsers-3)
+        - [Chromium Based Browsers](#chromium-based-browsers-3)
+
+<br>
+
+<br>
+
+## Downloading
+
+### Desktop (all OS supported by these browsers)
+
+<br>
+
+#### [Chromium Based Browsers][4]
+
+This extension has been tested to work on these browsers.
+
+- [Google Chrome][1]
+- [Microsoft Edge][1]
+- [Brave][1]
+- [Opera][1]
+
+It should be able to work on [all Chromium-based browsers (list here)][4]. But that isn't guaranteed.
+
+<br>
+
+#### [Firefox Based Browsers][5]
+
+- [Firefox][2]
+- This addon should be able to run on most of the [Firefox-based browsers][5]. But isn't guaranteed.
+
+<br>
+
+### Mobile
+
+#### Android
+
+1. **F-Droid Store**
+
+- [Show Youtube Dislikes](https://f-droid.org/en/packages/com.jesperh.showyoutubedislikes/)
+  
+  [Download from here (Click here)](https://f-droid.org/en/packages/com.jesperh.showyoutubedislikes/)
+
+  The source code is available at [github.com/jesperbakhandskemager/view-youtube-dislike](https://github.com/jesperbakhandskemager/view-youtube-dislike)
+
+  You can download the apk file from
+  [https://github.com/jesperbakhandskemager/view-youtube-dislike/releases/](https://github.com/jesperbakhandskemager/view-youtube-dislike/releases/)
+
+  **Note: This app is NOT made by the original author of the extension**.
+
+2. [**Firefox Nightly**][2]
+
+- This addon should be able to run on most of the [Firefox-based browsers][5]. But isn't guaranteed.
+
+<br>
+
+#### iOS
+
+No Support on Firefox
+
+You can have a look at these pages for more information (the reason why it's not available on Firefox):
+
+- [https://support.mozilla.org/en-US/kb/add-ons-firefox-ios]
+- [https://support.mozilla.org/en-US/questions/1101350]
+
+For now, you can try this
+
+- [For Jailbroken iOS - **WE TAKE NO RESPONSIBILITY. USE AT YOUR OWN RISK**](https://chariz.com/get/return-youtube-dislike)
+  
+  This is an iOS port [**developed by a separate team**](https://github.com/PoomSmart/Return-YouTube-Dislikes) not related to the owner of github.com/Anarios/return-youtube-dislike
+
+#### Userscript
+
+[Download from here](https://returnyoutubedislike.com/install)
+
+<br>
+
+<br>
+
+## Installation
+
+### Desktop
+
+<br>
+
+#### [**Chromium based browsers**][4]
+
+<br>
+
+##### From Chrome Webstore
+
+1. [Go to website (click here)][1]
+2. Click install
+3. Wait for the extension to download and
+4. 🙂 Installed !!
+
+<br>
+
+##### From crx/zip file
+
+1. Download the crx/zip file.
+2. Type [`chrome://extensions`][6] in address bar
+3. Search for the "Developer Mode" switch and turn it on.
+4. Open the folder and the browser side by side.
+5. Drag and drop the crx/zip file in [chrome://extensions][6] tab
+6. Click on "Add extension"
+7. Installation Completed 🎉
+8. Remember to **turn off the "developer mode"** if not needed
+
+<br>
+
+##### From unzipped folder
+
+1. Download the crx/zip file.
+2. Go to [`chrome://extensions`][6]
+3. Search for the "Developer Mode" switch and turn it on.
+4. Click on "Load Unpacked"
+5. Navigate to the folder & select it
+6. The extension should be installed 🎉
+7. Remember to **turn off the "developer mode"** if not needed
+
+<br>
+
+#### [**Firefox Based Browsers**][5]
+
+##### From addon store
+
+1. Go to the addon store and find the extension or [click here][2].
+2. Click on `Add to Firefox`
+3. Done 🎉 The extension should be installed.
+
+<br>
+
+##### From xpi/jar/zip file
+
+1. Type `about:addons` in the address bar and press "Enter". Alternatively, You can use
+   `Ctrl` + `Shift` + `A` on Windows and
+   `Cmd` + `Shift` + `A` on Mac and
+2. Click on the Setting Gear icon `⚙`.
+3. Click on `Install Add-on From File...`
+4. Locate and click on the .xpi/.jar/.zip file.
+5. Select and click to open it.
+6. Done 🎉 The extension should be installed.
+
+<br>
+
+### Mobile
+
+#### Android
+
+##### App from Play Store
+
+- Although app(s) which use this API exists but aren't they official.
+  
+##### On Firefox
+
+1. Install Firefox Nightly. Refer to this blog post for the procedure: [Expanded extension support in Firefox for Android Nightly](https://blog.mozilla.org/addons/2020/09/29/expanded-extension-support-in-firefox-for-android-nightly/)
+2. Install the extension in it from [addon store][2]
+3. If you want - install the site as an app. For that procedure [go here](#firefox-based-browsers-3).
+
+#### iOS
+
+- [For iOS click here](#ios)
+- Only available on Firefox-based browsers because Chromium-based browsers for the Android platform don't support installing extensions.
+
+<br>
+
+<br>
+
+## Using
+
+No more steps are required, it should start working right away.
+
+If required you can restart your browser.
+
+**🎉 🎊 Congratulations** 🥳 🎊
+
+<br>
+
+<br>
+
+## Updating
+
+### Extension / Addon
+
+On [Chromium based browsers][4]
+
+- [from webstore][1]
+- sideloading from [crx/zip file](#from-crxzip-file) or [unzipped folder](#from-unzipped-folder)
+
+On [Firefox based browsers][5]
+
+- [from addon store][2]
+- [sideloading from xpi/jar/zip file](#from-xpijarzip-file)
+
+On [Firefox based browsers][5] for mobile
+
+- [from addon store][2]
+
+<br>
+
+<br>
+
+## Miscellaneous
+
+### Using YouTube website as an app with an extension
+
+#### Desktop
+
+##### Chromium Based Browsers
+
+0. Go to YouTube
+1. Tap on menu button (`☰` / `⋯` / `⋮`)
+2. Click on "Install YouTube"
+3. 🎉Done!
+
+<br>
+
+##### Firefox Based Browsers
+
+**⚠ Doesn't work on newer versions.**
+
+1. Type [`about:config`](about:config) in address bar & press `Enter` key.
+2. When warned `Proceed with Caution` click on `Accept the Risk and Continue`
+3. Locate and click on the search bar on the page.
+4. Type `browser.ssb.enable`.
+5. click on `⇋` and make sure the state is set to `true`.
+6. Restart the browser and Open YouTube.
+7. Click on `⋮` located in the upper right corner
+8. Click `Install this website as an app` or `Install this website as an app` which depends on the version you are using.
+9. Done! 🎉 You should be able to see the site's app in the start menu.
+
+You can also refer here (for pictures):
+
+[How to Enable the Site-Specific Browser (SSB) in Firefox - Make Tech Easier](https://www.maketecheasier.com/enable-site-specific-browser-firefox)
+
+<br>
+
+#### Mobile
+
+##### Firefox Based Browsers
+
+0. Install the extension
+1. Go to YouTube
+2. Tap on the three dots `⋮` located at the bottom right corner of the screen.
+3. Turn on "Desktop Site".
+4. Refresh the page.
+5. Wait for it to completely load.
+6. Tap again on the three dots `⋮` located at the bottom right corner of the screen.
+7. You will see an option as `Install`. Tap on it.
+8. Tap - `Add` when asked `Add to Home screen?`
+9. Enjoy the YT site as a Firefox nightly app !!
+
+<br>
+
+##### [Chromium Based Browsers][4]
+
+[**Chromium Based browsers**][4] **don't support extensions on Android or iOS**
+
+But still - here are the steps:
+
+1. Go to YouTube
+2. Tap on the three dots `⋮` located at the bottom right corner of the screen.
+3. Turn on "Desktop Site".
+4. Refresh the page and wait for it to completely load.
+5. Tap again on the three dots `⋮` located at the bottom right corner of the screen.
+6. You will see an option as `Install`. Tap on it.
+7. When asked `Install App` tap on `Yes`
+8. Tap - `Add` when asked `Add to Home screen?`
+9. Enjoy the YT site as an app !!
+
+<br>
+
+<br>
+
+<!-- links -->
+
+[1]: https://chrome.google.com/webstore/detail/return-youtube-dislike/gebbhagfogifgggkldgodflihgfeippi
+
+[2]: https://addons.mozilla.org/en-US/firefox/addon/return-youtube-dislikes/
+
+[3]: https://github.com/Anarios/return-youtube-dislike/raw/main/Extensions/UserScript/Return%20Youtube%20Dislike.user.js
+
+[4]: https://en.wikipedia.org/wiki/Chromium_(web_browser)#Browsers_based_on_Chromium
+
+[5]: https://en.wikipedia.org/wiki/Category:Web_browsers_based_on_Firefox
+
+[6]: chrome://extensions

Docs/Guide__Troubleshooting.md

@@ -0,0 +1,187 @@
+Troubleshooting Guide
+
+**Index**
+
+- [Extension](#extension)
+  - [Basic checks](#basic-checks)
+  - [Check API status](#check-api-status)
+  - [Install certificates](#install-certificates)
+  - [Check for logs in the console](#check-for-logs-in-the-console)
+    - [In Chromium Based browsers](#in-chromium-based-browsers)
+    - [In Firefox Based Browsers](#in-firefox-based-browsers)
+  - [Check for conflicting extensions](#check-for-conflicting-extensions)
+  - [Known conflicts](#known-conflicts)
+- [iOS app](#ios-app)
+- [YouTube Vanced  app](#youtube-vanced--app)
+- [Contact in Discord Server](#contact-in-discord-server)
+- [Useful Links](#useful-links)
+
+<br>
+
+## Extension
+
+(for Windows & Macs)
+
+### Basic checks
+
+1. Make sure you have the latest version of the extension installed. ([Click Here to check](https://chrome.google.com/webstore/detail/return-youtube-dislike/gebbhagfogifgggkldgodflihgfeippi#:~:text=Report%20abuse-,Version,-2.0.0.3))
+2. Close all the tabs & restart your browser
+3. Reinstall the extension.
+4. [Check API status]
+5. [Check service worker] (only for chromium based browsers)
+6. [If you are on Windows 7 read this](#install-certificates)
+
+<br>
+
+### Check API status
+
+If the basic checks didn't resolve anything
+
+[See if you get any response from this link (click here)](https://returnyoutubedislikeapi.com/votes?videoId=QOFEgexls14)
+
+- If you **don't see something like** this, then the **API is down** and **everything is fine on your side**.
+  `{"id":"QOFEgexls14","dateCreated":"2021-12-28T02:53:20.995329Z","likes":2968,"dislikes":204,"rating":4.725047080979285,"viewCount":29157,"deleted":false}`
+- If you see some responses but not in the above format (with likes and dislikes) then probably you are being rate-limited. It is done to prevent bot attacks and database vandalization. It depends on IP (its hash - which is never stored in non-volatile storage) for its countermeasures. If many people are accessing the server from the same IP (as in the case of public/institutional Wi-Fi) then it's possible that the IP is being rate-limited. If that's the case, There's no way for us to differentiate you from a bot/attacker.
+
+**If you see "Certificate error" and [if you are on Windows 7 (or earlier) read this](#install-certificates)**
+
+<br><br>
+
+### Install certificates
+
+**Applies for Windows 7 (and earlier) only**
+
+and only for  [Chromium Based Browsers][1]
+
+- [Chromium-based browsers][1] don't have their own certificate manager.
+- They use Windows' certificates manager.
+- Microsoft has officially dropped the support for Windows 7
+
+You will have to install the latest certificates for that.
+
+You can follow this guide:
+
+[Fix error NET::ERR CERT DATE INVALID - Your connection is not private - Windows 7 - 2021](https://youtu.be/JYZLxP2Z8G4)
+
+If you don't want to install the certificate from Google drive
+
+- Here is the official link to the certificate [**x1.i.lencr.org**](http://x1.i.lencr.org/).
+- **You will have to close all the tabs** before downloading this certificate.
+
+**The thumb print of real certificate is `cabd2a79a1076a31f21d253635cb039d4329a5e8`**
+
+**To make sure that you have installed the correct certificate, you should consider checking if the thumbprints match.** To do this you can follow this guide: [How to check a certificate's thumbprint](https://knowledge.digicert.com/solution/SO9840.html)
+
+<br>
+
+### Check for logs in the console
+
+#### [In Chromium Based browsers][1]
+
+1. In Developer tools, go to [`console` panel](https://developer.chrome.com/docs/devtools/open/#console).
+   - For Windows press `Ctrl` + `Shift` + `J` all at once
+   - For Mac press `Cmd` + `Option` + `J` all at once
+2. Find `filter` box in the newly appeared window.
+3. Type `Return`.
+4. Check the [Check API Status](#check-api-status) and see if you get similar responses.
+5. If you see any errors in red [please contact us][4] and report them in our [discord server][3]
+
+<!-- If ever needed
+   - For Android refer to this article: [Remote debug Android devices](https://developer.chrome.com/docs/devtools/remote-debugging/) -->
+
+<br>
+
+#### [In Firefox Based Browsers][2]
+
+1. Open Browser Console
+   - For standard keyboard layout press `Ctrl` + `Shift` + `K` all at once
+   - For Mac keyboard layout press `Cmd` + `Option` + `K` all at once
+   - For Android refer to this article: [Remotely debugging Firefox <36 for Android](https://developer.mozilla.org/en-US/docs/Tools/Remote_Debugging/Firefox_for_Android)
+2. Find `Filter Output` box in the newly appeared window.
+3. Type `Return`.
+4. If you see any errors in red [please contact us][4] and report them in our [discord server][3]
+
+<br>
+
+### Check for conflicting extensions
+
+Some privacy and/or security-focused extensions such as ad- or script-blockers, as well as YouTube customization plugins might prevent the extension from working correctly.  
+Try to disable all other extensions and test whether the extension works.  
+If it does, find the extension(s) preventing RYD from working correctly and re-configure them in a way that'd stop them from interfering.
+
+<br>
+
+### Known conflicts
+
+>### scriptSafe
+>
+> **Solution:** Trust `returnyoutubedislikeapi.com` manually
+>
+> ![rust returnyoutubedislikeapi.com manually](https://cdn.discordapp.com/attachments/821116437720334397/929814357708247060/unknown.png)
+
+<br>
+
+> ### uMatrix
+>
+> **Solution:** Allow XHR for `returnyoutubedislikeapi.com` manually
+>
+> ![Allow XHR for `returnyoutubedislikeapi.com` manually](https://media.discordapp.net/attachments/821116437720334397/929813724238336141/unknown.png)
+
+<br>
+
+<br>
+
+## iOS app
+
+Coming soon. Please have patience.
+
+<br>
+
+<br>
+
+## YouTube Vanced  app
+
+Coming soon. Please have patience.
+
+<br>
+
+<br>
+
+## Contact in Discord Server
+
+**Only if nothing mentioned above helped and you still have a problem.**
+
+[Discord server link: https://discord.gg/mYnESY4Md5][3]
+
+0. Join the discord server if haven't already
+1. Go to the #Bugs-and-problems channel
+2. There, thoroughly describe:
+   - your problem
+   - what you have tried & what didn't work
+   - results of the troubleshooting steps
+
+<!-- {
+  "update_frequency" : "low"
+} -->
+
+<br>
+
+<br>
+
+## Useful Links
+
+[List of Chromium Based Browsers][1]
+
+[List of Firefox Based Browsers][2]
+
+[Return-YouTube-Dislike Discord Server][3]
+
+<!-- links -->
+
+[1]: https://en.wikipedia.org/wiki/Chromium_(web_browser)#Browsers_based_on_Chromium
+
+[2]: https://en.wikipedia.org/wiki/Category:Web_browsers_based_on_Firefox
+
+[3]: https://discord.gg/mYnESY4Md5
+
+[4]: #contact-in-discord-server

Docs/readme.md

@@ -0,0 +1,38 @@
+**Contents**
+
+- [Guides](#guides)
+- [FAQs](#faqs)
+<!-- - [FAQs](#faqs)
+- [Other Lists](#other-lists) -->
+
+<br>
+
+## Guides
+
+- [Downloading, Installing & Using](https://github.com/Anarios/return-youtube-dislike/wiki/Downloading,-Installing-&-Using)
+- [Troubleshooting](https://github.com/Anarios/return-youtube-dislike/wiki/Troubleshooting-Guide)
+<!-- - [FAQ](FAQ.md)
+- [When & How to Report Bugs](Guide__Bug_Reporting.md)
+- [Contributing](https://github.com/Anarios/return-youtube-dislike/blob/main/CONTRIBUTING.md) -->
+<!-- - [How to update wiki](/) -->
+
+<br>
+
+
+## FAQs
+
+- [General](https://github.com/Anarios/return-youtube-dislike/blob/main/Guides/FAQ.md)
+- [Security](https://github.com/Anarios/return-youtube-dislike/blob/main/Guides/SECURITY-FAQ.md)
+
+<!-- - [Privacy](FAQ_Privacy.md)
+- [Technical](FAQ_Technical.md)
+- [Creators](FAQ_Creators.md)
+
+<br>
+
+## Other Lists
+
+- [Common Problems](Common_Problems.md)
+- [Repeated Questions](Repeated_Questions.md)
+- [Repeated Feature requests](Repeated_Feature_requests.md)
+- [Repeated Issues](Repeated_Issues.md) -->

Extensions/combined/debug.js

@@ -1,8 +0,0 @@
-//---   Get Extension Information   ---//
-const extension = chrome.runtime.getManifest();
-
-//---   Get Debug Elements   ---//
-const ver = document.getElementById("extension-version");
-
-//---   Set Debug Elements   ---//
-ver.innerHTML = extension.version;

Extensions/combined/manifest-chrome.json

@@ -25,7 +25,7 @@
         "*://m.youtube.com/*"
       ],
       "exclude_matches": ["*://*.music.youtube.com/*"],
-      "js": ["bundled-content-script.js"],
+      "js": ["ryd.content-script.js"],
       "css": ["content-style.css"]
     }
   ],

Extensions/combined/manifest-firefox.json

@@ -20,7 +20,7 @@
       "exclude_matches": ["*://*.music.youtube.com/*"],
       "run_at": "document_idle",
       "css": ["content-style.css"],
-      "js": ["bundled-content-script.js"]
+      "js": ["ryd.content-script.js"]
     }
   ]
 }

Extensions/combined/popup.css

@@ -91,7 +91,8 @@ button:hover {
   background: none;
   box-shadow: none;
   color: var(--lightGrey);
-  top: 26px; right: 26px;
+  top: 26px;
+  right: 26px;
   padding: 2px;
   z-index: 69;
   height: 2rem;
@@ -110,12 +111,13 @@ button:hover {
 #advancedSettings {
   opacity: 0;
   pointer-events: none;
-  transition-duration: .15s;
+  transition-duration: 0.15s;
   transition-timing-function: ease-in-out;
   transform: scale(1.1);
   position: fixed;
   background: var(--background);
-  top: 10px; right: 14px;
+  top: 10px;
+  right: 14px;
   width: calc(100% - 65px);
   height: calc(100% - 58px);
   border: 2px solid var(--secondary);

Extensions/combined/popup.html

@@ -26,15 +26,13 @@
       <button id="link_website">Website</button>
       <button id="link_github">GitHub</button>
       <button id="link_discord">Discord</button>
-
       <br />
-
       <button style="margin-top: 0.3rem" id="link_faq">FAQ</button>
       <button style="margin-top: 0.3em" id="link_donate">Donate</button>
+      <button style="margin-top: 0.3em" id="link_help">Help</button>
 
       <br />
       <br />
-
       <p style="display: none">API Status: <b id="status"></b></p>
       <img
         id="server-status"
@@ -42,7 +40,7 @@
         src="./icons/server.svg"
         alt=""
       />
-
+      
       <br />
       <br />
     </center>

Extensions/combined/popup.js

@@ -12,30 +12,24 @@ const config = {
     discord: "https://discord.gg/mYnESY4Md5",
     donate: "https://returnyoutubedislike.com/donate",
     faq: "https://returnyoutubedislike.com/faq",
+    help: "https://returnyoutubedislike.com/help"
   },
 };
 
-/*   Links   */
-document.getElementById("link_website").addEventListener("click", () => {
-  chrome.tabs.create({ url: config.links.website });
-});
-
-document.getElementById("link_github").addEventListener("click", () => {
-  chrome.tabs.create({ url: config.links.github });
-});
-
-document.getElementById("link_discord").addEventListener("click", () => {
-  chrome.tabs.create({ url: config.links.discord });
-});
-
-document.getElementById("link_faq").addEventListener("click", () => {
-  chrome.tabs.create({ url: config.links.faq });
-});
-
-document.getElementById("link_donate").addEventListener("click", () => {
-  chrome.tabs.create({ url: config.links.donate });
-});
 
+/*   Links   */
+createLink(config.links.website,"link_website")
+createLink(config.links.github,"link_github")
+createLink(config.links.discord,"link_discord")
+createLink(config.links.faq,"link_faq")
+createLink(config.links.donate,"link_donate")
+createLink(config.links.help,"link_help")
+
+function createLink(url,id) {
+  document.getElementById(id).addEventListener("click",()=>{
+    chrome.tabs.create({ url: url})
+  })
+}
 document
   .getElementById("disable_vote_submission")
   .addEventListener("click", (ev) => {
@@ -127,6 +121,7 @@ function handleDisableVoteSubmissionChangeEvent(value) {
   }
 })();
 
+
 /* popup-script.js
 document.querySelector('#login')
 .addEventListener('click', function () {

README.md

@@ -98,3 +98,5 @@ trig404
 
 [Seed4.Me VPN](https://www.seed4.me/users/register?gift=ReturnYoutubeDislike)
 
+[PocketTube](https://yousub.info/?utm_source=returnyoutubedislike)
+

Website/nuxt.config.js

@@ -31,14 +31,14 @@ export default {
     apiUrl: "https://returnyoutubedislikeapi.com",
   },
 
-  //server: { host: '0.0.0.0', port: 80 }, //LINE FOR DEBUGGING ONLY
+  server: { host: "0.0.0.0", port: 80 }, //LINE FOR DEBUGGING ONLY
 
   target: "static",
   css: [],
   plugins: [],
   components: true,
   buildModules: ["@nuxtjs/vuetify"],
-  modules: ["nuxt-user-agent"],
+  modules: ["@nuxtjs/axios", "nuxt-user-agent"],
 
   // Vuetify module configuration: https://go.nuxtjs.dev/config-vuetify
   vuetify: {

Website/package-lock.json

@@ -8,6 +8,7 @@
       "name": "return-youtube-dislike-site",
       "version": "1.1.0",
       "dependencies": {
+        "@nuxtjs/axios": "^5.13.6",
         "core-js": "^3.15.1",
         "nuxt": "^2.15.7",
         "nuxt-user-agent": "^1.2.2",
@@ -2644,6 +2645,31 @@
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
     },
+    "node_modules/@nuxtjs/axios": {
+      "version": "5.13.6",
+      "resolved": "https://registry.npmjs.org/@nuxtjs/axios/-/axios-5.13.6.tgz",
+      "integrity": "sha512-XS+pOE0xsDODs1zAIbo95A0LKlilvJi8YW0NoXYuq3/jjxGgWDxizZ6Yx0AIIjZOoGsXJOPc0/BcnSEUQ2mFBA==",
+      "dependencies": {
+        "@nuxtjs/proxy": "^2.1.0",
+        "axios": "^0.21.1",
+        "axios-retry": "^3.1.9",
+        "consola": "^2.15.3",
+        "defu": "^5.0.0"
+      }
+    },
+    "node_modules/@nuxtjs/axios/node_modules/defu": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/defu/-/defu-5.0.0.tgz",
+      "integrity": "sha512-VHg73EDeRXlu7oYWRmmrNp/nl7QkdXUxkQQKig0Zk8daNmm84AbGoC8Be6/VVLJEKxn12hR0UBmz8O+xQiAPKQ=="
+    },
+    "node_modules/@nuxtjs/proxy": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@nuxtjs/proxy/-/proxy-2.1.0.tgz",
+      "integrity": "sha512-/qtoeqXgZ4Mg6LRg/gDUZQrFpOlOdHrol/vQYMnKu3aN3bP90UfOUB3QSDghUUK7OISAJ0xp8Ld78aHyCTcKCQ==",
+      "dependencies": {
+        "http-proxy-middleware": "^1.0.6"
+      }
+    },
     "node_modules/@nuxtjs/vuetify": {
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@nuxtjs/vuetify/-/vuetify-1.12.1.tgz",
@@ -2677,6 +2703,14 @@
       "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-5.1.2.tgz",
       "integrity": "sha512-h4lTMgMJctJybDp8CQrxTUiiYmedihHWkjnF/8Pxseu2S6Nlfcy8kwboQ8yejh456rP2yWoEVm1sS/FVsfM48w=="
     },
+    "node_modules/@types/http-proxy": {
+      "version": "1.17.8",
+      "resolved": "https://registry.npmjs.org/@types/http-proxy/-/http-proxy-1.17.8.tgz",
+      "integrity": "sha512-5kPLG5BKpWYkw/LVOGWpiq3nEVqxiN32rTgI53Sk12/xHFQ2rG3ehI9IO+O3W2QoKeyB92dJkoka8SUm6BX1pA==",
+      "dependencies": {
+        "@types/node": "*"
+      }
+    },
     "node_modules/@types/json-schema": {
       "version": "7.0.9",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.9.tgz",
@@ -3417,6 +3451,23 @@
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz",
       "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA=="
     },
+    "node_modules/axios": {
+      "version": "0.21.4",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.4.tgz",
+      "integrity": "sha512-ut5vewkiu8jjGBdqpM44XxjuCjq9LAKeHVmoVfHVzy8eHgxxq8SbAVQNovDA8mVi05kP0Ea/n/UzcSHcTJQfNg==",
+      "dependencies": {
+        "follow-redirects": "^1.14.0"
+      }
+    },
+    "node_modules/axios-retry": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/axios-retry/-/axios-retry-3.2.4.tgz",
+      "integrity": "sha512-Co3UXiv4npi6lM963mfnuH90/YFLKWWDmoBYfxkHT5xtkSSWNqK9zdG3fw5/CP/dsoKB5aMMJCsgab+tp1OxLQ==",
+      "dependencies": {
+        "@babel/runtime": "^7.15.4",
+        "is-retry-allowed": "^2.2.0"
+      }
+    },
     "node_modules/babel-eslint": {
       "version": "10.1.0",
       "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz",
@@ -6043,6 +6094,11 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/eventemitter3": {
+      "version": "4.0.7",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
+      "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw=="
+    },
     "node_modules/events": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
@@ -6529,6 +6585,25 @@
         "readable-stream": "^2.3.6"
       }
     },
+    "node_modules/follow-redirects": {
+      "version": "1.14.6",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.6.tgz",
+      "integrity": "sha512-fhUl5EwSJbbl8AR+uYL2KQDxLkdSjZGR36xy46AO7cOMTrCMON6Sa28FmAnC2tRTDbd/Uuzz3aJBv7EBN7JH8A==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/for-in": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
@@ -7278,6 +7353,45 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/http-proxy": {
+      "version": "1.18.1",
+      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
+      "integrity": "sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==",
+      "dependencies": {
+        "eventemitter3": "^4.0.0",
+        "follow-redirects": "^1.0.0",
+        "requires-port": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=8.0.0"
+      }
+    },
+    "node_modules/http-proxy-middleware": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-1.3.1.tgz",
+      "integrity": "sha512-13eVVDYS4z79w7f1+NPllJtOQFx/FdUW4btIvVRMaRlUY9VGstAbo5MOhLEuUgZFRHn3x50ufn25zkj/boZnEg==",
+      "dependencies": {
+        "@types/http-proxy": "^1.17.5",
+        "http-proxy": "^1.18.1",
+        "is-glob": "^4.0.1",
+        "is-plain-obj": "^3.0.0",
+        "micromatch": "^4.0.2"
+      },
+      "engines": {
+        "node": ">=8.0.0"
+      }
+    },
+    "node_modules/http-proxy-middleware/node_modules/is-plain-obj": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-3.0.0.tgz",
+      "integrity": "sha512-gwsOE28k+23GP1B6vFl1oVh/WOzmawBrKwo5Ev6wMKzPkaXaCDIQKzLnvsA42DRlbVTWorkgTKIviAKCWkfUwA==",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/https-browserify": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
@@ -7835,6 +7949,17 @@
       "resolved": "https://registry.npmjs.org/is-resolvable/-/is-resolvable-1.1.0.tgz",
       "integrity": "sha512-qgDYXFSR5WvEfuS5dMj6oTMEbrrSaM0CrFk2Yiq/gXnBvD9pMa2jGXxyhGLfvhZpuMZe18CJpFxAt3CRs42NMg=="
     },
+    "node_modules/is-retry-allowed": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-2.2.0.tgz",
+      "integrity": "sha512-XVm7LOeLpTW4jV19QSH38vkswxoLud8sQ57YwJVTPWdiaI9I8keEhGFpBlslyVsgdQy4Opg8QOLb8YRgsyZiQg==",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/is-shared-array-buffer": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.1.tgz",
@@ -11112,6 +11237,11 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/requires-port": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+      "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
+    },
     "node_modules/resolve": {
       "version": "1.20.0",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz",
@@ -16642,6 +16772,33 @@
         }
       }
     },
+    "@nuxtjs/axios": {
+      "version": "5.13.6",
+      "resolved": "https://registry.npmjs.org/@nuxtjs/axios/-/axios-5.13.6.tgz",
+      "integrity": "sha512-XS+pOE0xsDODs1zAIbo95A0LKlilvJi8YW0NoXYuq3/jjxGgWDxizZ6Yx0AIIjZOoGsXJOPc0/BcnSEUQ2mFBA==",
+      "requires": {
+        "@nuxtjs/proxy": "^2.1.0",
+        "axios": "^0.21.1",
+        "axios-retry": "^3.1.9",
+        "consola": "^2.15.3",
+        "defu": "^5.0.0"
+      },
+      "dependencies": {
+        "defu": {
+          "version": "5.0.0",
+          "resolved": "https://registry.npmjs.org/defu/-/defu-5.0.0.tgz",
+          "integrity": "sha512-VHg73EDeRXlu7oYWRmmrNp/nl7QkdXUxkQQKig0Zk8daNmm84AbGoC8Be6/VVLJEKxn12hR0UBmz8O+xQiAPKQ=="
+        }
+      }
+    },
+    "@nuxtjs/proxy": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@nuxtjs/proxy/-/proxy-2.1.0.tgz",
+      "integrity": "sha512-/qtoeqXgZ4Mg6LRg/gDUZQrFpOlOdHrol/vQYMnKu3aN3bP90UfOUB3QSDghUUK7OISAJ0xp8Ld78aHyCTcKCQ==",
+      "requires": {
+        "http-proxy-middleware": "^1.0.6"
+      }
+    },
     "@nuxtjs/vuetify": {
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@nuxtjs/vuetify/-/vuetify-1.12.1.tgz",
@@ -16675,6 +16832,14 @@
       "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-5.1.2.tgz",
       "integrity": "sha512-h4lTMgMJctJybDp8CQrxTUiiYmedihHWkjnF/8Pxseu2S6Nlfcy8kwboQ8yejh456rP2yWoEVm1sS/FVsfM48w=="
     },
+    "@types/http-proxy": {
+      "version": "1.17.8",
+      "resolved": "https://registry.npmjs.org/@types/http-proxy/-/http-proxy-1.17.8.tgz",
+      "integrity": "sha512-5kPLG5BKpWYkw/LVOGWpiq3nEVqxiN32rTgI53Sk12/xHFQ2rG3ehI9IO+O3W2QoKeyB92dJkoka8SUm6BX1pA==",
+      "requires": {
+        "@types/node": "*"
+      }
+    },
     "@types/json-schema": {
       "version": "7.0.9",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.9.tgz",
@@ -17301,6 +17466,23 @@
         }
       }
     },
+    "axios": {
+      "version": "0.21.4",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.4.tgz",
+      "integrity": "sha512-ut5vewkiu8jjGBdqpM44XxjuCjq9LAKeHVmoVfHVzy8eHgxxq8SbAVQNovDA8mVi05kP0Ea/n/UzcSHcTJQfNg==",
+      "requires": {
+        "follow-redirects": "^1.14.0"
+      }
+    },
+    "axios-retry": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/axios-retry/-/axios-retry-3.2.4.tgz",
+      "integrity": "sha512-Co3UXiv4npi6lM963mfnuH90/YFLKWWDmoBYfxkHT5xtkSSWNqK9zdG3fw5/CP/dsoKB5aMMJCsgab+tp1OxLQ==",
+      "requires": {
+        "@babel/runtime": "^7.15.4",
+        "is-retry-allowed": "^2.2.0"
+      }
+    },
     "babel-eslint": {
       "version": "10.1.0",
       "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz",
@@ -19311,6 +19493,11 @@
       "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
       "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
     },
+    "eventemitter3": {
+      "version": "4.0.7",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
+      "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw=="
+    },
     "events": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
@@ -19695,6 +19882,11 @@
         "readable-stream": "^2.3.6"
       }
     },
+    "follow-redirects": {
+      "version": "1.14.6",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.6.tgz",
+      "integrity": "sha512-fhUl5EwSJbbl8AR+uYL2KQDxLkdSjZGR36xy46AO7cOMTrCMON6Sa28FmAnC2tRTDbd/Uuzz3aJBv7EBN7JH8A=="
+    },
     "for-in": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
@@ -20257,6 +20449,35 @@
         "toidentifier": "1.0.0"
       }
     },
+    "http-proxy": {
+      "version": "1.18.1",
+      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
+      "integrity": "sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==",
+      "requires": {
+        "eventemitter3": "^4.0.0",
+        "follow-redirects": "^1.0.0",
+        "requires-port": "^1.0.0"
+      }
+    },
+    "http-proxy-middleware": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-1.3.1.tgz",
+      "integrity": "sha512-13eVVDYS4z79w7f1+NPllJtOQFx/FdUW4btIvVRMaRlUY9VGstAbo5MOhLEuUgZFRHn3x50ufn25zkj/boZnEg==",
+      "requires": {
+        "@types/http-proxy": "^1.17.5",
+        "http-proxy": "^1.18.1",
+        "is-glob": "^4.0.1",
+        "is-plain-obj": "^3.0.0",
+        "micromatch": "^4.0.2"
+      },
+      "dependencies": {
+        "is-plain-obj": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-3.0.0.tgz",
+          "integrity": "sha512-gwsOE28k+23GP1B6vFl1oVh/WOzmawBrKwo5Ev6wMKzPkaXaCDIQKzLnvsA42DRlbVTWorkgTKIviAKCWkfUwA=="
+        }
+      }
+    },
     "https-browserify": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
@@ -20652,6 +20873,11 @@
       "resolved": "https://registry.npmjs.org/is-resolvable/-/is-resolvable-1.1.0.tgz",
       "integrity": "sha512-qgDYXFSR5WvEfuS5dMj6oTMEbrrSaM0CrFk2Yiq/gXnBvD9pMa2jGXxyhGLfvhZpuMZe18CJpFxAt3CRs42NMg=="
     },
+    "is-retry-allowed": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-2.2.0.tgz",
+      "integrity": "sha512-XVm7LOeLpTW4jV19QSH38vkswxoLud8sQ57YwJVTPWdiaI9I8keEhGFpBlslyVsgdQy4Opg8QOLb8YRgsyZiQg=="
+    },
     "is-shared-array-buffer": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.1.tgz",
@@ -23285,6 +23511,11 @@
       "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
       "dev": true
     },
+    "requires-port": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+      "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
+    },
     "resolve": {
       "version": "1.20.0",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz",

Website/package.json

@@ -10,6 +10,7 @@
     "lint": "eslint --fix --ext .js,.vue --ignore-path .eslintignore ."
   },
   "dependencies": {
+    "@nuxtjs/axios": "^5.13.6",
     "core-js": "^3.15.1",
     "nuxt": "^2.15.7",
     "nuxt-user-agent": "^1.2.2",

Website/pages/debug.vue

@@ -1,71 +1,252 @@
 <template>
   <div>
-    <!--   Top Section // "Sections" Card   -->
-    <v-card max-width="600px" class="rounded-lg">
-      <v-card-title style="padding-bottom: 0">Debug Information</v-card-title>
-      <v-card-text style="text-align: left">
-        <!--   Gather Browser Information   -->
-        <span><b>Browser Information:</b></span
-        ><br />
-        <span>Browser: {{ device._parsed.name }}</span
-        ><br />
-        <span>Browser Vendor: {{ device._parsed.vendor }}</span
+    <v-stepper :value="progress" class="mt-12" outlined max-width="800px">
+      <v-stepper-header>
+        <v-stepper-step step="1" :complete="steps.one">Setup</v-stepper-step>
+        <v-divider />
+        <v-stepper-step step="2" :complete="steps.two"
+          >Extension Status</v-stepper-step
+        >
+        <v-divider />
+        <v-stepper-step step="3" :complete="steps.three"
+          >Server Connection</v-stepper-step
+        >
+        <v-divider />
+        <v-stepper-step step="4" :complete="steps.four"
+          >Browser Support</v-stepper-step
+        >
+        <v-divider />
+        <v-stepper-step step="5" :complete="steps.five">Report</v-stepper-step>
+      </v-stepper-header>
+
+      <v-stepper-content step="1">
+        <h1>Getting Ready...</h1>
+        <v-progress-circular
+          indeterminate
+          size="50"
+          width="5"
+          color="primary"
+        />
+      </v-stepper-content>
+
+      <v-stepper-content step="2">
+        <h1>Ensuring the Extension is Running...</h1>
+        <v-progress-circular
+          indeterminate
+          size="50"
+          width="5"
+          color="primary"
+        />
+      </v-stepper-content>
+
+      <v-stepper-content step="3">
+        <h1>Testing Server Connection...</h1>
+        <v-progress-circular
+          indeterminate
+          size="50"
+          width="5"
+          color="primary"
+        />
+      </v-stepper-content>
+
+      <v-stepper-content step="4">
+        <h1>Checking Browser Information...</h1>
+        <v-progress-circular
+          indeterminate
+          size="50"
+          width="5"
+          color="primary"
+        />
+      </v-stepper-content>
+
+      <v-stepper-content step="5" style="text-align: left">
+        <div class="reportHeader">
+          <h1>Browser</h1>
+          <v-divider style="transform: translateY(1.5em)" />
+        </div>
+        <v-alert
+          dense
+          outlined
+          :type="notices.browser.type"
+          v-text="notices.browser.text"
+        />
+        <span><b>BROWSER-</b> {{ userInformation.browser.name }}</span
         ><br />
-        <span>Version: {{ device._parsed.version }}</span
+        <span><b>VENDOR-</b> {{ userInformation.browser.vendor }} </span><br />
+        <span><b>VERSION-</b> {{ userInformation.browser.version }}</span
         ><br />
-        <span>Operating System: {{ device._parsed.os }}</span
+
+        <div class="reportHeader">
+          <h1>System</h1>
+          <v-divider style="transform: translateY(1.5em)" />
+        </div>
+        <v-alert
+          dense
+          outlined
+          :type="notices.system.type"
+          v-text="notices.system.text"
+        />
+        <span><b>OS-</b> {{ userInformation.system.os }}</span
         ><br />
-        <span>Operating System Version: {{ device._parsed.os_version }}</span
+        <span><b>VERSION-</b> {{ userInformation.system.version }} </span><br />
+        <span><b>TYPE-</b> {{ userInformation.system.type }}</span
         ><br />
-        <span>Device Type: {{ device._parsed.category }}</span
-        ><br /><br />
-        <!--   Gather Extension Information   -->
-        <span><b>Installed Extension Information:</b></span
+
+        <div class="reportHeader">
+          <h1>Extension</h1>
+          <v-divider style="transform: translateY(1.5em)" />
+        </div>
+        <v-alert
+          dense
+          outlined
+          :type="notices.extension.type"
+          v-text="notices.extension.text"
+        />
+        <span
+          ><b>LATEST EXTENSION VERSION-</b>
+          {{
+            userInformation.extension.latestExtensionVersion ||
+            "Failed to lookup data"
+          }}</span
         ><br />
         <span
-          >Extension Version:
-          <span id="extension-version">Waiting For Extension...</span></span
+          ><b>SERVER CONNECTION-</b>
+          {{
+            userInformation.extension.serverConnection
+              ? "Working"
+              : "Failed to connect"
+          }}</span
         ><br />
-      </v-card-text>
-      <v-card-actions>
-        <v-spacer />
-        <v-btn @click="copy()">
-          <v-icon small style="margin-right: 0.25em">mdi-content-copy</v-icon
-          >Copy
-        </v-btn>
-      </v-card-actions>
-    </v-card>
+      </v-stepper-content>
+    </v-stepper>
   </div>
 </template>
 
 <script>
 export default {
-  transition(to) {
-    return to.name == "debug" ? "swoop-in" : "swoop-out";
-  },
   data() {
     return {
-      device: this.$ua,
+      stepTime: 2500,
+      supportedBrowsers: ["Firefox", "Chrome", "Brave", "Edge", "Opera"],
+
+      progress: 1,
+      steps: {
+        one: false,
+        two: false,
+        three: false,
+        four: false,
+        five: false,
+      },
+
+      userInformation: {
+        browser: {
+          name: this.$ua._parsed.name,
+          vendor: this.$ua._parsed.vendor,
+          version: this.$ua._parsed.version,
+        },
+        system: {
+          os: this.$ua._parsed.os,
+          version: this.$ua._parsed.os_version,
+          type: this.$ua._parsed.category,
+        },
+        extension: {
+          serverConnection: null,
+          latestExtensionVersion: null,
+        },
+      },
+
+      notices: {
+        system: {
+          text: null,
+          type: null,
+        },
+        browser: {
+          text: null,
+          type: null,
+        },
+        extension: {
+          text: null,
+          type: null,
+        },
+      },
     };
   },
 
-  methods: {
-    copy() {
-      const toCopy = `\`\`\`
-Browser Information:
-Browser: ${this.device._parsed.name}
-Browser Vendor: ${this.device._parsed.vendor}
-Version: ${this.device._parsed.version}
-Operating System: ${this.device._parsed.os}
-Operating System Version: ${this.device._parsed.os_version}
-Device Type: ${this.device._parsed.category}
-
-Installed Extension Information:
-Extension Version: ${document.getElementById("extension-version").innerHTML}
-\`\`\``;
-
-      navigator.clipboard.writeText(toCopy);
-    },
+  mounted() {
+    //---   Init Stuff   ---//
+    setTimeout(() => {
+      this.$axios
+        .$get(
+          "https://raw.githubusercontent.com/Anarios/return-youtube-dislike/main/Extensions/combined/manifest-chrome.json"
+        )
+        .then((res) => {
+          this.userInformation.extension.latestExtensionVersion = res.version;
+        });
+
+      this.progress++;
+      this.steps.one = true;
+    }, this.stepTime);
+
+    //---   Check If Extension Is Running   ---//
+    setTimeout(() => {
+      this.progress++;
+      this.steps.two = true;
+    }, this.stepTime * 2);
+
+    //---   Check Server Connection ---//
+    setTimeout(() => {
+      this.$axios
+        .$get("https://returnyoutubedislikeapi.com/votes?videoId=QOFEgexls14")
+        .then(() => {
+          this.userInformation.extension.serverConnection = true;
+        })
+        .catch(() => {
+          this.userInformation.extension.serverConnection = false;
+        });
+
+      this.progress++;
+      this.steps.three = true;
+    }, this.stepTime * 3);
+
+    setTimeout(() => {
+      this.progress++;
+      this.steps.four = true;
+      //this.steps.five = true;
+
+      //---   Parse Extension Data   ---//
+      this.notices.extension.text = `We are unable to automatically check that your extension is up to date. Please check that the number below matches your extension version.`;
+      this.notices.extension.type = "warning";
+
+      if (this.userInformation.extension.serverConnection != true) {
+        this.notices.extension.text = `Failed to connect to the server!`;
+        this.notices.extension.type = "error";
+      }
+
+      //---   Parse System Compatibility   ---//
+      this.notices.system.text = `${this.userInformation.system.os} is supported!`;
+      this.notices.system.type = "success";
+
+      if (this.userInformation.system.type != "pc") {
+        this.notices.system.text = `"${this.userInformation.system.type}" may not be a supported device type!`;
+        this.notices.system.type = "warning";
+      }
+
+      //---   Parse Browser Compatibility   ---//
+      this.notices.browser.text = `${this.userInformation.browser.name} ${this.userInformation.browser.version} is supported!`;
+      this.notices.browser.type = "success";
+
+      if (!this.supportedBrowsers.includes(this.userInformation.browser.name)) {
+        this.notices.browser.text = `${this.userInformation.browser.name} is not a supported browser! You may continue to use the extension, but we don't provide official support.`;
+        this.notices.browser.type = "warning";
+      }
+    }, this.stepTime * 4);
   },
 };
 </script>
+
+<style scoped>
+.reportHeader {
+  display: flex;
+  margin-top: 1em;
+}
+</style>

Website/pages/help.vue

@@ -89,9 +89,8 @@
 
           <li>
             Take screenshot of extensions page of your browser with extension
-            installed.
-            <br />
-            To see extensions put this into adress bar:
+            installed. <br />
+            To see extensions put this into address bar:
             <br />
             <code>about:addons</code> for Firefox
             <br />

webpack.config.js

@@ -2,10 +2,20 @@ const path = require("path");
 const CopyPlugin = require("copy-webpack-plugin");
 const FileManagerPlugin = require("filemanager-webpack-plugin");
 
+const entries = ['ryd.content-script', 'ryd.background', 'popup', 'debug'];
+
+const ignorePatterns = [
+  "**/manifest-**",
+  "**/dist/**",
+  "**/src/**",
+  "**/readme.md",
+  ...entries.map(entry => `**/${entry}.js`)
+];
+
 module.exports = {
-  entry: path.join(__dirname, "./Extensions/combined/ryd.content-script.js"),
+  entry: Object.fromEntries(entries.map(entry => [entry, path.join(__dirname, './Extensions/combined/', `${entry}.js`)])),
   output: {
-    filename: "bundled-content-script.js",
+    filename: "[name].js",
     path: path.resolve(__dirname, "Extensions/combined/dist"),
     clean: true,
   },
@@ -23,12 +33,7 @@ module.exports = {
           from: "./Extensions/combined",
           to: "./chrome",
           globOptions: {
-            ignore: [
-              "**/manifest-**",
-              "**/dist/**",
-              "**/src/**",
-              "**/ryd.content-script.js",
-            ],
+            ignore: ignorePatterns,
           },
         },
         {
@@ -39,12 +44,7 @@ module.exports = {
           from: "./Extensions/combined",
           to: "./firefox",
           globOptions: {
-            ignore: [
-              "**/manifest-**",
-              "**/dist/**",
-              "**/src/**",
-              "**/ryd.content-script.js",
-            ],
+            ignore: ignorePatterns,
           },
         },
         {
@@ -58,14 +58,14 @@ module.exports = {
         onEnd: {
           copy: [
             {
-              source: "./Extensions/combined/dist/bundled-content-script.js",
+              source: "./Extensions/combined/dist/**.js",
               destination:
-                "./Extensions/combined/dist/firefox/bundled-content-script.js",
+                "./Extensions/combined/dist/firefox/",
             },
             {
-              source: "./Extensions/combined/dist/bundled-content-script.js",
+              source: "./Extensions/combined/dist/**.js",
               destination:
-                "./Extensions/combined/dist/chrome/bundled-content-script.js",
+                "./Extensions/combined/dist/chrome/",
             },
           ],
         },