Welcome grasshopper. Let us begin.
Step #1 - Pick your weapon
In order to move safely through the shadowy world of the JavaScript Date Class you must add the date.js file to your arsenal of tools.
Example
You can download the latest release from datejs.com/download/ or connect directly to the SVN source repository via datejs.com/svn/.
The date.js file can be found within the /build/ folder.
Datejs has traveled to many lands and returns with knowledge of over 150 individual Cultures. Supporting your language of choice is simple, just swap out the date.js file for another culture-specific file.
Example
<script type=“text/javascript” src=“date.js”></script>
en-US [English (United States)]
<script type=“text/javascript” src=“date-en-US.js”></script>
de-DE [German (Germany)]
<script type=“text/javascript” src=“date-de-DE.js”></script>
fr-FR [French (France)]
<script type=“text/javascript” src=“date-fr-FR.js”></script>
All 150+ CultureInfo files have been pre-compiled and are available within the same /build/ folder as date.js. Each culture file includes translations for many of the strings used in the Datejs library. Some strings have not been translated, although will be filled in over time as the community contributes.
Step #2 - Start your training
The Datejs library includes many helpful functions for easing the pain of developing with Dates and Times in JavaScript. Once the date.js file has been included into your page you can begin some serious training.
If you have not already done so, we highly recommend installing FireBug for FireFox. Among many things, Firebug allows you to execute custom JavaScript code directly in the browser without having to edit your source page — kind of like a command-line for JavaScript. Get it now. The Ninja waits.
Let’s Get Started
Before diving deep into the library, let’s first limber up with some stretching. Exploring the natural language syntax is a good place to start.
Date.today();
// Add 5 days to today
Date.today().add(5).days();
// Get Friday of this week
Date.friday();
// Get March of this year
Date.march();
// Is today Friday?
Date.today().is().friday(); // true|false
// What day is it?
Date.today().getDayName();
Everything ok? A little out of breath? Soooo sorry.
Now, some Date Assassin exercises.
Date.january().first().monday()
// Get the last Friday of the year
Date.dec().final().fri()
// Set a date to the 15th of the current month at 4:30 PM,
// then add 90 days and make sure that date is a weekday,
// else move to the next weekday.
var d1 = Date.today()
.set({ day: 15, hour: 16, minute: 30 })
.add({ days: 90 })
if (!d1.isWeekday()) {
d1.next().monday();
}
How about letting your users enter a few dates? Say into an <input> field or date picker? Included with the Datejs library is a powerful replacement for the native JavaScript Date parser.
The following examples all start with a String value that we convert into a Date object.
Date.parse(‘today’);
// How about tomorrow?
Date.parse(‘tomorrow’);
// July 8?
Date.parse(‘July 8′);
// With a year?
Date.parse(‘July 8th, 2007′);
// And time?
Date.parse(‘July 8th, 2007, 10:30 PM’);
// Get the date, move to Monday (if not already Monday),
// then alert the date to the user in a different format.
var d1 = Date.parse(‘8-Jul-2007′);
if (!d1.is().monday()) {
d1.last().monday();
}
alert(d1.toString(‘dddd, MMMM d, yyyy’));
The library also includes some Number fun. In order to execute functions directly on JavaScript Number objects, the number must be wrapped in parentheses. This is a requirement of JavaScript. If the number is declared first, the parentheses are not required.
(3).days().fromNow();
// 6 month ago
(6).months().ago();
// 12 weeks from now
var n = 12;
n.weeks().fromNow();
// Get a date 30 days after a user supplied date
var d1 = Date.parse(‘07.15.2007′);
var d2 = (30).days().after(d1);
Step #3 - Refine your skillz
You are nearing a state of Date Ninja-ness, but more experience is required.
Please be sure to check out the following list of resources for further training.
- Datejs at GoogleCode
- Documentation
- Forums
- Downloads
- SVN
The Datejs Library also includes good size Test Suite, which is worth browsing to get a idea of what’s possible.
Hope this helps.
This is outstanding work; hope it takes off! One small thing: on the front page under Syntactic Sugar, I see this:
// What date is next thrusday?
Right, “thrusday” is a typo … but it’d sure be neat if the invisible Datejs ninja caught it….
Comment by Kent Brewster — November 27, 2007 @ 3:01 pm
Very cool stuff!
Nice to see some real date handling in JavaScript.
Any chance of supporting ISO 8601 dates?
http://en.wikipedia.org/wiki/ISO_8601
Import and export.
Thanks!
Comment by Michael Kaply — November 28, 2007 @ 6:31 am
What’s the chance that this will do standard unix time in the near future? What about checking the timezone of the client, and calculating other timezones (unix: PST: next tuesday + 5 years)?
Comment by Issac Kelly — November 28, 2007 @ 6:57 am
Great job on the library! - I believe we met at The Ajax Experience, I still have your card laying around. I’m sure we could collaborate with jQuery UI Datepicker. Once again, great job.
Comment by Marc — November 28, 2007 @ 8:25 am
Your code examples are using curly-quotes.
Comment by Foob — November 28, 2007 @ 2:47 pm
This is really amazing and powerful tool to manipulate date.
Comment by Balasubramanian R — November 28, 2007 @ 9:15 pm
Hi guys,
Thank you for great lib.
My only concert is SQL format for date is YYYY-MM-DD HH:MM:SS
but your lib parses it like YYYY-DD-MM which is not correct.
I tried canada english localization.
Thank you again.
Comment by Alex — November 29, 2007 @ 10:35 am
Great tutorial. You guys rock
Comment by jc — December 2, 2007 @ 10:17 pm
needs a function to return a unix timestamp, unless I missed something — otherwise not very useful for professional developers. looks awesome though, great job
Comment by Michael — December 18, 2007 @ 9:18 am
That’s amazing! Very good work. I put a link on my site and share it to the german webdevelopers.
Cheers
Marc
Comment by Marc — December 20, 2007 @ 7:43 am
[…] Загрузить библиотеку | Как использовать […]
Pingback by Datejs at RIA Revolution — January 23, 2008 @ 7:13 am
Interesting, will have a look at this. The ordering of the dates is really not that big of a problem, since you could easily parse this erverside. Aslong as the year is with 4 digits it really comes down to splitting the sring, and reversing it.
Example:
2008-01-01
01-01-2008
Split the string on “-” and look for the item in array with 4 digits. if not first then reverse array. Surely you should replace all / with -, . with - so your date can handle alot of different input from users.
Comment by Kim Steinhaug — March 8, 2008 @ 8:25 am
Michael
try d.valueOf(); for milliseconds since midnight 01 January, 1970 UTC.
its part of the javascript spec
http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Date:valueOf#Example:_Using_valueOf
Comment by Killerkiwi — March 19, 2008 @ 8:00 pm
Does this still work? Is it supported?
The examples in the “Let’s get Started” do not seem to work —
Date.friday is not a function
is what the error console in Firefox has to say.
Mayank
Comment by Mayank Jain — April 6, 2008 @ 8:15 pm
Or may be there are just more js files to include besides the date.js — the getting started page does not seem to mention it (or did I overlook it) — looking forward to a solution.
Cheers!
M
Comment by Mayank Jain — April 6, 2008 @ 8:32 pm
[…] Zum Starten: http://www.datejs.com/2007/11/27/getting-started-with-datejs/ […]
Pingback by agimatec » Blog Archive » Javascript Framework: heute Datejs — April 15, 2008 @ 12:20 pm
An idea…
That is very cool (and useful), but it actually does the exact opposite of what I’m looking for. Its parsing abilities convert “Next Tuesday” to a date. I’m looking for is the ability to convert a date to a “human scale” output. All the date formatters let you pick any mix of month/day/year/time, but none of them create “natural” dates. For example, to humans “Yesterday” or “Tomorrow” is a lot more descriptive and easier to digest than “05/21/2008″ or even “May 21, 2008″. Then in the next step (for a few days ago), maybe the time of the event matters, but for events that happened three weeks ago, it may not. What I envision is a date formatter that is passed the target date and an optional “comparison” date (which defaults to “now” if it’s omitted), plus an array (?) of format strings and “ranges” (i.e., for dates longer ago than 3 weeks, use this format string; for dates longer ago than 1 year, use this one, etc.); by default, it would use yesterday, today, and tomorrow for dates that fall into that range, with an optional time format string to append.
This isn’t on the top of my to-do list right now, so I may write it when it gets there, unless you should end up doing it in the mean time
Cheers!
Eric
Comment by Eric — May 22, 2008 @ 8:16 am
Hi,
Very Cool Stuff!
Its a good work done!
I went through the Starters Kit.. and have a question.
Say, if the user enters any random date, can that be converted to UTC Time Zone using the date.js lib
Comment by Deepak — May 31, 2008 @ 10:50 pm
Hi
Really cool, thanks!
There is an error when using “days ago” - it works perfectly for some days back (11 days ago) but above 11 it always calculates it as ‘yesterday, 12:00 AM’
Comment by Chris — June 3, 2008 @ 1:18 pm
Hey. I’m now to this and don’t exactly know where to get started . I’ve downloaded the scripts, but was specifically looking for a script to get a date 3 days from now to implement in an online agreement.
Where does the script go, in the section or in the ?
Please advise.
Comment by Bob C — June 17, 2008 @ 1:12 am
[…] Get started with datejs […]
Pingback by datejs - open-source JavaScript Date Library — June 17, 2008 @ 11:18 pm
Absolutely amazing library. I was hoping someone had done something like this!
Comment by Bob S — July 1, 2008 @ 8:21 pm
Impressive. What I am looking for is a very simple extension:
(3).workdays().fromNow() or (3).workdays().ago()
optionally it could take a parameter list of days to skip, or a config with holidays.
Comment by Michiel van der Blonk — July 10, 2008 @ 12:01 pm
I am looking for a same extension as Michiel van der Blonk - I need to figure out future business days. Perl has a great module on cpan, datemanip, which I use for server side coding. Alas, for this requirement, I am working within the confines of a hosted CMS tool which gives little flexibility but to use JavaScript. Guess I can just check day name of returned value until it is a work day.
Comment by Marianne M. — July 17, 2008 @ 1:39 pm