Javascript: подсчитывать количество воспроизведений видео одного пользователя на странице?

Я видел здесь много болтовни о подсчете общего количества просмотров видео среди пользователей. Это не то, что мне нужно.

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

Попытка 1: использование прослушивателя событий для увеличения счетчика при срабатывании onplay.
Проблема 1: наличие функции увеличения внутри функции addeventlistener приводило к циклическому поведению. Вместо того, чтобы увеличиваться один раз каждый раз, счетчик будет увеличивать количество раз, равное его текущему значению. Не нормально.

Попытка 2: убрать оператор/функцию приращения из оператора addlistener. Проблема 2: Это дает хороший прирост, но он просто подсчитывает количество КЛИКОВ, а не количество ВОСПРОИЗВЕДЕНИЙ. Например, если пользователь делает двойной щелчок, счетчик зарегистрирует это как «2», тогда как видео будет воспроизведено только один раз в ответ.

Я уверен, что Попытка 1 была ближе к цели, поэтому вот мой код для этого, и, возможно, кто-нибудь может сказать мне, почему я получаю такие зацикленные результаты? Игра слов. Этот код отображает обе проблемы: он увеличивается, как если бы он находился в цикле, и он подсчитывает клики вместо воспроизведений. Первое для меня более загадочно, но мне было труднее решить второе. Я был бы очень обязан, если бы кто-нибудь из вас смог решить оба!

Вероятно, часть моей проблемы связана с тем, что я вызываю функцию PlayVideo() через «onclick». Я открыт для других способов настроить это, чтобы было меньше проблем.

P.S. Я также не хочу считать, сколько раз видео заканчивается, так как многие пользователи, скорее всего, сделают свой выбор до окончания видео. Увеличение должно произойти на ранней стадии.

        function PlayVideo(){
        var myVideo = document.getElementsByTagName('video')[0];          
        myVideo.play();
        myVideo.addEventListener('playing', function(){
            viewcounter++}, false);
        console.log(viewcounter);
        //myVideo.addEventListener('onplay', viewcounter++);
    }

javascript video increment counter
person user2411121    schedule 07.10.2013    source источник

Ответы (3)


arrow_upward
0
arrow_downward

Может быть, изменить playing на play

function onPlay(){
    var myVideo = document.getElementsByTagName('video')[0];          
    myVideo.play();
    myVideo.addEventListener('play', function(){
        viewcounter++}, false);
    console.log(viewcounter);
}

Это будет вызываться всякий раз, когда воспроизводится видео. Ссылка: http://www.w3schools.com/tags/ref_av_dom.asp

person y--    schedule 07.10.2013
comment
Спасибо, но, к сожалению, я пробовал это, и я получаю точно такое же поведение. :-\ - person user2411121; 08.10.2013

arrow_upward
0
arrow_downward

На самом деле это не столько ответ, сколько обходной путь, но на случай, если у кого-то возникнут похожие проблемы:

В основном мне нужен был способ подавить функцию увеличения до первого щелчка после завершения воспроизведения видео. Для этого я создал дополнительную переменную (с именем «fired») и инициализировал ее значением false. Функция приращения вызывается, только если "fired" = false. После того, как он сработает один раз, я устанавливаю fired = true. Затем я использую прослушиватель событий, чтобы вернуть значение false после окончания видео. Это некрасиво, но это работает.

Если у кого-то есть идея получше, я весь внимание!

var fired = false;

function PlayVideo(){
            var myVideo = document.getElementsByTagName('video')[0];          
            myVideo.play();
            StartTimer();
            if (!fired) {
                viewcounter++; //in other words, increment the first time it's clicked, but then not again until after the variable has been reset to false, which happens at the end of the video.
            }
            fired = true;
            console.log(viewcounter);
            myVideo.addEventListener('ended', function(){fired=false;}, false);
person user2411121    schedule 08.10.2013

arrow_upward
0
arrow_downward

Вы также можете подсчитать, сколько раз зритель проходит через определенный момент времени (или добавить несколько счетчиков времени):

var triggerTime=1, fired=0;

function PlayVideo(){
myVideo.addEventListener("timeupdate", function () {
       var timer = myVideo.currentTime.toFixed(2) ;
       if (timer > triggerTime) {
            if (!fired) {
                viewcounter++;
                fired=true;
            }
       }
myVideo.addEventListener('ended', function(){fired=false;}, false);
}
person jkrz    schedule 01.11.2013