Функция Javascript для условного перемещения воспроизведения видео запускается дважды

Question

Я пишу некоторый JavaScript, чтобы переместить точку воспроизведения видео.Видео состоит из серии разделов, которые воспроизводятся, а затем останавливаются.Ряд кнопок отправляет точку воспроизведения в определенный раздел.

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

Пример:

• Воспроизведение приостановлено на 7 секунд,конец раздела - 10 секунд.

• Пользователь нажимает кнопку 3, чтобы перейти к отметке 30 секунд.

• Текущий раздел должен закончиться, сыграв до 10 секунд.

• Как только текущий раздел закончен, , а затем точка воспроизведения может перейти к отметке 30 секунд.

Вот та загвоздка, в которую я попадаю: при вызове с помощью onClick () каждая функция кнопки запускается дважды.При первом запуске оператор if всегда собирается в другое.

var vid=document.getElementById("neufVideo");

Object.defineProperty(HTMLMediaElement.prototype, 'playing', {
    get: function(){
        return !!(this.currentTime > 0 && !this.paused && !this.ended && this.readyState > 2);
    }
});

function playPause() {
    console.log("playPause");
    if(vid.playing){
        console.log("playPause pause");
        vid.pause();
    } else {
        console.log("playPause play");
        vid.play();
    }
}

var button2 = function(){
    console.log("button2");
    window.vid=document.getElementById("neufVideo");
    vid.addEventListener("timeupdate",button2);
    vid.play();
    if(this.currentTime >= 5){
        // remove the event listener
        this.removeEventListener("timeupdate",button2);
        this.currentTime = 0;
        this.play();
        console.log("button2 condition 'currentTime >= 5' met");
        //return;
    } else {
        console.log("button2 else");
        this.removeEventListener("timeupdate",button2);
        //return;
    }
    //return;
};

var button1 = function(){
    console.log("button1");
};

Вы можете увидеть тестовую страницу с видео на https://micadesign.ca/neuf/

Я очень новичок в кодировании, поэтомуесли я все сделаю неправильно, я был бы рад, если бы меня указали в правильном направлении.

(Кстати, сценариев игровой головки будет не более пяти, так что я не думаю, чтолинии более сложного решения, которое будет масштабироваться.)

Спасибо!