play pause html5 video javascript

У меня есть функция, которая воспроизводит видео, когда я нажимаю на изображение постера, отображаемое в проигрывателе, и, похоже, оно работает:

var video = document.getElementById('player');
video.addEventListener('click',function(){
    video().play();
},false);

В теге видео html5 у меня есть что-то вроде :id="игрок" onclick="this.play ();"

проблема в том, что если я нажимаю паузу на элементах управления видео, на самом деле происходит пауза, что хорошо, но затем, если я нажимаю то, что сейчас является кнопкой воспроизведения на элементах управления видео, я вижу, как кнопка снова меняется на паузу на долю секунды затем он снова становится кнопкой воспроизведения.Поэтому я нажимаю кнопку воспроизведения, и он воспроизводится только несколько кадров, а затем возвращается на паузу. Единственный способ заставить его воспроизводиться снова — нажать на область просмотра видео.

Как остановить возврат к паузе при использовании кнопки воспроизведения/паузы на панели управления и как сделать паузу при нажатии на область просмотра видео?

Я пробовал следующее, но это не работает.:

var video = document.getElementById('player');
video.addEventListener('click',function(){
    if(video.paused){
        video().play();
    }else{
        video.pause();
    }
},false);

Причина, по которой я хочу, чтобы видео воспроизводилось при нажатии на фактическую область просмотра, заключается в том, что слишком сложно найти крошечную кнопку воспроизведения на панели управления на Android, потому что она такой маленький, что людям было бы проще просто нажать на область просмотра, чтобы запустить его. В Firefox видеоплеер воспроизводится, когда я нажимаю на область просмотра, а также приостанавливается, что именно то, что я хочу, и он также делает это без необходимости использования javascript. В Android видео вообще не воспроизводится, когда я нажимаю на область просмотра. Поэтому я в основном пытаюсь заставить браузер Android вести себя так, как Firefox изначально.