diff options
author | Teddy Wing | 2020-05-05 21:03:34 +0200 |
---|---|---|
committer | Teddy Wing | 2020-05-05 22:37:52 +0200 |
commit | 0ff130243082c5a509ca1795692c22adc9e194da (patch) | |
tree | f20f87860bace7ff88fded4130c22a74d0297f11 | |
parent | ad62baaf033b7a77192ccad343b1926537b69024 (diff) | |
download | netflix-immersive-0ff130243082c5a509ca1795692c22adc9e194da.tar.bz2 |
Move content script to TypeScript
I'd like to split up some functionality into modules, and it seems like
using TypeScript would be a good way to achieve that.
-rw-r--r-- | package-lock.json | 14 | ||||
-rw-r--r-- | package.json | 8 | ||||
-rw-r--r-- | src/index.ts | 86 | ||||
-rw-r--r-- | tsconfig.json | 11 |
4 files changed, 119 insertions, 0 deletions
diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..5b28fad --- /dev/null +++ b/package-lock.json @@ -0,0 +1,14 @@ +{ + "name": "netflix-no-skip", + "version": "0.0.1", + "lockfileVersion": 1, + "requires": true, + "dependencies": { + "typescript": { + "version": "3.8.3", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.8.3.tgz", + "integrity": "sha512-MYlEfn5VrLNsgudQTVJeNaQFUAI7DkhnOjdpAp4T+ku1TfQClewlbSuTVHiA+8skNBgaf02TL/kLOvig4y3G8w==", + "dev": true + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..96c43bd --- /dev/null +++ b/package.json @@ -0,0 +1,8 @@ +{ + "name": "netflix-no-skip", + "version": "0.0.1", + "devDependencies": { + "typescript": "^3.8.3" + }, + "private": true +} diff --git a/src/index.ts b/src/index.ts new file mode 100644 index 0000000..b8fcf0f --- /dev/null +++ b/src/index.ts @@ -0,0 +1,86 @@ +function with_player (callback) { + var interval = setInterval( + function() { + var player = document.querySelector('.NFPlayer.nf-player-container'); + + if (player) { + clearInterval(interval); + + callback(player); + } + }, + 1000 + ); +} + +function init_mutation_observer (player) { + var observer = new MutationObserver(function(mutation_list) { + for (var i = 0; i < mutation_list.length; i++) { + var mutation = mutation_list[i]; + var player = mutation.target as HTMLElement; + + if (player.classList.contains('postplay')) { + player.classList.remove('postplay'); + + // Activate player controls. + player.click(); + + // TODO: Change .active to .inactive + // mutation.target.classList.replace('active', 'inactive'); // Didn't work + // Remove .can-resume: Removes white border on hover + // PlayerControlsNeo__bottom-controls PlayerControlsNeo__bottom-controls--faded + // PlayerControlsNeo__layout PlayerControlsNeo__layout--active + // PlayerControlsNeo__layout PlayerControlsNeo__layout--inactive + + // document.querySelector('.PlayerControlsNeo__bottom-controls') + // .classList + // .add('PlayerControlsNeo__bottom-controls--faded'); + + document.querySelector('.PlayerControlsNeo__layout.PlayerControlsNeo__layout--active') + .classList + .replace( + 'PlayerControlsNeo__layout--active', + 'PlayerControlsNeo__layout--inactive' + ); + + // .OriginalsPostPlay-BackgroundTrailer .BackToBrowse + + return; + } + } + }); + + observer.observe( + player, + { + attributeFilter: ['class'], + attributeOldValue: true + } + ); +} + +function styles () { + var style = document.createElement('style'); + var stylesheet = style.sheet as CSSStyleSheet; + + document.head.appendChild(style); + + stylesheet.insertRule( + '.OriginalsPostPlay-BackgroundTrailer .BackToBrowse { visibility: hidden; }', + stylesheet.cssRules.length + ); + + stylesheet.insertRule( + '.player-view-childrens { visibility: hidden; }', + stylesheet.cssRules.length + ); +} + + +with_player(function(player) { + // window.player = player; + + init_mutation_observer(player); +}); + +styles(); diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..6a89f54 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,11 @@ +{ + "compilerOptions": { + "module": "amd", + "target": "ES5", + "outFile": "./dist/netflix-no-skip.user.js", + "sourceMap": true + }, + "files": [ + "src/index.ts" + ] +} |