I would like to fire an event on ctrl+click of the video and NOT have it toggle play/pause

[codysechelski]

I am trying to work on a feature that will reset the playback rate on a ctrl+click.

I have tried a couple of approaches but it seems that no matter what I do, I cannot seem to fire a click event and prevent the play/pause toggle from firing when the ctrl key is pressed.

Testing

First Attempt - adding an event handler in JS

https://codepen.io/codysechelski/pen/KKqGdGE?editors=1111
As you can see from the output of the console, the play/pause action is firing first. I know this because I am outputting .paused() in my event handler, and while the video is playing, my click event prints true. This means that the video was paused prior to hitting my event handler.

So I don't think it's possible to use this approach.

Second Attempt - adding an inline onlick event

https://codepen.io/codysechelski/pen/JjJmYBX?editors=1111
Using the same logic as above, the console does print false, which indicates that my custom onclick logic is firing before the play/pause action. However preventDefault() and/or stopPropagation() don't seem to stop the event from bubbling.

Hopefully, this is possible and there is an easy solution for this that I am just not getting. Does anyone have any thoughts on this?

Here is a hack that I came up with where I check to see if the ctrl key was pressed and the video was paused, then play it again. But surely there's a better way to do this.
https://codepen.io/codysechelski/pen/vYZVLpa?editors=1111

[mister-ben]

You could disable the click handler on the tech with player.tech(true).off('click'). You'd need to play/pause the video when ctrl is not pressed in your event handler to restore the functionality.
As an aside you probably want to check event.metaKey too for the Mac cmd key. ctrl+click on Mac is a right click.

[gkatsev]

In video.js 7.17, we have a new click userAction that can be used to disable this default behavior or event have your own behavior occur without setting a custom handler.
See #7495 for the PR it was implemented in and https://docs.videojs.com/tutorial-options.html#useractions.click for the documentation.

[codysechelski]

Cool. Thanks, @mister-ben! That was super helpful. If possible, would you mind looking over my solution at https://codepen.io/codysechelski/pen/KKqGdGE and let me know if I am missing anything? I'm afraid that I might inadvertently be removing functionality that's not immediately apparent disabling the out-of-the-box click handler.