diff options
| author | Ajay Ramachandran <[email protected]> | 2020-12-24 12:32:34 -0500 |
|---|---|---|
| committer | GitHub <[email protected]> | 2020-12-24 12:32:34 -0500 |
| commit | bd12ccb6f447c60fe728b6e44cf292ff1ab1dad7 (patch) | |
| tree | 1c73e9304661fea8c47aca27f210f45b23c3f3f8 | |
| parent | d81229a157d579ea7975c2da3371d3f62f51bd92 (diff) | |
| parent | 54c36e65ef154bc9c7fd44b98bc907da2988b589 (diff) | |
| download | SponsorBlock-bd12ccb6f447c60fe728b6e44cf292ff1ab1dad7.tar.gz SponsorBlock-bd12ccb6f447c60fe728b6e44cf292ff1ab1dad7.zip | |
Merge pull request #589 from ajayyy/fix-mobile
Fix mobile support
| -rw-r--r-- | public/popup.css | 12 | ||||
| -rw-r--r-- | public/popup.html | 4 | ||||
| -rw-r--r-- | src/content.ts | 33 |
3 files changed, 29 insertions, 20 deletions
diff --git a/public/popup.css b/public/popup.css index dcad93b0..2aa096a6 100644 --- a/public/popup.css +++ b/public/popup.css @@ -10,6 +10,18 @@ display: none !important; } +@media only screen and (max-width: 600px) { + #sponsorBlockPopupBody { + width: 100%; + } +} + +#sponsorBlockPopupBody { + margin: auto; + width: 374px; + background: var(--sb-main-bg-color); +} + #sponsorblockPopup { color: var(--sb-main-fg-color); font-family: 'Source Sans Pro', sans-serif; diff --git a/public/popup.html b/public/popup.html index 33119900..1b472959 100644 --- a/public/popup.html +++ b/public/popup.html @@ -2,9 +2,11 @@ <title>__MSG_openPopup__</title> <link id="sponsorBlockPopupFont" rel="stylesheet" type="text/css" href="/libs/Source+Sans+Pro.css"> <link id="sponsorBlockStyleSheet" rel="stylesheet" type="text/css" href="popup.css"> + + <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> -<body style="margin: auto; width: 374px; background: var(--sb-main-bg-color);"> +<body id="sponsorBlockPopupBody"> <div id="sponsorblockPopup" class="sponsorBlockPageBody preload"> <div class="logoText bottomSpace"> <img src="icons/IconSponsorBlocker256px.png" height="40px" id="sponsorBlockPopupLogo"> diff --git a/src/content.ts b/src/content.ts index 1e3ba42c..91295952 100644 --- a/src/content.ts +++ b/src/content.ts @@ -293,12 +293,18 @@ async function videoIDChange(id) { if (onMobileYouTube) { // Mobile YouTube workaround const observer = new MutationObserver(handleMobileControlsMutations); - - observer.observe(document.getElementById("player-control-container"), { - attributes: true, - childList: true, - subtree: true - }); + let controlsContainer = null; + + utils.wait(() => { + controlsContainer = document.getElementById("player-control-container") + return controlsContainer !== null + }).then(() => { + observer.observe(document.getElementById("player-control-container"), { + attributes: true, + childList: true, + subtree: true + }); + }).catch(); } else { utils.wait(getControls).then(createPreviewBar); } @@ -354,18 +360,6 @@ async function videoIDChange(id) { function handleMobileControlsMutations(): void { const mobileYouTubeSelector = ".progress-bar-background"; - updateVisibilityOfPlayerControlsButton().then((createdButtons) => { - if (createdButtons) { - if (sponsorTimesSubmitting != null && sponsorTimesSubmitting.length > 0 && sponsorTimesSubmitting[sponsorTimesSubmitting.length - 1].segment.length >= 2) { - changeStartSponsorButton(true, true); - } else if (sponsorTimesSubmitting != null && sponsorTimesSubmitting.length > 0 && sponsorTimesSubmitting[sponsorTimesSubmitting.length - 1].segment.length < 2) { - changeStartSponsorButton(false, true); - } else { - changeStartSponsorButton(true, false); - } - } - }); - if (previewBar !== null) { if (document.body.contains(previewBar.container)) { updatePreviewBarPositionMobile(document.getElementsByClassName(mobileYouTubeSelector)[0] as HTMLElement); @@ -1133,6 +1127,7 @@ async function updateVisibilityOfPlayerControlsButton(): Promise<boolean> { if (!sponsorVideoID) return false; const createdButtons = await createButtons(); + if (!createdButtons) return; if (Config.config.hideVideoPlayerControls || onInvidious) { document.getElementById("startSponsorButton").style.display = "none"; @@ -1226,7 +1221,7 @@ function updateSponsorTimesSubmitting(getFromConfig = true) { } async function changeStartSponsorButton(showStartSponsor: boolean, uploadButtonVisible: boolean): Promise<boolean> { - if(!sponsorVideoID) return false; + if(!sponsorVideoID || onMobileYouTube) return false; //if it isn't visible, there is no data const shouldHide = (uploadButtonVisible && !(Config.config.hideDeleteButtonPlayerControls || onInvidious)) ? "unset" : "none" |