Skip to content

Commit

Permalink
refactor: move seekbar event handler bindings into a function (#5097)
Browse files Browse the repository at this point in the history
Makes it easier to extend the seekbar and change the default event handlers. If you extend the seekbar component you can choose to override setEventHandlers_ or keep it default. If you do override setEventHandlers_ and call super() in the constructor, you get your own event handlers + the functionality provided by Slider.
  • Loading branch information
guided1 authored and gkatsev committed Apr 20, 2018
1 parent dd45dc0 commit 7c3213c
Showing 1 changed file with 13 additions and 5 deletions.
18 changes: 13 additions & 5 deletions src/js/control-bar/progress-control/seek-bar.js
Expand Up @@ -38,17 +38,25 @@ class SeekBar extends Slider {
*/
constructor(player, options) {
super(player, options);
this.setEventHandlers_();
}

/**
* Sets the event handlers
*
* @private
*/
setEventHandlers_() {
this.update = Fn.throttle(Fn.bind(this, this.update), UPDATE_REFRESH_INTERVAL);

this.on(player, 'timeupdate', this.update);
this.on(player, 'ended', this.handleEnded);
this.on(this.player_, 'timeupdate', this.update);
this.on(this.player_, 'ended', this.handleEnded);

// when playing, let's ensure we smoothly update the play progress bar
// via an interval
this.updateInterval = null;

this.on(player, ['playing'], () => {
this.on(this.player_, ['playing'], () => {
this.clearInterval(this.updateInterval);

this.updateInterval = this.setInterval(() =>{
Expand All @@ -58,11 +66,11 @@ class SeekBar extends Slider {
}, UPDATE_REFRESH_INTERVAL);
});

this.on(player, ['ended', 'pause', 'waiting'], () => {
this.on(this.player_, ['ended', 'pause', 'waiting'], () => {
this.clearInterval(this.updateInterval);
});

this.on(player, ['timeupdate', 'ended'], this.update);
this.on(this.player_, ['timeupdate', 'ended'], this.update);
}

/**
Expand Down

0 comments on commit 7c3213c

Please sign in to comment.