diff --git a/.gitignore b/.gitignore index e43b0f9..46addde 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,4 @@ .DS_Store + +# IntelliJ IDEA +.idea/ diff --git a/README.md b/README.md index 63627db..7552190 100644 --- a/README.md +++ b/README.md @@ -11,7 +11,7 @@ Many viewers report that [accelerated viewing keeps their attention longer](http HTML5 video provides a native API to accelerate playback of any video. The problem is, many players either hide, or limit this functionality. For best results playback speed adjustments should be easy and frequent to match the pace and content being covered: we don't read at a fixed speed, and similarly, we need an easy way to accelerate the video, slow it down, and quickly rewind the last point to listen to it a few more times. -![Player](https://lh5.googleusercontent.com/ubqr74funulW1oj_SEDFQBpj_hE26j3aR5G9wfoAZlo1u029_vM9_tlV_f27AvTVWXcB2Hfy81I=s640) +![Player](https://cloud.githubusercontent.com/assets/2400185/24076745/5723e6ae-0c41-11e7-820c-1d8e814a2888.png) #### *[Install Chrome Extension](https://chrome.google.com/webstore/detail/video-speed-controller/nffaoalbilbmmfgbnbgppjihopabppdk)* diff --git a/inject.css b/inject.css index 34e8aef..d11b58d 100644 --- a/inject.css +++ b/inject.css @@ -24,15 +24,15 @@ /* YouTube embedded player */ /* e.g. https://www.igvita.com/2012/09/12/web-fonts-performance-making-pretty-fast/ */ -.full-frame .html5-video-player:not(.ytp-fullscreen) .vsc-controller { +.html5-video-player:not(.ytp-hide-info-bar) .vsc-controller { position: relative; - top: 45px; + top: 40px; } -.ytp-fullscreen .vsc-controller { - display: block; +/* Netflix player */ +#netflix-player:not(.player-cinema-mode) .vsc-controller { position: relative; - top: 60px; + top: 85px; } /* shift controller on vine.co */ diff --git a/inject.js b/inject.js index feb739d..b425e28 100644 --- a/inject.js +++ b/inject.js @@ -4,6 +4,7 @@ chrome.runtime.sendMessage({}, function(response) { speed: 1.0, // default 1x resetSpeed: 1.0, // default 1x speedStep: 0.1, // default 0.1x + fastSpeed: 1.8, // default 1.8x rewindTime: 10, // default 10s advanceTime: 10, // default 10s resetKeyCode: 82, // default: R @@ -12,6 +13,7 @@ chrome.runtime.sendMessage({}, function(response) { rewindKeyCode: 90, // default: Z advanceKeyCode: 88, // default: X displayKeyCode: 86, // default: V + fastKeyCode: 71, // default: G rememberSpeed: false, // default: false startHidden: false, // default: false blacklist: ` @@ -27,12 +29,14 @@ chrome.runtime.sendMessage({}, function(response) { tc.settings.speed = Number(storage.speed); tc.settings.resetSpeed = Number(storage.resetSpeed); tc.settings.speedStep = Number(storage.speedStep); + tc.settings.fastSpeed = Number(storage.fastSpeed); tc.settings.rewindTime = Number(storage.rewindTime); tc.settings.advanceTime = Number(storage.advanceTime); tc.settings.resetKeyCode = Number(storage.resetKeyCode); tc.settings.rewindKeyCode = Number(storage.rewindKeyCode); tc.settings.slowerKeyCode = Number(storage.slowerKeyCode); tc.settings.fasterKeyCode = Number(storage.fasterKeyCode); + tc.settings.fastKeyCode = Number(storage.fastKeyCode); tc.settings.displayKeyCode = Number(storage.displayKeyCode); tc.settings.advanceKeyCode = Number(storage.advanceKeyCode); tc.settings.rememberSpeed = Boolean(storage.rememberSpeed); @@ -117,6 +121,13 @@ chrome.runtime.sendMessage({}, function(response) { `; shadow.innerHTML = shadowTemplate; + shadow.querySelector('#controller').addEventListener('wheel', (e) => { + runAction(e.wheelDelta > 0 ? 'faster' : 'slower', document); + e.preventDefault(); + e.stopPropagation(); + }); + + shadow.querySelector('.draggable').addEventListener('mousedown', (e) => { runAction(e.target.dataset['action'], document); }); @@ -215,6 +226,8 @@ chrome.runtime.sendMessage({}, function(response) { runAction('reset', document, true) } else if (keyCode == tc.settings.displayKeyCode) { runAction('display', document, true) + } else if (keyCode == tc.settings.fastKeyCode) { + runAction('fast', document, true); } return false; @@ -292,7 +305,7 @@ chrome.runtime.sendMessage({}, function(response) { } else if (action === 'faster') { // Maximum playback speed in Chrome is set to 16: // https://cs.chromium.org/chromium/src/media/blink/webmediaplayer_impl.cc?l=103 - var s = Math.min(v.playbackRate + tc.settings.speedStep, 16); + var s = Math.min( (v.playbackRate < 0.1 ? 0.0 : v.playbackRate) + tc.settings.speedStep, 16); v.playbackRate = Number(s.toFixed(2)); } else if (action === 'slower') { // Audio playback is cut at 0.05: @@ -317,11 +330,17 @@ chrome.runtime.sendMessage({}, function(response) { controller.classList.toggle('vsc-hidden'); } else if (action === 'drag') { handleDrag(v, controller); + } else if (action === 'fast') { + playVideoAtFastSpeed(v); } } }); } + function playVideoAtFastSpeed(video) { + video.playbackRate = tc.settings.fastSpeed; + } + function handleDrag(video, controller) { const parentElement = controller.parentElement, boundRect = parentElement.getBoundingClientRect(), diff --git a/manifest.json b/manifest.json old mode 100755 new mode 100644 index 2700605..856d42f --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "name": "Video Speed Controller", "short_name": "videospeed", - "version": "0.4.4", + "version": "0.4.6", "manifest_version": 2, "description": "Speed up, slow down, advance and rewind any HTML5 video with quick shortcuts.", "homepage_url": "https://github.com/codebicycle/videospeed", @@ -14,10 +14,10 @@ "browser_action": { "browser_style": true, "default_icon": { - "19": "icons/icon19.png", - "38": "icons/icon38.png", - "48": "icons/icon48.png" - }, + "19": "icons/icon19.png", + "38": "icons/icon38.png", + "48": "icons/icon48.png" + }, "default_popup": "popup.html" }, "content_scripts": [{ @@ -27,7 +27,6 @@ "https://plus.google.com/hangouts/*", "https://hangouts.google.com/hangouts/*", "https://teamtreehouse.com/*", - "https://www.lynda.com/*", "http://www.hitbox.tv/*" ], "css": [ "inject.css" ], diff --git a/options.html b/options.html index 0e2ab43..33bc8a5 100644 --- a/options.html +++ b/options.html @@ -32,6 +32,10 @@ +
+ + +
@@ -56,6 +60,10 @@
+
+ + +
diff --git a/options.js b/options.js index 56c5596..590bb01 100644 --- a/options.js +++ b/options.js @@ -3,9 +3,11 @@ var tcDefaults = { speedStep: 0.1, // default 0.1x rewindTime: 10, // default 10s advanceTime: 10, // default 10s + fastSpeed: 1.8, // default 1.8x resetKeyCode: 82, // default: R slowerKeyCode: 83, // default: S fasterKeyCode: 68, // default: D + fastKeyCode: 71, // default: G rewindKeyCode: 90, // default: Z advanceKeyCode: 88, // default: X displayKeyCode: 86, // default: V @@ -92,11 +94,13 @@ function save_options() { var speedStep = document.getElementById('speedStep').value; var rewindTime = document.getElementById('rewindTime').value; var advanceTime = document.getElementById('advanceTime').value; + var fastSpeed = document.getElementById('fastSpeed').value; var resetKeyCode = document.getElementById('resetKeyInput').keyCode; var rewindKeyCode = document.getElementById('rewindKeyInput').keyCode; var advanceKeyCode = document.getElementById('advanceKeyInput').keyCode; var slowerKeyCode = document.getElementById('slowerKeyInput').keyCode; var fasterKeyCode = document.getElementById('fasterKeyInput').keyCode; + var fastKeyCode = document.getElementById('fastKeyInput').keyCode; var displayKeyCode = document.getElementById('displayKeyInput').keyCode; var rememberSpeed = document.getElementById('rememberSpeed').checked; var startHidden = document.getElementById('startHidden').checked; @@ -105,22 +109,26 @@ function save_options() { speedStep = isNaN(speedStep) ? tcDefaults.speedStep : Number(speedStep); rewindTime = isNaN(rewindTime) ? tcDefaults.rewindTime : Number(rewindTime); advanceTime = isNaN(advanceTime) ? tcDefaults.advanceTime : Number(advanceTime); + fastSpeed = isNaN(fastSpeed) ? tcDefaults.fastSpeed : Number(fastSpeed); resetKeyCode = isNaN(resetKeyCode) ? tcDefaults.resetKeyCode : resetKeyCode; rewindKeyCode = isNaN(rewindKeyCode) ? tcDefaults.rewindKeyCode : rewindKeyCode; advanceKeyCode = isNaN(advanceKeyCode) ? tcDefaults.advanceKeyCode : advanceKeyCode; slowerKeyCode = isNaN(slowerKeyCode) ? tcDefaults.slowerKeyCode : slowerKeyCode; fasterKeyCode = isNaN(fasterKeyCode) ? tcDefaults.fasterKeyCode : fasterKeyCode; + fastKeyCode = isNaN(fastKeyCode) ? tcDefaults.fastKeyCode : fastKeyCode; displayKeyCode = isNaN(displayKeyCode) ? tcDefaults.displayKeyCode : displayKeyCode; chrome.storage.local.set({ speedStep: speedStep, rewindTime: rewindTime, advanceTime: advanceTime, + fastSpeed: fastSpeed, resetKeyCode: resetKeyCode, rewindKeyCode: rewindKeyCode, advanceKeyCode: advanceKeyCode, slowerKeyCode: slowerKeyCode, fasterKeyCode: fasterKeyCode, + fastKeyCode: fastKeyCode, displayKeyCode: displayKeyCode, rememberSpeed: rememberSpeed, startHidden: startHidden, @@ -141,11 +149,13 @@ function restore_options() { document.getElementById('speedStep').value = storage.speedStep.toFixed(2); document.getElementById('rewindTime').value = storage.rewindTime; document.getElementById('advanceTime').value = storage.advanceTime; + document.getElementById('fastSpeed').value = storage.fastSpeed; updateShortcutInputText('resetKeyInput', storage.resetKeyCode); updateShortcutInputText('rewindKeyInput', storage.rewindKeyCode); updateShortcutInputText('advanceKeyInput', storage.advanceKeyCode); updateShortcutInputText('slowerKeyInput', storage.slowerKeyCode); updateShortcutInputText('fasterKeyInput', storage.fasterKeyCode); + updateShortcutInputText('fastKeyInput', storage.fastKeyCode); updateShortcutInputText('displayKeyInput', storage.displayKeyCode); document.getElementById('rememberSpeed').checked = storage.rememberSpeed; document.getElementById('startHidden').checked = storage.startHidden; @@ -183,9 +193,11 @@ document.addEventListener('DOMContentLoaded', function () { initShortcutInput('advanceKeyInput'); initShortcutInput('slowerKeyInput'); initShortcutInput('fasterKeyInput'); + initShortcutInput('fastKeyInput'); initShortcutInput('displayKeyInput'); document.getElementById('rewindTime').addEventListener('keypress', inputFilterNumbersOnly); document.getElementById('advanceTime').addEventListener('keypress', inputFilterNumbersOnly); document.getElementById('speedStep').addEventListener('keypress', inputFilterNumbersOnly); + document.getElementById('fastSpeed').addEventListener('keypress', inputFilterNumbersOnly); })