javascript date issue

Question

I have a js script which checks the local time of the user and based on the local time switches image on the page. The condition is that one image should be displayed from 6AM to 6PM and another one from 6PM until 6AM. Everything works fine except that after midnight the condition doesn't work properly and the selected image for that period is not displayed. Here is the script I have:

 function SetHiddenVariable() {
     var localTime = new Date();
     var hour = localTime.getHours();
     var minute = localTime.getMinutes();
     var time = hour + ':' + minute;
     var suffix = "AM";

     if(hour >=12)
     {
         suffix = "PM";
         hour = hour - 12;
     }

     if(minute < 10)
     {
         minute = "0" + minute;
     }          

     var timeMorning = new Date("1/1/2012 06:00 AM");
     var timeEvening = new Date("1/1/2012 06:00 PM");
     var realTime = new Date("1/1/2012 " + time);
     var logo = document.getElementById('imgLogo');

     if (realTime < timeMorning && realTime > timeEvening) {
         if (logo == typeof ('undefined')) return;
         logo.src = 'Images/night.png';
     }        
 }

Any idea how can I solve this?

Rob W · Accepted Answer · 2012-03-23 20:17:26Z

The time variable will not magically update when you change the value of hour and minute. Place the assignment to the time variable after the if-conditions.
Also, do not forget to append the suffix:
Another issue: When an element cannot be found using document.getElementById, null is returned. Your current check is flawed: typeof ('undefined') returns string, so logo == typeof ('undefined') will always be false. Replace it with logo == null.

Code:

function SetHiddenVariable() {
    var localTime = new Date();
    var hour = localTime.getHours();
    var minute = localTime.getMinutes();
    //var time = hour + ':' + minute;              // Removed here
    var suffix = "AM";
    if (hour >= 12) {
        suffix = "PM";
        hour = hour - 12;
    }
    if (minute < 10) {
        minute = "0" + minute;
    }
    var time = hour + ':' + minute + ' ' + suffix; // Placed here, added suffix
    var timeMorning = new Date("1/1/2012 06:00 AM");
    var timeEvening = new Date("1/1/2012 06:00 PM");
    var realTime = new Date("1/1/2012 " + time);
    var logo = document.getElementById('imgLogo');
    if (realTime < timeMorning && realTime > timeEvening) {
        if (logo == null) return;
        logo.src = 'Images/night.png';
    }
}

pseudosavant · Accepted Answer · 2012-03-23 21:06:01Z

0

Maybe I am misunderstanding what you exactly want to do here but if you just want to determine if it is nighttime (between 6pm and 6am) or not this will do it for you:

var night = (new Date().getHours < 6 || new Date().getHours > 18);

If it is night then night === true if it isn't night === false. Then you can do your image replacement logic off of that. E.g.

if (night) {
    logo.src = "night.png";
} else {
    logo.src = "day.png";
}

answered Mar 23, 2012 at 21:06

pseudosavant

7,3042 gold badges41 silver badges43 bronze badges

Collectives™ on Stack Overflow

javascript date issue

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related