diff --git a/src/manifest.json b/src/manifest.json index f8c98fd..3328963 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -1,7 +1,7 @@ { "manifest_version": 2, "name": "Better Youtube +", - "version": "1.6.1", + "version": "1.6.3", "description": "Enhancements for Youtube to have a better experience.", "browser_specific_settings": { @@ -29,4 +29,4 @@ }, "background": { "scripts": ["scripts/background.js"] } -} +} \ No newline at end of file diff --git a/src/scripts/betterYoutube.js b/src/scripts/betterYoutube.js index 138df24..f219c0e 100644 --- a/src/scripts/betterYoutube.js +++ b/src/scripts/betterYoutube.js @@ -47,7 +47,7 @@ </ul> ` const popedContainerTemplate = ` - <div id="draggable" style="display:none; block; top: 114px; left: 408px;"> + <div id="ytDraggable" style="display:none; bottom: 0px; right: 0px;"> <iframe id="popIframe" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" autoplay="" allowfullscreen="true" width="650px" height="400px" frameborder="0" src="" /> </iframe> @@ -95,13 +95,27 @@ count++; } } - }, 500); // check every 500ms + }, 500); const setupProcess = () => { loadUI(); - setupVariables(); - fillUIAndSetupEvents(); - setupObservers(); + setupVariables().then(() => { + let tid = -1; + + function timer() { + // Video Controler + video = document.getElementsByTagName("video")[0]; + + if (video) { + clearInterval(tid); + + fillUIAndSetupEvents(); + setupObservers(); + } + } + + tid = setInterval(timer, 1000); + }); } const loadUI = () => { @@ -132,7 +146,7 @@ } } - const setupVariables = () => { + const setupVariables = async () => { ytEnhancerMenu2 = document.getElementById("enhancerMenuID2"); ytThumbnailBttn = document.getElementById("ytThumbnailBttn"); ytLoopBttn = document.getElementById("ytLoopBttn"); @@ -154,13 +168,10 @@ ytMqDefaultImg = document.getElementById("ytMqDefaultImgID"); ytSdDefaultImg = document.getElementById("ytSdDefaultImgID"); - poppedContainer = document.getElementById("draggable"); + poppedContainer = document.getElementById("ytDraggable"); ytIfrm = document.getElementById("popIframe"); slugInputTag = document.getElementById("slugCopyZone"); - // Video Controler - video = document.getElementsByTagName("video")[0]; // Actual video object (I think...) - // Container of actual player (Used for floating window) containerOfPlyrWndow = document.getElementById("player-container"); part = "https://img.youtube.com/vi/"; @@ -222,7 +233,10 @@ controlsShowHideToggle(mutation.target); } else if (mutation.type === 'childList') { if (this.isEndlessWatch) { - let elm = document.querySelector(dialogElementQueryRef).parentElement; + let target = document.querySelector(dialogElementQueryRef); + if (!target) continue + + let elm = target.parentElement; elmDisplayState = elm.style.display; if (elmDisplayState !== 'none' && modalHasBeenClosed == false) { modalHasBeenClosed = true; @@ -478,4 +492,4 @@ const setbuttonImage = (elm, path) => { elm.style.backgroundImage = "url('" + browser.runtime.getURL(path); + "')"; } -}()); +}()); \ No newline at end of file diff --git a/src/styles/betterYoutube.css b/src/styles/betterYoutube.css index abe4737..ffd8f8b 100644 --- a/src/styles/betterYoutube.css +++ b/src/styles/betterYoutube.css @@ -25,7 +25,7 @@ yt-formatted-string > a:hover { color: #ffffff; } -#enhancerMenuID, #enhancerMenuID2 { +#enhancerMenuID, #enhancerMenuID2, #ytThumbMenuID { z-index: 9999; } @@ -36,7 +36,7 @@ yt-formatted-string > a:hover { text-align: center; } -#draggable { +#ytDraggable { z-index: 9999; position: fixed; right: 0px; @@ -104,4 +104,4 @@ yt-formatted-string > a:hover { height: 100px; margin: 0em 1em 0em 1em; float: left; -} +} \ No newline at end of file