2014-01-29 109 views
2

我目前使用的是flipclockJavascript递归倒计时10s到0

我在与时钟本身没有问题。时钟在我身边正常工作。对于我来说,闹钟完成后会发生什么,我希望我的网页上的人们继续倒计时10秒,以确保他们不想继续投票。

是的。我正在实时执行此操作(同一页面上的每个人都将看到相同的倒计时),所以我使用长轮询来帮助我做到这一点。对于长时间轮询,我使用Github的https://github.com/panique/php-long-polling

更糟糕的是,谁在最后10秒倒计时过程中,点击投票按钮将再次倒计时重置为10和递归地做到这一点,直到没人做的。

我想运行的JavaScript函数每次有人的时钟到达零递归的。这将确保每个进入最后倒数时间范围的人员,无论任何轻微的时间延迟将在同一时间同样开始。

,因为我是在实时运行这个,麻烦的是真正得到时间连接到我的网页每家每户的其他计算机上具有相同的倒计时。

我已经试过如下:

function resetTime(){ 
    $.post('<?php echo $path ?>/ajax_bid_room_files/last_seconds.php',function(data){ //this script will attempt to create new text file to keep track of time 
    setInterval(function(){ 
     $.post('<?php echo $path ?>/ajax_bid_room_files/updatetiming.php',function(data){//this script will update text file to keep track of current countdown 
     $("#remaining_timeleft").html(data); //where data is the current countdown 
     }); 
    },1000); 
    }); 
} 


var clock2 = $('.bid_duration2').FlipClock({ 
    countdown:true, 
    callbacks:{ 
    stop: function() { 
     resetTime(); 
     if($("#remaining_timeleft").html()>0){ 
     $("#vote").click(function()){ 
      resetTime(); 
     } 
     } 
    } 
    } 
}); 

什么实际上,我想在这里尝试是一次flipclock倒计时停止,回调被调用,并重新设定时间()被加载。如果在倒数计时期间任何人按#vote,则重新启动resetTime并重置时间。

我不完全相信这将工作,因为我实际上运行一个.post每隔1秒的间隔,将调用一个php脚本来做一个文本文件fwrite(即使它不是数据库)但我怀疑这个请求会在一秒钟内完成。

但是,如果任何人都可以在这里提供一些指导,我会很乐意欣赏它。

或者有其他更好的解决办法,我会很高兴听到他们出来为好。

请澄清我的任何疑虑。我很乐意澄清我的问题以获得更清晰的解决方案。

+0

了解网络套接字 – epascarello

回答

0

只要做到这一点,而不回调和Ajax的部分,保持简单是这样的:

var ctime = 10, 
count = setInterval(showVote,1000); 
$('.vote button').click(function() { 
    clearVote(); 
}); 
function showVote() { 
    --ctime; 
    $('.time').html(ctime); 
    if (ctime==0) { 
     clearVote(); 
    } 
} 
function clearVote() { 
    clearInterval(count); 
    $('.vote').hide(); 
    $('.page').show(); 
} 

Here a jsfiddle