Refactor event handler names - onEvent -> handleEvent

src/js/big-play-button.js

@@ -20,7 +20,7 @@ class BigPlayButton extends Button {
     });
   }
 
-  onClick() {
+  handleClick() {
     this.player_.play();
   }
 

src/js/button.js

@@ -19,10 +19,10 @@ class Button extends Component {
 
     this.emitTapEvents();
 
-    this.on('tap', this.onClick);
-    this.on('click', this.onClick);
-    this.on('focus', this.onFocus);
-    this.on('blur', this.onBlur);
+    this.on('tap', this.handleClick);
+    this.on('click', this.handleClick);
+    this.on('focus', this.handleFocus);
+    this.on('blur', this.handleBlur);
   }
 
   createEl(type, props) {
@@ -59,25 +59,25 @@ class Button extends Component {
   }
 
   // Click - Override with specific functionality for button
-  onClick() {}
+  handleClick() {}
 
   // Focus - Add keyboard functionality to element
-  onFocus() {
-    Events.on(document, 'keydown', Lib.bind(this, this.onKeyPress));
+  handleFocus() {
+    Events.on(document, 'keydown', Lib.bind(this, this.handleKeyPress));
   }
 
   // KeyPress (document level) - Trigger click when keys are pressed
-  onKeyPress(event) {
+  handleKeyPress(event) {
     // Check for space bar (32) or enter (13) keys
     if (event.which == 32 || event.which == 13) {
       event.preventDefault();
-      this.onClick();
+      this.handleClick();
     }
   }
 
   // Blur - Remove keyboard triggers
-  onBlur() {
-    Events.off(document, 'keydown', Lib.bind(this, this.onKeyPress));
+  handleBlur() {
+    Events.off(document, 'keydown', Lib.bind(this, this.handleKeyPress));
   }
 
 }

src/js/control-bar/fullscreen-toggle.js

@@ -13,7 +13,7 @@ class FullscreenToggle extends Button {
     return `vjs-fullscreen-control ${super.buildCSSClass()}`;
   }
 
-  onClick() {
+  handleClick() {
     if (!this.player_.isFullscreen()) {
       this.player_.requestFullscreen();
       this.controlText_.innerHTML = this.localize('Non-Fullscreen');

src/js/control-bar/mute-toggle.js

@@ -41,7 +41,7 @@ class MuteToggle extends Button {
     return `vjs-mute-control ${super.buildCSSClass()}`;
   }
 
-  onClick() {
+  handleClick() {
     this.player_.muted( this.player_.muted() ? false : true );
   }
 

src/js/control-bar/play-toggle.js

@@ -13,32 +13,32 @@ class PlayToggle extends Button {
   constructor(player, options){
     super(player, options);
 
-    this.on(player, 'play', this.onPlay);
-    this.on(player, 'pause', this.onPause);
+    this.on(player, 'play', this.handlePlay);
+    this.on(player, 'pause', this.handlePause);
   }
 
   buildCSSClass() {
     return `vjs-play-control ${super.buildCSSClass()}`;
   }
 
-  // OnClick - Toggle between play and pause
-  onClick() {
+  // handleClick - Toggle between play and pause
+  handleClick() {
     if (this.player_.paused()) {
       this.player_.play();
     } else {
       this.player_.pause();
     }
   }
 
-  // OnPlay - Add the vjs-playing class to the element so it can change appearance
-  onPlay() {
+  // handlePlay - Add the vjs-playing class to the element so it can change appearance
+  handlePlay() {
     this.removeClass('vjs-paused');
     this.addClass('vjs-playing');
     this.el_.children[0].children[0].innerHTML = this.localize('Pause'); // change the button text to "Pause"
   }
 
-  // OnPause - Add the vjs-paused class to the element so it can change appearance
-  onPause() {
+  // handlePause - Add the vjs-paused class to the element so it can change appearance
+  handlePause() {
     this.removeClass('vjs-playing');
     this.addClass('vjs-paused');
     this.el_.children[0].children[0].innerHTML = this.localize('Play'); // change the button text to "Play"

src/js/control-bar/playback-rate-menu/playback-rate-menu-button.js

@@ -56,7 +56,7 @@ class PlaybackRateMenuButton extends MenuButton {
     this.el().setAttribute('aria-valuenow', this.player().playbackRate());
   }
 
-  onClick() {
+  handleClick() {
     // select next rate option
     let currentRate = this.player().playbackRate();
     let rates = this.player().options()['playbackRates'];

src/js/control-bar/playback-rate-menu/playback-rate-menu-item.js

@@ -22,8 +22,8 @@ class PlaybackRateMenuItem extends MenuItem {
     this.on(player, 'ratechange', this.update);
   }
 
-  onClick() {
-    super.onClick();
+  handleClick() {
+    super.handleClick();
     this.player().playbackRate(this.rate);
   }
 
@@ -36,4 +36,4 @@ class PlaybackRateMenuItem extends MenuItem {
 PlaybackRateMenuItem.prototype.contentElType = 'button';
 
 MenuItem.registerComponent('PlaybackRateMenuItem', PlaybackRateMenuItem);
-export default PlaybackRateMenuItem;
+export default PlaybackRateMenuItem;

src/js/control-bar/progress-control/seek-bar.js

@@ -37,16 +37,16 @@ class SeekBar extends Slider {
     return this.player_.currentTime() / this.player_.duration();
   }
 
-  onMouseDown(event) {
-    super.onMouseDown(event);
+  handleMouseDown(event) {
+    super.handleMouseDown(event);
 
     this.player_.scrubbing(true);
 
     this.videoWasPlaying = !this.player_.paused();
     this.player_.pause();
   }
 
-  onMouseMove(event) {
+  handleMouseMove(event) {
     let newTime = this.calculateDistance(event) * this.player_.duration();
 
     // Don't let video end while scrubbing.
@@ -56,8 +56,8 @@ class SeekBar extends Slider {
     this.player_.currentTime(newTime);
   }
 
-  onMouseUp(event) {
-    super.onMouseUp(event);
+  handleMouseUp(event) {
+    super.handleMouseUp(event);
 
     this.player_.scrubbing(false);
     if (this.videoWasPlaying) {

src/js/control-bar/text-track-controls/caption-settings-menu-item.js

@@ -15,11 +15,11 @@ class CaptionSettingsMenuItem extends TextTrackMenuItem {
     this.addClass('vjs-texttrack-settings');
   }
 
-  onClick() {
+  handleClick() {
     this.player().getChild('textTrackSettings').show();
   }
 
 }
 
 TextTrackMenuItem.registerComponent('CaptionSettingsMenuItem', CaptionSettingsMenuItem);
-export default CaptionSettingsMenuItem;
+export default CaptionSettingsMenuItem;

src/js/control-bar/text-track-controls/chapters-track-menu-item.js

@@ -21,8 +21,8 @@ class ChaptersTrackMenuItem extends MenuItem {
     track.addEventListener('cuechange', Lib.bind(this, this.update));
   }
 
-  onClick() {
-    super.onClick();
+  handleClick() {
+    super.handleClick();
     this.player_.currentTime(this.cue.startTime);
     this.update(this.cue.startTime);
   }

src/js/control-bar/text-track-controls/text-track-menu-item.js

@@ -58,11 +58,11 @@ class TextTrackMenuItem extends MenuItem {
     }
   }
 
-  onClick(event) {
+  handleClick(event) {
     let kind = this.track['kind'];
     let tracks = this.player_.textTracks();
 
-    super.onClick(event);
+    super.handleClick(event);
 
     if (!tracks) return;
 
@@ -88,4 +88,4 @@ class TextTrackMenuItem extends MenuItem {
 }
 
 MenuItem.registerComponent('TextTrackMenuItem', TextTrackMenuItem);
-export default TextTrackMenuItem;
+export default TextTrackMenuItem;

src/js/control-bar/volume-control/volume-bar.js

@@ -27,7 +27,7 @@ class VolumeBar extends Slider {
     });
   }
 
-  onMouseMove(event) {
+  handleMouseMove(event) {
     if (this.player_.muted()) {
       this.player_.muted(false);
     }

src/js/control-bar/volume-menu-button.js

@@ -52,9 +52,9 @@ class VolumeMenuButton extends MenuButton {
     return menu;
   }
 
-  onClick() {
-    MuteToggle.prototype.onClick.call(this);
-    super.onClick();
+  handleClick() {
+    MuteToggle.prototype.handleClick.call(this);
+    super.handleClick();
   }
 
   createEl() {

src/js/menu/menu-button.js

@@ -15,7 +15,7 @@ class MenuButton extends Button {
 
     this.update();
 
-    this.on('keydown', this.onKeyPress);
+    this.on('keydown', this.handleKeyPress);
     this.el_.setAttribute('aria-haspopup', true);
     this.el_.setAttribute('role', 'button');
   }
@@ -82,12 +82,12 @@ class MenuButton extends Button {
   // This function is not needed anymore. Instead, the keyboard functionality is handled by
   // treating the button as triggering a submenu. When the button is pressed, the submenu
   // appears. Pressing the button again makes the submenu disappear.
-  onFocus() {}
+  handleFocus() {}
 
   // Can't turn off list display that we turned on with focus, because list would go away.
-  onBlur() {}
+  handleBlur() {}
 
-  onClick() {
+  handleClick() {
     // When you click the button it adds focus, which will show the menu indefinitely.
     // So we'll remove focus when the mouse leaves the button.
     // Focus is needed for tab navigation.
@@ -102,7 +102,7 @@ class MenuButton extends Button {
     }
   }
 
-  onKeyPress(event) {
+  handleKeyPress(event) {
 
     // Check for space bar (32) or enter (13) keys
     if (event.which == 32 || event.which == 13) {

src/js/menu/menu-item.js

@@ -27,7 +27,7 @@ class MenuItem extends Button {
   /**
    * Handle a click on the menu item, and set it to selected
    */
-  onClick() {
+  handleClick() {
     this.selected(true);
   }