// ==UserScript==
// @name        Youtube download button
// @namespace   Violentmonkey Scripts
// @match       https://www.youtube.com/watch
// @include     https://*.youtube.com/*
// @grant       GM_addStyle
// @run-at      document-start
// @version     1.0
// @author      Nojyto
// @license     MIT 
// @description Adds a download button
// @downloadURL none
// ==/UserScript==

(function() {
    GM_addStyle(`
        #dwnldBtn {
            background-color: #CC0000;
            color: #FFFFFF;

            margin: 0px 4px;
            border-radius: 2px;
            width: 109.94px;
            height: 37px;
            line-height: 37px;
          
            text-align: center;
            font-style: normal;
            font-size: 14px;
            font-family: Roboto, Noto, sans-serif;
            font-weight: 500;
            text-decoration: none;
        }
    `)
    const API = "https://yt1s.com/en/youtube-to-mp3?q="

    function waitForElm(selector){
        return new Promise(resolve => {
            if(document.querySelector(selector)){
                return resolve(document.querySelector(selector))
            }
            const observer = new MutationObserver(mutations => {
                if(document.querySelector(selector)){
                    resolve(document.querySelector(selector))
                    observer.disconnect()
                }
            })
            observer.observe(document.body, {
                childList: true,
                subtree: true
            })
        })
    }  
    
    function addButton(){
        waitForElm("#analytics-button").then((btn) => {
            btn.innerHTML += `\<a href="${API + encodeURIComponent(window.location.href)}" target="_blank" id="dwnldBtn">DOWNLOAD</a>`
        })
    }
  
    function updateButton(){
        waitForElm("#dwnldBtn").then((btn) => {
            btn.href = API + encodeURIComponent(window.location.href)
        })
    }
  
    window.onload = addButton;
    window.addEventListener("yt-navigate-start", updateButton, true)
})()