Html5视频事件跟踪

时间:2017-06-06 07:23:01

标签: javascript jquery google-analytics html5-video

我有一个使用videojs作为平台的html5视频播放器,我正试图向GA发送一些事件。但是,当我设置自动播放时,timeupdate不起作用,也不会在移动设备上触发任何事件。

代码如下:

document.addEventListener('DOMContentLoaded', init, false);
   var videoId, dur, quarter, stat;
   videoId = document.getElementById('videojs-qualityselector-player');


function init () {
    videoId.addEventListener('play', videoPlay, false);
    videoId.addEventListener('pause', videoPause, false);
    videoId.addEventListener('ended', videoEnd, false);
    videoId.addEventListener('timeupdate', videoTimeUpdate, false);
 }

function setKeyFrames (duration) {
    if(dur){return;}
    dur = duration;
    quarter = duration / 4;
}

function videoTimeUpdate () {
    var curTime = videoId.currentTime;
    if (curTime >= quarter && curTime < quarter * 2 && stat !== 1){
      console.log("25% Played");
      ga('send', 'event', 'video', '25% video played', 'Video 1');
        stat = 1;
    } else if (curTime >= quarter * 2 && curTime < quarter * 3 && stat    !== 2){
      console.log("50% Played");
    ga('send', 'event', 'video', '50% video played', 'Video 1');
    stat = 2;
  } else if (curTime >= quarter * 3 && curTime < dur && stat !== 3){
     console.log("75% Played");
    ga('send', 'event', 'video', '75% video played', 'Video 1');
    stat = 3;
  }
}

  function videoStart () {
     console.log("start");
    ga('send', 'event', 'video', 'video started', 'Video 1');
    videoId.removeEventListener('play', videoStart, false);
    setKeyFrames(this.duration);
  }

  function videoPlay () {
    console.log("video played");
    ga('send', 'event', 'video', 'video played', 'Video 1');
    setKeyFrames(this.duration);
  }

  function videoPause () {
    console.log("video paused");
    ga('send', 'event', 'video', 'video paused', 'Video 1');
  }

  function videoEnd () {
    stat = 4;
     console.log("100% Played");
    ga('send', 'event', 'video', '100% video played', 'Video 1');
    videoId.addEventListener('play', videoStart, false);
  }

0 个答案:

没有答案