Skip to content

Commit

Permalink
Move time forward and backward using timeline scale.
Browse files Browse the repository at this point in the history
  • Loading branch information
mrdoob committed Nov 11, 2024
1 parent 7e50f6d commit 6bb4768
Show file tree
Hide file tree
Showing 3 changed files with 29 additions and 4 deletions.
4 changes: 2 additions & 2 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -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();
Expand Down
4 changes: 4 additions & 0 deletions js/Editor.js
Original file line number Diff line number Diff line change
Expand Up @@ -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(),

Expand Down
25 changes: 23 additions & 2 deletions js/Timeline.js
Original file line number Diff line number Diff line change
Expand Up @@ -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 );
Expand Down Expand Up @@ -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 () {
Expand Down

0 comments on commit 6bb4768

Please sign in to comment.