Сделать обратный отсчет JS начинается снова

У меня уже есть код для обратного отсчета, но я хотел бы сделать паузу на несколько часов, когда он равен 0 (с отображаемым текстом), а затем снова запустить на 14 дней.

 <script type="text/JavaScript">
var Display=document.getElementById("Counter");
function Countdown() {
var date1 = new Date();
var date2 = new Date ("Oct 20 20:00:00 2017");
var sec = (date2 - date1) / 1000;
var n = 24 * 3600;
if (sec > 0) {
j = Math.floor (sec / n);
h = Math.floor ((sec - (d * n)) / 3600);
mn = Math.floor ((sec - ((d * n + h * 3600))) / 60);
sec = Math.floor (sec - ((d * n + h * 3600 + mn * 60)));
Affiche.innerHTML = "Next game in : " + d +" d "+ h +" h "+ mn +" min "+ sec + " s ";
window.status = "Remaining time : " + d +" d "+ h +" h "+ mn +" min "+ sec + " s ";
}
tCountdown=setTimeout ("Countdown();", 1000);
}
Countdown();
</script>

Итак, подведем итог: 1. Обратный отсчет достигает 0 2. Он блокируется на 4 часа и отображает текст («Мы сейчас играем») 3. Он снова начинается примерно на 14 дней.

Я думаю о чем-то вроде этого, чтобы снова начать обратный отсчет: var dateX = var date2 + (время около 14 дней)

Я прав? Могу ли я сделать это только с помощью Javascript?


javascript countdown countdowntimer
person Community    schedule 17.10.2017    source источник
comment
Это кажется огромным излишеством, вы действительно думаете, что кто-то будет так долго сидеть на вашем сайте, чтобы увидеть разницу? :)   -  person Icepickle    schedule 17.10.2017
comment
кто сказал, что это для сайта? может быть всегда на экране где-то и т. д.   -  person Victor Radu    schedule 17.10.2017

Ответы (1)


arrow_upward
0
arrow_downward

Я разбил его на несколько функций, чтобы вы могли рассуждать об этом. Если вы хотите проверить это, вы можете установить начальные секунды в переменной sec на что-то маленькое, например 10, а затем вы также можете установить второй аргумент в setTimeout на что-то маленькое, например 10.

<div id="counter"></div>
<script>
// initialize
var first_target_date = new Date ("Oct 20 20:00:00 2017");
var sec = calcSecDiff(new Date(), first_target_date);
var counter = document.getElementById("counter");
var timeout; // we will update this global variable when we want to stop the whole thing

// start the countdown
countdown();

// do it again every second
var interval = setInterval(function(){
    countdown();
}, 1000);


function countdown() {
    counter.innerHTML = parseTime(sec);
    // decrement the second
    sec--;

    // if we get to 0
    if (sec < 0) {

        clearInterval(interval);

        counter.innerHTML = "We are currently playing";

        if (timeout) return; // it's over

        var timeout = setTimeout(function(){

            sec = daysToSec(14); // reset the seconds to 14 days away
            var interval = setInterval(function(){
                countdown();
            }, 1000);

        }, hrsToMs(4)); // wait four hours before counting down again
    };
}

// returns days, hours, minutes, and seconds from seconds
// see https://stackoverflow.com/questions/13903897/javascript-return-number-of-days-hours-minutes-seconds-between-two-dates
function parseTime(sec){

    // calculate (and subtract) whole days
    var days = Math.floor(sec / 86400);
    sec -= days * 86400;

    // calculate (and subtract) whole hours
    var hours = Math.floor(sec / 3600) % 24;
    sec -= hours * 3600;

    // calculate (and subtract) whole minutes
    var minutes = Math.floor(sec / 60) % 60;
    sec -= minutes * 60;

    // what's left is seconds
    var seconds = sec % 60;

    return days + " days, " + hours + " hours, " + minutes + " minutes, " + seconds + " seconds";
}

// calculates the difference between two dates in seconds
function calcSecDiff(date1, date2){
    return Math.round((date2 - date1) / 1000);
}

// converts hours to milliseconds
function hrsToMs(hrs){
    return hrs * 60 * 60 * 1000;
}

// converts days to seconds
function daysToSec(days){
    return days * 24 * 60 * 60;
}
</script>
person Harry Stevens    schedule 17.10.2017
comment
Спасибо, действительно полезно. Это работает, но я не могу найти, где срабатывает hrsToMs(4))? Должен ли я сделать какую-то работу самостоятельно, чтобы закончить код? - person ; 18.10.2017
comment
hrsToMs просто преобразует количество часов в количество миллисекунд, что является вторым аргументом setTimeout(). w3schools.com/jsref/met_win_settimeout.asp - person Harry Stevens; 22.10.2017