Be able to override click to pause/play

[yangningBU]

Issue description

• version #0.10.4
• browser: Chrome-64.0.3282.186

Steps to reproduce issue

• use any <Player> and click on it - it will pause

Expected behaviour

It would be nice to able to add a prop to disable this if necessary like
<Player disablePauseOnClick={true}/>

Actual behaviour

All videos pause on click even if you add an onClick event to the Player component.
I've been able to have the video continue playing by wrapping the play() method in a timeout call on a parent element around Player but this still shows the pause animation:

Hack:

overrideClick() {
  setTimeout(() => this.player.play(), 0);
}

render () {
  <div onClick={() => this.overrideClick()}>
    <Player ref={(player) => this.player = player} controls={false} muted={true}>...
  </div>
}

[JimLiu]

I'll add options for Shortcuts

[yangningBU]

@JimLiu thanks for offering to support the feature! You have a timeline in mind?

[JimLiu]

Added a new property for Shortcut component

import React from 'react';
import { Player, Shortcut } from 'video-react';

export default function MyPlayer() {
  return (
    <Player
      playsInline
      poster="/static/poster.png"
      src="https://media.w3.org/2010/05/sintel/trailer_hd.mp4"
    >
      <Shortcut clickable={false} />
    </Player>
  );
}

[iDVB]

Thanks @JimLiu but I think double-click was missed in here.
You can see that double-clicking still pops the video into fullscreen.
https://codesandbox.io/s/video-react-still-dbl-clicks-27gu0h

Compared to VideoJS ... completely zero user-interaction, which is what I would expect.
https://codesandbox.io/p/sandbox/videojs-nextjs-so6np0?file=%2Fcomponents%2FVideoJS%2FVideoJS.jsx

Also looks like even with the clicking disabled, keyboard shortcuts are still enabled by default without an easy way to disable them all.