I'm using this plugin to do a countdown. In his example, he is counting down to Australia Day
$(function () {
var countdownDate = new Date();
countdownDate = new Date(countdownDate.getFullYear() + 1, 1 - 1, 26);
$('#countdown').countdown({until: countdownDate});
$('#year').text(countdownDate.getFullYear());
});
I need it to count down to 8 PM EST on Tuesday, November 6, 2012, but I'm not sure how to customize it. The Date() function confuses me.
The Date constructor shown above is in the format new Date(Year, Month, Day). However, keep in mind that the Month argument is 0-indexed. That means that January is 0, not 1. So to count down to November 6th, 2012, you would want to construct the date like this:
countdownDate = new Date(2012, 10, 6);
You might also consider doing:
countdownDate = new Date(2012, 11-1, 6);
Which is similar to what the example shows. But it just slows things down unnecessarily in order to be more clear about what month you're referring to.
Additionally, if you construct a Date object with no arguments, it gives you the current date. So new Date() gives you a date object equivalent to "now". In the example, they use that to get the current year using (effectively) (new Date()).getFullYear(). They then increment it by one and pass it into a new Date constructor in order to get the time until the "next" Australia Day.
It should be noted that the Australia Day example actually has a bug. If it's currently January, then the year will be unnecessarily incremented and the countdown will show the time until the following year's Australia Day. So in the example, the countdown will never drop below 26 days. Whoops. :-)
UPDATE:
Either your question got updated or I missed this the first time around. Looks like you wanted to end at 8PM EST. That's actually pretty tricky using the numerical date constructor. Because JavaScript runs on the client side and uses "local time" by default, you need to explicitly note the time zone. You can do this using the setUTC versions of setters (e.g. setUTCHours()), but it's a bit annoying and takes several lines of code. So your best bet is to use Date's String-based constructor:
new Date("November 6, 2012 20:00:00 GMT -5:00")
The Date() constuctor calls you'd want to use would be one of the following:
new Date(dateString)
new Date(year, month, day, hours, minutes, seconds, milliseconds)
Soy, you could do
new Date("November 6, 2012 20:00:00 GMT -5:00")
and that would do it.
countdownDate = new Date(2012, 10, 6, 20, 0, 0, 0);
or
countdownDate = new Date("11/6/2012 8:00 PM")
see https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Date
These lines determine the date that it's counting down to:
var countdownDate = new Date();
countdownDate = new Date(countdownDate.getFullYear() + 1, 1 - 1, 26);
The first line here creates a new JavaScript Date Object. It defaults to right now when you create a Date.
The next line sets the date to a specific point in time using the structure:
new Date(year, month, day, hours, minutes, seconds, milliseconds);
I'll go one step at a time:
1. Year it gets the current year with countdownDate.getFullYear(), add one to make it next year
2. 1 - 1 = 0, so this is selecting the first month (January)
3. 26 is the 26th day of a particular month
To fix you can replace both of these lines with a single one using the string notation:
var countdownDate = new Date("November 6, 2012 20:00:00 EST");
Related
with the help of new Date() how i can achieve this.
my code :
var temp =new Date("October 13, 2014 22:34:17");
console.log(new Date(temp-1));
requirement:
before: Aug 4, 2014 11:59pm (EDT)
after: Aug 3, 2014 11:59pm (EDT)
You need to specify what amount of time you are subtracting. At the moment its 1, but 1 what? Therefore, try getting the days using getDate() and then subtract from that and then set the date with setDate().
E.g.
var temp = new Date("October 13, 2014 22:34:17");
temp.setDate(temp.getDate()-1);
The simple answer is that you want to subtract a days worth of milliseconds from it. So something like the following
var today = new Date('October 13, 2014 22:34:17');
var yesterday = new Date(today.getTime() - (24*60*60*1000));
console.log(yesterday);
The problem with this is that this really gives you 24 hours earlier, which isn't always a day earlier due to things such as changes in Daylight Saving Time. If this is what you want, fine. If you want something more sophisticated, check out moment.js
You can simply subtract one day from today date like this:
var yesterday = new Date(new Date().setDate(new Date().getDate()-1));
Simply subtract from one date to the next Date. You can do so by clicking on this link for subtracting the date. following this url.
I've been playing around with the Date() object while studying when I noticed that setUTCHours() returns the wrong day.
Example:
var myDate = new Date(2014, 0, 1);
myDate.setUTCHours(10);
myDate;
Looking at this, I expected the date to be Wed Jan 01 2014 10:00:00 UTC, but instead Its one day behind. Why is that?
Here's my http://jsfiddle.net/L5QEC/ with comparisons to some other basic methods.
Date objects use a time value that is UTC. They also have an offset that represents the timezone offset of the host system. By default, dates and times will use the offset to display local values. If you are UTC+1, then the offset will be -60 and new Date(2014, 0, 1) will create a date for 2013-12-31T23:00:00Z and use the offset to display a local date of 2014-01-01T00:00:00+0100.
So if you change the UTC hours to 10, the UTC time is: 2013-12-31T10:00:00Z and the local equivalent is 2013-12-31T11:00:00+0100.
So by setting the UTC hours to 10 you effectively set the local time to 11:00 (i.e. the UTC hours + 1 hour offset) on the previous day.
If you'd like to set a specific date and time in UTC, consider:
var dt = new Date(Date.UTC(2014, 0, 1, 10, 0, 0));
The result will represent that point in universal time, but you will see it adjusted to the local time zone for display. For example:
"Wed Jan 01 2014 02:00:00 GMT-0800 (Pacific Standard Time)"
Read the UTC date, not the local (default) Date:
var myDate = new Date(2014, 0, 1);
myDate.setUTCHours(10);
myDate.toUTCString();
One dirty way is to convert the local date to UTC before you use setUTCHours
function UTCDate() {
var dateObject = new Date();
var UTC = new Date(dateObject.getUTCFullYear(),
dateObject.getUTCMonth(), dateObject.getUTCDate(),
dateObject.getUTCHours(), dateObject.getUTCMinutes(),
dateObject.getUTCSeconds(),dateObject.getUTCMilliseconds());
return UTC;
}
When the time is 0 hours and 0 minutes, there's this annoying one-day delay based on the GMT.
For example if the GMT is +2, the number of hours of the date must be greater than 2 otherwise the date takes one day less.
The solution I found to avoid this weird effect is to use this trick.
var myDate = new Date(2014, 0, 1);
var timezoneOffset = myDate.getTimezoneOffset();
if (timezoneOffset > 0) {
myDate.setMinutes((24 * 60) - (timezoneOffset + 1));
} else {
myDate.setMinutes(-timezoneOffset); // Do not forget the negative sign !
}
myDate.setUTCHours(10);
So when I add the time corresponding to the GMT offset I no longer have this wrong date !
I tested all GMTs by changing the settings of my operating system (-13, -2, +2, +12)
You can set the UTCMinutes after that if you want !
The getTimezoneOffset() method returns the time difference between UTC time and local time, in minutes.
For example, If your time zone is GMT+2, -120 will be returned.
I have searched this forum and found many useful answers, but one of the answers that I used only works under certain conditions.
I am populating a week calendar, and simply need to determine the start of the week (Monday) from a Date picker, and then I add to that date to populate text fields with the following 6 days. This works only if the date picker selection is in the same month.
So, if I select Wednesday May 15th 2013, it correctly returns and populates the Monday with May 13, the Tuesday with May 14, etc.
But, if I select Wednesday May 1, 2013, it correctly populates Monday Apr 29, but Tuesday it puts as May 30 (adding a month instead of a day).
I should note that I am building this in Application Craft, so I don't know if that has any impact.
Here's my code:
var curr = new Date(app.getValue("DatePicker2")); // get selected date
var first = curr.getDate() - curr.getDay() +1; // Adjust for monday start of week
var firstday = new Date(curr.setDate(first));
var secondday = new Date();
secondday.setDate(firstday.getDate()+1);
Can anyone see where I have gone wrong?
Thanks
Tammy
Here
secondday.setDate(firstday.getDate()+1)
since you are specifying only the date in the setDate function, it would assume "this" month which happens to be May in this case
So, you can do
secondday = new Date(firstday.getFullYear(), firstday.getMonth(), firstday.getDate()+1)
I have a section of simple Javascript in my application that has a link "Add Day", which adds 1 day to a date. It always works perfectly, except when the date gets to be 11/07/2010, and then the link suddenly will not work any longer. Its really wierd, because it only hangs up on the specific date of 11/07/2010.
How to reproduce error:
Navigate to the page here
On any date field, click "Today", or just set the date to today.
Click "Add Day" until you get to 11/07/2010
Now clicking "Add Day" does not work anymore!
The problem is that you're adding the 24 hours to the date to add one day; Daylight Savings Time has thwarted you because 24 hours after 00:00 on November 7th will be 23:00 (for the second time) on November 7th.
Others spotted what the problem is.
To fix it you can use the overloaded Date constructor that takes the year, month, and day:
var aDate = new Date(2010, 10, 07);
var aDatePlusOneDay = new Date(aDate.getFullYear(),
aDate.getMonth(),
aDate.getDate() + 1, // HERE
aDate.getHours(),
aDate.getMinutes(),
aDate.getSeconds(),
aDate.getMilliseconds());
Here's a more generic solution that can increment any date by a given millisecond amount, taking changes to daylight savings into account:
Date.addTicks = function(date, ticks) {
var newDate = new Date(date.getTime() + ticks);
var tzOffsetDelta = newDate.getTimezoneOffset() - date.getTimezoneOffset();
return new Date(newDate.getTime() + tzOffsetDelta * 60000);
}
Adding a day to a Date object then is a matter of adding the number of milliseconds in one day:
Date.addTicks(new Date(2010, 10, 7), 86400000); // new Date(2010, 10, 8)
References:
Date.prototype.getTimezoneOffset
Daylight Savings Time. (In most places in the US) the time rolls back on the first Sunday of November. Your code is just adding an amount of milliseconds to the start of the day specified by the input box, and the returning the beginning of the resulting day: however because of DST, simply adding seconds and truncating the date this way will never progress the date.
I'm in javascript, running this in the console
d = new Date();
d.setMonth(1);
d.setFullYear(2009);
d.setDate(15);
d.toString();
outputs this:
"Sun Mar 15 2009 18:05:46 GMT-0400 (EDT)"
Why would this be happening? It seems like a browser bug.
That's because when you initialize a new Date, it comes with today's date, so today is Oct 30 2008, then you set the month to February, so there is no February 30, so set first the day, then the month, and then the year:
d = new Date();
d.setDate(15);
d.setMonth(1);
d.setFullYear(2009);
But as #Jason W, says it's better to use the Date constructor:
new Date(year, month, date [, hour, minute, second, millisecond ]);
It's probably best to construct a Date object in one step to avoid the Date object being in an ambiguous or invalid state:
d = new Date(2009, 1, 15);
d = new Date();
d.setDate(15);
d.setMonth(1);
d.setFullYear(2009);
d.toString();
This works.
After a bunch of testing in FF3 on XP with Firebug, here are the things I can tell you
Calling Date.setDate() after calling Date.setMonth() will generate this odd behavior.
Date.setMonth() forces the timezone to be CST (or, some non DST-aware zone)
Date.setDate() forces the timezone to be CDT (or, some DST-aware zone)
So, there's definitely something wonky going on with setMonth() and setDate() in respect to the timezone.
The only solution I can offer is this: Set the date before you set the month.
This will work generally to avoid the rollover behavior of the javascript Date API:
d.setDate(1);
d.setFullYear(year);
d.setMonth(month);
d.setDate(day);
Given that year + month + day are in a "valid" combination, e.g. taken from another Date object using getFullYear(), getMonth(), getDate().
The important parts are:
starting with setDate(1) to avoid possible rollover when the current date value is 29, 30 or 31
call setMonth(month) before setDate(day) to avoid the same rollover in case the current month value is "problematic" (because then the initial setDate(1) would be without effect)