1

I have a time calculator that I would like to make update every minute. I made a special function to calculate the time for each time zone, but when I use setTimeout() to call the function manualTime();, it seems that it does not call solveTime(); for any variable (it used to work when I did not use two functions)

edit: I found the real cause to be that the function is not updating the time when it is called. It will always return the time when it was first loaded for some reason.

code below

var masterTimeUTC = new Date(); //these need to be global for the solveTime to work
    var utcHours = masterTimeUTC.getUTCHours();
    var utcMinutes = masterTimeUTC.getUTCMinutes();
    var utcSeconds = masterTimeUTC.getUTCSeconds();
    var utcMinutesLead = masterTimeUTC.getUTCMinutes();

function manualTime() {
    //the main show
    var masterTimeLocal = new Date(); //this contains everything, so we can mess with it more
    var localhours = masterTimeLocal.getHours();
    var localminutes = masterTimeLocal.getMinutes();
    var localseconds = masterTimeLocal.getSeconds();
    //get all the relvant info for this stuff
    if (localminutes < 10) {
        localminutes = "0" + localminutes;
    }
    if (localseconds < 10) {
        localseconds = "0" + localseconds;
    }
    if (localhours < 10) {
        localhours = "0" + localhours;
    } //make it look nice
    //solve times based on utc codes
    solveTime(0);//utc 0
    solveTime(-7); //west
    solveTime(-6); //mountain
    solveTime(-5); //central
    solveTime(-4); //east
    solveTime(1); //uk
    solveTime(8); //perth
    solveTime(9); //adelaide
    solveTime(10); //sydney
    //use the solveTime function to solve for times. syntax is x
    // x is the utc modifier, it can be any number incl. negatives
    document.getElementById("clocksingle").innerHTML = localhours + ":" + localminutes + "." + localseconds;
    //set the big time on top.
    setTimeout(manualTime, 1000);
    //run this every second to simulate a real clock
}


function solveAll() {
    manualTime();
    solveTime(-7);
    solveTime(-6);
    solveTime(-5);
    solveTime(-4);
    solveTime(0);
    solveTime(8);
    solveTime(9);
    solveTime(10);
}
//solveTime
//this will handle everything, including am, pm, printing to div, whatever
//the div name is whatever the utc modifier is
function solveTime(x) {
    if (x < 0) {
        var shift = 24 + x;
    } else {
        var shift = x;
    }

    var suffixSolve = (utcHours + shift) % 24;
    var suffix = "am";
    if (suffixSolve > 12) {
        suffix = "pm";
    }
    if (utcMinutes == 0) {
        utcMinutesLead = "00";
    }
    if (utcMinutes < 10) {
        utcMinutesLead = "0" + utcMinutes;
    }
    var timeSolve = (((utcHours + x) + 11) % 12 + 1);
    var timeTotal = timeSolve + ":" + utcMinutesLead + " " + suffix;
    var utcMod = x;
    if (utcMod > 0) {
        utcMod = "+" + utcMod;
    }
    if (x === 0){
        document.getElementById(x).innerHTML = timeTotal;
    }
    else {
    document.getElementById(x).innerHTML = "(UTC" + utcMod + ") " + timeTotal;
    }
}

window.onload = function () {
    setTimeout(1000);
    manualTime();

}

window.onload = function () {
    setTimeout(60000);
    solveAll();
}

edit:

I added some console outputs to the solveTime function, it seems to be running every seconds (thanks to the setTimeout) but is not updating the time it is solving from. I tried adding a new Date() inside the function but that is not working either.

edit2:

this isn't a duplicate, the function is called fine. The times inside of the functions do not update whenever it is run again.

mark
  • 17
  • 5

2 Answers2

2
window.onload = function () {
    setTimeout(function(){
        manualTime();
    ),1000);
}

window.onload = function () {
    setInterval(function(){
        solveAll();
    ),60000);
}
dperish
  • 1,226
  • 13
  • 24
marcinrek
  • 329
  • 1
  • 8
  • This does work actually, just not for the problem I have (Function not updating time, only uses the time it was when it is first loaded) – mark Oct 20 '16 at 18:55
1

setTimeout is an asynchronous operation, doesn't block execution like synchronous code.

setTimeout(1000);
manualTime(); // <-- this runs immediately after, not after 1000ms

The first argument to setTimeout is the callback function, and the time in milliseconds is the second argument. The callback function gets called (at the minimum) right after the time expires.

As you've done so at the end of manualTime(), you should pass the callback directly in the code within window.onload as well:

setTimeout(manualTime, 1000);

Same thing for solveAll.

Also you can put everything in a single onload handler, there's no need for the separation:

window.onload = function () {
  setTimeout(manualTime, 1000);
  setTimeout(solveAll, 60000);
}
Community
  • 1
  • 1
nem035
  • 31,501
  • 5
  • 73
  • 88
  • This results in an `eval` and is not recommended. – dperish Oct 20 '16 at 18:28
  • @dperish what do you mean? There's no call to `eval` anywhere? – nem035 Oct 20 '16 at 18:29
  • See this: http://stackoverflow.com/questions/8058996/why-does-calling-settimeout-with-parenthesis-not-start-a-new-callstack. or this: http://e.epubbud.com/read.php?g=54B6SAEK&p=77 – dperish Oct 20 '16 at 18:33
  • @dperish that still has nothing to do with `eval` ' and is also not what I'm doing in my answer. `eval` happens internally when you pass a string to `setTimeout` as the first argument. I'm passing a function. If my answer suggested `setTimeout(manualTime(), 1000)` (notice the `()`), then your argument might apply. – nem035 Oct 20 '16 at 18:33
  • 1
    Sorry, didn't examine your whole post. I stand corrected – dperish Oct 20 '16 at 18:40