Таймер обратного отсчета, который обновляется в зависимости от данных, которые я получаю через WebSocket

Question

Я хочу создать 10-секундный таймер обратного отсчета JQuery с WebSocket, который обновляется каждую секунду. Он должен сбросить таймер на x секунд (в зависимости от данных, которые я получаю из WebSocket). Если я получаю данные для определенного таймера, он должен начинаться заново и отсчитывать с 10 секунд снова, но только для этого конкретного таймера. Если один из этих таймеров падает до 0, обратный отсчет должен полностью остановиться.

В данный момент я использую setInterval для демонстрационных целей, но я хочу внедрить эти таймеры в WebSocket, как упоминалось: http://jsfiddle.net/alexiovay/azkdry0w/5/

JavaScript:

var setup = function(){
  $('.count').each(eachSetup);    
};

var eachSetup = function(){
  var count = $(this);
  var sec = count.data('seconds') ;  
  count.data('count', sec);
};

var everySecond = function(){  
  $('.count').each(eachCount);    
};

var eachCount = function(){
  var count = $(this);
  var s = count.data('count');
  count.text(s);
  s--;
  if(s < 0) { 
    s = 0;
  }
  count.data('count', s);
};

setup();
setInterval(everySecond, 1000);

HTML:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p class="count" data-seconds="5"></p>
<p class="count" data-seconds="10"></p>
<p class="count" data-seconds="15"></p>

Мой WebSocket запускается так и обновляется каждую секунду:

var socket = io.connect('http://localhost:8000');   
socket.on('notification', function (data) {
    $.each(data.rows,function(index,row){   
...

Answer 1

Если вы получаете, скажем, data.user и data.seconds из сокета, вы можете сделать следующее:

var timers = []; // Creates an array to store your timers
socket.on('notification', function(data) { // Listen for 'notification' from socket
    if(timers.length > 0) {
        for(i in timers) {
            if(timers[i][0] === data.timer) {
                timers[i][1] = 10; // If timer for data.user already exists, set it to 10 seconds again.
            } else {
                timers.push([data.timer, data.seconds]); // Else, create it with data.seconds seconds
            }
        }
    } else {
        timers.push([data.timer, data.seconds]);
    }
}

function timerCount() {
    for(i in timers) {
        if(timers[i][1] <= 0) {
            delete timers[i]; // If timer seconds is less than 0, delete it.
        } else {
            timers[i][1]--; // Else, decrease it by 1 second.
        }
    }
}

setInterval(timerCount, 1000); // Runs the timerCount() function every second.