Add advance capability; Allow Changes when paused

README.md

@@ -15,11 +15,12 @@ HTML5 video provides a native API to accelerate playback of any video. The probl
 
 #### *[Install Chrome Extension](https://chrome.google.com/webstore/detail/video-speed-controller/nffaoalbilbmmfgbnbgppjihopabppdk)*
 
-Once the extension is installed simply navigate to any page that offers HTML5 video ([example](http://www.youtube.com/watch?v=E9FxNzv1Tr8)), and you'll see a speed indicator in top left corner. Hover over the indicator to reveal the controls to accelerate, slowdown, and quickly rewind the video. Or, even better, simply use your keyboard:
+Once the extension is installed simply navigate to any page that offers HTML5 video ([example](http://www.youtube.com/watch?v=E9FxNzv1Tr8)), and you'll see a speed indicator in top left corner. Hover over the indicator to reveal the controls to accelerate, slowdown, and quickly rewind or advance the video. Or, even better, simply use your keyboard:
 
 * **a** - rewind video 10 seconds.
 * **s** - decrease playback speed.
 * **d** - increase playback speed.
+* **t** - advance video 10 seconds.
 
 Note that you can customize these shortcuts in the extension settings page. Also, a few tips for enabling and forcing HTML5 video:
 

inject.js

@@ -5,10 +5,12 @@ chrome.extension.sendMessage({}, function(response) {
       speed: 1.0,          // default 1x
       speedStep: 0.1,      // default 0.1x
       rewindTime: 10,      // default 10s
+      advanceTime: 10,     // default 10s
       resetKeyCode:  82,   // default: R
       rewindKeyCode: 65,   // default: A
       slowerKeyCode: 83,   // default: S
       fasterKeyCode: 68,   // default: D
+      advanceKeyCode: 84,  // default: T
       rememberSpeed: false // default: false
     }
   };
@@ -18,10 +20,12 @@ chrome.extension.sendMessage({}, function(response) {
       tc.settings.speed = Number(storage.speed);
       tc.settings.speedStep = Number(storage.speedStep);
       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.advanceKeyCode = Number(storage.advanceKeyCode);
       tc.settings.rememberSpeed = Boolean(storage.rememberSpeed);
 
       readyStateCheckInterval = setInterval(initializeVideoSpeed, 10);
@@ -73,17 +77,20 @@ chrome.extension.sendMessage({}, function(response) {
         var fasterButton = document.createElement('button');
         var slowerButton = document.createElement('button');
         var rewindButton = document.createElement('button');
+        var advanceButton = document.createElement('button');
         var hideButton = document.createElement('button');
 
         rewindButton.innerHTML = '«';
         fasterButton.textContent = '+';
         slowerButton.textContent = '-';
+        advanceButton.innerHTML = '»';
         hideButton.textContent = 'x';
         hideButton.className = 'tc-hideButton';
 
         controls.appendChild(rewindButton);
         controls.appendChild(slowerButton);
         controls.appendChild(fasterButton);
+        controls.appendChild(advanceButton);
         controls.appendChild(hideButton);
 
         container.appendChild(speedIndicator);
@@ -106,6 +113,8 @@ chrome.extension.sendMessage({}, function(response) {
             runAction('faster')
           } else if (e.target === rewindButton) {
             runAction('rewind')
+          } else if (e.target === advanceButton) {
+            runAction('advance')
           } else if (e.target === hideButton) {
             container.nextSibling.classList.add('vc-cancelled')
             container.remove();
@@ -137,9 +146,11 @@ chrome.extension.sendMessage({}, function(response) {
         videoTags.forEach = Array.prototype.forEach;
 
         videoTags.forEach(function(v) {
-          if (!v.paused && !v.classList.contains('vc-cancelled')) {
+          if (!v.classList.contains('vc-cancelled')) {
             if (action === 'rewind') {
               v.currentTime -= tc.settings.rewindTime;
+            } else if (action === 'advance') {
+              v.currentTime += tc.settings.advanceTime;
             } else if (action === 'faster') {
               // Maxium playback speed in Chrome is set to 16:
               // https://code.google.com/p/chromium/codesearch#chromium/src/media/blink/webmediaplayer_impl.cc&l=64
@@ -168,6 +179,8 @@ chrome.extension.sendMessage({}, function(response) {
 
         if (keyCode == tc.settings.rewindKeyCode) {
           runAction('rewind')
+        } else if (keyCode == tc.settings.advanceKeyCode) {
+          runAction('advance')
         } else if (keyCode == tc.settings.fasterKeyCode) {
           runAction('faster')
         } else if (keyCode == tc.settings.slowerKeyCode) {

manifest.json

@@ -3,7 +3,7 @@
   "short_name": "videospeed",
   "version": "0.2.5",
   "manifest_version": 2,
-  "description": "Speed up, slow down, and rewind any HTML5 video with quick shortcuts.",
+  "description": "Speed up, slow down, advance and rewind any HTML5 video with quick shortcuts.",
   "homepage_url": "https://github.com/igrigorik/videospeed",
   "icons": {
     "16": "icons/icon16.png",

options.html

@@ -16,6 +16,10 @@
         <label for="rewindKeyInput">Rewind</label>
         <input id="rewindKeyInput" placeholder="press a key" type="text" value=""/>
       </div>
+      <div class="row">
+        <label for="advanceKeyInput">Advance</label>
+        <input id="advanceKeyInput" placeholder="press a key" type="text" value=""/>
+      </div>
       <div class="row">
         <label for="resetKeyInput">Reset speed</label>
         <input id="resetKeyInput" placeholder="press a key" type="text" value=""/>
@@ -35,6 +39,10 @@
   		<div class="row">
           <label for="rewindTime">Rewind Time (s)</label>
           <input id="rewindTime" type="text" value=""/>
+      </div>
+  	<div class="row">
+          <label for="advanceTime">Advance Time (s)</label>
+          <input id="advanceTime" type="text" value=""/>
       </div>
       <div class="row">
           <label for="speedStep">Speed Change Step</label>

options.js

@@ -1,10 +1,12 @@
 var tcDefaults = {
   speedStep: 0.1,
   rewindTime: 10,
+  advanceTime: 10,
   resetKeyCode: 82,
   rewindKeyCode: 65,
   slowerKeyCode: 83,
   fasterKeyCode: 68,
+  advanceKeyCode: 84,
   rememberSpeed: false
 };
 
@@ -43,24 +45,30 @@ function save_options() {
 
   var speedStep     = document.getElementById('speedStep').value;
   var rewindTime    = document.getElementById('rewindTime').value;
+  var advanceTime   = document.getElementById('advanceTime').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 rememberSpeed = document.getElementById('rememberSpeed').checked;
 
   speedStep     = isNaN(speedStep) ? tcDefaults.speedStep : Number(speedStep);
   rewindTime    = isNaN(rewindTime) ? tcDefaults.rewindTime : Number(rewindTime);
+  advanceTime   = isNaN(advanceTime) ? tcDefaults.advanceTime : Number(advanceTime);
   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;
 
   chrome.storage.sync.set({
     speedStep:      speedStep,
     rewindTime:     rewindTime,
+    advanceTime:    advanceTime,
     resetKeyCode:   resetKeyCode,
     rewindKeyCode:  rewindKeyCode,
+    advanceKeyCode: advanceKeyCode,
     slowerKeyCode:  slowerKeyCode,
     fasterKeyCode:  fasterKeyCode,
     rememberSpeed:  rememberSpeed
@@ -79,8 +87,10 @@ function restore_options() {
   chrome.storage.sync.get(tcDefaults, function(storage) {
     document.getElementById('speedStep').value = storage.speedStep.toFixed(2);
     document.getElementById('rewindTime').value = storage.rewindTime;
+    document.getElementById('advanceTime').value = storage.advanceTime;
     updateShortcutInputText('resetKeyInput',  storage.resetKeyCode);
     updateShortcutInputText('rewindKeyInput', storage.rewindKeyCode);
+    updateShortcutInputText('advanceKeyInput', storage.advanceKeyCode);
     updateShortcutInputText('slowerKeyInput', storage.slowerKeyCode);
     updateShortcutInputText('fasterKeyInput', storage.fasterKeyCode);
     document.getElementById('rememberSpeed').checked = storage.rememberSpeed;
@@ -113,9 +123,11 @@ document.addEventListener('DOMContentLoaded', function () {
 
   initShortcutInput('resetKeyInput');
   initShortcutInput('rewindKeyInput');
+  initShortcutInput('advanceKeyInput');
   initShortcutInput('slowerKeyInput');
   initShortcutInput('fasterKeyInput');
 
   document.getElementById('rewindTime').addEventListener('keypress', inputFilterNumbersOnly);
+  document.getElementById('advanceTime').addEventListener('keypress', inputFilterNumbersOnly);
   document.getElementById('speedStep').addEventListener('keypress', inputFilterNumbersOnly);
 })