Youtube видео API в JavaScript

Question

Я использовал YouTube API видео в JavaScript

И играть паузы и остановить события, которые я использовал

Теперь я получил общее текущее время, общее время просмотра, но моя главная проблема заключается в следующем:

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

Вот мой код:

function onytplayerStateChange(event) 
{ 
    //alert("Status=>"+event.data); 
    if(event. data == 1) { 
        if(Math.floor(event.target.A.currentTime) == 0) { 
            previous_track_time = current_track_time = 0; 
            total_track_time = event.target.A.duration; 
        } else { 
            previous_track_time = current_track_time; 
            current_track_time = event.target.A.currentTime; 
        } 
    } 
    if(event.data == 2) 
    { 
        current_track_time = event.target.A.currentTime; 
        total_track_time =(event.target.A.duration-(current_track_time-previous_track_time)); 
        previous_track_time = current_track_time; 
    }
} 

Вы можете это исправить, пожалуйста?

Answer 1

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

Функция onPlayerStateChange:

function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING) {
        //player play
        timer = setInterval(
          function() {
            seconds++;
            console.log("you watch: "+ seconds +" seconds of the video");
          }, 1000
        );
    } else {
      //player pause
      clearInterval(timer);
    }
}

Вывод: я вижу только 8 секунд видео, 4 первые секунды и 4 секунды в 2:03

Есть живой пример (ОБНОВЛЕНО)

Полный код:

var tag = document.createElement('script');

tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

// 3. This function creates an <iframe> (and YouTube player)
//    after the API code downloads.
var player;

function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
        height: '390',
        width: '640',
        videoId: 'l-gQLqv9f4o',
        events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
        }
    });
}

// 4. The API will call this function when the video player is ready.
var seconds = 0;
var timer;
function onPlayerReady(event) {
    event.target.playVideo();

}

function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING) {
        //player play
        timer = setInterval(
          function() {
            seconds++;
            console.log("you watch: "+ seconds +" seconds of the video");
          }, 1000
        );
    } else {
      //player pause
      clearInterval(timer);
    }
}

function stopVideo() {
    player.stopVideo();
}