Move time forward and backward using timeline scale.

Author: mrdoob

index.html

@@ -125,11 +125,11 @@
 						break;
 					case 37:
 						event.preventDefault();
-						editor.setTime( editor.player.currentTime - editor.player.playbackRate );
+						editor.signals.timeBackward.dispatch();
 						break;
 					case 39:
 						event.preventDefault();
-						editor.setTime( editor.player.currentTime + editor.player.playbackRate );
+						editor.signals.timeForward.dispatch();
 						break;
 					case 38:
 						event.preventDefault();

js/Editor.js

@@ -56,7 +56,11 @@ function Editor() {
 
 		playingChanged: new Signal(),
 		playbackRateChanged: new Signal(),
+
+		timeForward: new Signal(),
+		timeBackward: new Signal(),
 		timeChanged: new Signal(),
+
 		timelineScaled: new Signal(),
 		windowResized: new Signal(),
 

js/Timeline.js

@@ -39,14 +39,14 @@ function Timeline( editor ) {
 			const mouseX = event.clientX - rect.left;
 
 			// Calculate the time at the mouse position
-			const mouseTime = (scroller.scrollLeft + mouseX) / scale;
+			const mouseTime = ( scroller.scrollLeft + mouseX ) / scale;
 
 			// Update scale
 			scale = Math.max( 2, scale - ( event.deltaY / 10 ) );
 			signals.timelineScaled.dispatch( scale );
 
 			// Adjust scroll to keep the time under mouse position
-			scroller.scrollLeft = (mouseTime * scale) - mouseX;
+			scroller.scrollLeft = ( mouseTime * scale ) - mouseX;
 		}
 	} );
 	container.add( timeline );
@@ -260,17 +260,38 @@ function Timeline( editor ) {
 
 	} );
 
+	signals.timeBackward.add( function () {
+
+		const player = editor.player;
+		const time = player.currentTime - ( 32 / scale );
+
+		editor.setTime( time );
+
+	} );
+
+	signals.timeForward.add( function () {
+
+		const player = editor.player;
+		const time = player.currentTime + ( 32 / scale );
+
+		editor.setTime( time );
+
+	} );
+
 	signals.timeChanged.add( function () {
 
 		updateTimeMark();
 
 	} );
 
 	signals.timelineScaled.add( function ( value ) {
+
 		scale = value;
+
 		updateMarks();
 		updateTimeMark();
 		updateContainers();
+
 	} );
 
 	signals.windowResized.add( function () {