Wanjia Wanjia - 4 months ago 15
Javascript Question

Daily javascript countdown shorten to jquery

Found this daily countdown timer and edited it a little but I find it a little long and learned that Jquery is a shorter notation of javascript but don't know anything about it.

My knowledge is not advanced enough to either shorten this or change it to jquery.

I use the

<body onload = "getSeconds()">
to start the daily countdown.

var reloadPage = false;
function getSeconds()
{
var now = new Date();
var time = now.getTime(); // time now in milliseconds
var midnight = new Date(now.getFullYear(),now.getMonth(),now.getDate(),21,57,0); //midnight 0000 hrs
//midnight - change time hh,mm,ss to whatever time required, e.g. 7,50,0 (0750)
var ft = midnight.getTime() + 86400000; // add one day 86 400 000
var diff = ft - time;
diff = parseInt(diff/1000);
if (diff > 86400) {diff = diff - 86400}
startTimer (diff);
}

var timeInSecs;
var ticker;

function startTimer(secs){
timeInSecs = parseInt(secs);
ticker = setInterval("tick()",1000);
tick(); //to start counter display right away
}

function tick() {
var secs = timeInSecs;
if (secs > 0) {
timeInSecs--;
}
else
{
clearInterval(ticker); //stop counting at zero
if (secs == 0)
{
reloadPage = true;
console.log("reset");
};
getSeconds(); //and start again if required
}

var hours= Math.floor(secs/3600);
secs %= 3600;
var mins = Math.floor(secs/60);
secs %= 60;

if(reloadPage)
{
var result = "Please reload page for daily reset."
}
else
{
var result = ((hours <= 0 ) ? "" : hours + " hours ") + ( (mins <= 0) ? "" : mins + " minutes " ) + ( (mins <= 0) ? " < 1 minute " : "" );
}
document.getElementById("countdown").innerHTML = "Daily reset: " + result;
}

Answer

Here's your code "changed to jQuery"

var reloadPage = false;
function getSeconds()
{
    var now = new Date();
    var time = now.getTime(); // time now in milliseconds
    var midnight = new Date(now.getFullYear(),now.getMonth(),now.getDate(),21,57,0); //midnight 0000 hrs
    //midnight - change time hh,mm,ss to whatever time required, e.g. 7,50,0 (0750)
    var ft = midnight.getTime() + 86400000; // add one day 86 400 000
    var diff = ft - time;
    diff = parseInt(diff/1000);
    if (diff > 86400) {diff = diff - 86400}
    startTimer (diff);
}

var timeInSecs;
var ticker;

function startTimer(secs){
    timeInSecs = parseInt(secs);
    ticker = setInterval("tick()",1000); 
    tick(); //to start counter display right away
}

function tick() {
    var secs = timeInSecs;
    if (secs > 0) {
        timeInSecs--;
    }
    else
    {
    clearInterval(ticker); //stop counting at zero
    if (secs == 0)
    {
        reloadPage = true;
        console.log("reset");
    };
    getSeconds();  //and start again if required
}

var hours= Math.floor(secs/3600);
secs %= 3600;
var mins = Math.floor(secs/60);
secs %= 60;

if(reloadPage)
{
    var result = "Please reload page for daily reset."
}
else
{
    var result = ((hours <= 0 ) ? "" : hours + " hours ") + ( (mins <= 0) ? "" : mins + " minutes " ) + ( (mins <= 0) ? " < 1 minute " : "" );
}
$("#countdown").html("Daily reset: " + result);
}

saving 27 bytes ... I'm sure loading 86000+ bytes of jQuery library wont negate this saving at all

Comments