From 7ea778d3ec08d2fc890447d25f2b0af550336602 Mon Sep 17 00:00:00 2001 From: Ilya Grigorik Date: Mon, 26 Jun 2017 18:34:03 +0200 Subject: [PATCH] special-case inject prototype for FB and amazon Some sites inject overlays over their videos to intercept clicks and provide own on-screen controls, etc. Unfortunately this makes the VC controls inaccessible and without any generic workaround... well, short of relying on keyboard shortcuts. This is an experiment for special-casing FB and Amazon - FB we modify stacking context of the parent - Amazon we inject the controller one level higher, above the overlay The gotcha here is that this type of behavior is not uncommon, and special-casing each and every origin like this is not long-term sustainable. If this sticks.. we'll have to be very selective about which sites we enable this for. Closes #210 Closes #134 --- inject.js | 22 ++++++++++++++++++---- 1 file changed, 18 insertions(+), 4 deletions(-) diff --git a/inject.js b/inject.js index 549f86d..8e1a2ab 100644 --- a/inject.js +++ b/inject.js @@ -136,12 +136,26 @@ chrome.extension.sendMessage({}, function(response) { var fragment = document.createDocumentFragment(); fragment.appendChild(wrapper); - // Note: when triggered via a MutationRecord, it's possible that the - // target is not the immediate parent. This appends the controller as - // the first element of the target, which may not be the parent. - this.parent.insertBefore(fragment, this.parent.firstChild); this.video.classList.add('vsc-initialized'); this.video.dataset['vscid'] = this.id; + + switch (location.hostname) { + case 'www.amazon.com': + // insert before parent to bypass overlay + this.parent.parentElement.insertBefore(fragment, this.parent); + break; + + case 'www.facebook.com': + // set stacking context to same as parent's parent. + // + default fallthrough + this.parent.style.zIndex = 'auto'; + + default: + // Note: when triggered via a MutationRecord, it's possible that the + // target is not the immediate parent. This appends the controller as + // the first element of the target, which may not be the parent. + this.parent.insertBefore(fragment, this.parent.firstChild); + } } }