Formatting hours - 1 Hour, Many Hours

Question

I have a Christmas countdown clock that works fine, however, when it displays 1 hour, it says 1 'HOURS' not 1 'HOUR'

I know that is a little bit trivial, but i would like it to be correct and display the correct words.

Could anyone help please?

The Code is

<script language="javascript" type="text/javascript">
today = new Date();
  BigDay = new Date("December 25, 2013")
    msPerDay = 24 * 60 * 60 * 1000 ;
      timeLeft = (BigDay.getTime() - today.getTime());
         e_daysLeft = timeLeft / msPerDay;
            daysLeft = Math.floor(e_daysLeft);
               e_hrsLeft = (e_daysLeft - daysLeft)*24;
           hrsLeft = Math.floor(e_hrsLeft);
       minsLeft = Math.floor((e_hrsLeft - hrsLeft)*60);
      document.write( "There's only "+daysLeft+" days, "+hrsLeft+" hours and "+minsLeft+" minutes left until Christmas!");
</script>

Many Thanks PBrown

You need to add in an if/else statement that checks for the hrsLeft before you write this line document.write( "There's only "+daysLeft+" days, "+hrsLeft+" hours and "+minsLeft+" minutes left until Christmas!"); If hrsLeft < 2 then the text needs to be "document.write( "There's only "+daysLeft+" days, "+hrsLeft+" hour and "+minsLeft+" minutes left until Christmas!"); — campagnolo_1, Nov 23 '13 at 23:29

score 1 · Answer 1 · edited May 23 '17 at 10:31

1

(as a side note, you probably shouldn't use document.write).

This is a great place to use JS's ternary operator.

var hoursStr = hrsLeft === 1 ? hrsLeft + 'hour' : hrsLeft + 'hours';

edited May 23 '17 at 10:31

Community

1
1

answered Nov 23 '13 at 23:14

SomeKittens

35,809
19
104
135

Thank you for all of your help, Have a Very Merry Christmas and Happy New Year.... – PBrown Nov 23 '13 at 23:39

score 1 · Accepted Answer · answered Nov 23 '13 at 23:17

today = new Date();
BigDay = new Date("December 25, 2013");
msPerDay = 24 * 60 * 60 * 1000;
timeLeft = (BigDay.getTime() - today.getTime());
e_daysLeft = timeLeft / msPerDay;
daysLeft = Math.floor(e_daysLeft);
e_hrsLeft = (e_daysLeft - daysLeft) * 24;
hrsLeft = Math.floor(e_hrsLeft);
minsLeft = Math.floor((e_hrsLeft - hrsLeft) * 60);
document.write("There's only " + daysLeft + getDayText(daysLeft) + " , " + hrsLeft + getHourText(hrsLeft) + " and " + minsLeft + getMinuteText(minsLeft) + " left until Christmas!");

function getHourText(hour) {
    if (hour > 1) {
        return " hours";
    }

    return " hour";
}

function getMinuteText(min) {
    if (min > 1) {
        return " minutes";
    }

    return " minute";
}

function getDayText(day) {
    if (day > 1) {
        return " days";
    }

    return " day";
}

EDIT: The above is of course the long way of doing it and definitely not the preferred way for most. You can also use the ternary operator and do something like this:

var str = hours + (hours > 1 ? " hours " : " hour ") + "left!";

Thank you for all of your help, Have a Very Merry Christmas and Happy New Year.... — PBrown, Nov 23 '13 at 23:38

Jonathan de M. · Answer 3 · 2013-11-23T23:25:54.337

0

function pluralize(num, str){
    if(num > 1){
        return num+' '+str+'s';
    }
    return num+' '+str;
}

Use

var hrsLeft = 20;
pluralize(hrsLeft, 'hour');

Returns

20 hours

That's very basic and it exists more complete version of this function.

See here for a complete pluralize

edited Nov 23 '13 at 23:25

answered Nov 23 '13 at 23:14

Jonathan de M.

8,951
8
45
70

Thank you for all of your help, Have a Very Merry Christmas and Happy New Year.... – PBrown Nov 23 '13 at 23:38

Formatting hours - 1 Hour, Many Hours

3 Answers3