Posts Tagged ‘javascript’

jQuery Classes – An Object Oriented Approach

Tuesday, April 14th, 2009

MooTools has been my framework of choice for the past couple of years. I’ve worked my way up to using Classes for most of my projects and really liked using the OOP approach. For the past couple of projects, I started using Wordpress as my CMS and every time ended up using jQuery. I was disappointed to find out that it didn’t have the native Class library that MooTools did. Fortunately there are a couple of plugins available to assist with this task:

- A plugin that adds class functionality to jQuery: jQuery-Klass

- John Resig himself wrote this library/plugin: Classy Query

JavaScript ISO8601/RFC3339 Date Parser

Saturday, November 1st, 2008

Updated (bug fix): 2-11-09

In need of a JavaScript function that would parse an ISO8601 compliant date, I came across an attempt (http://delete.me.uk/2005/03/iso8601.html) and rewrote it (because I’m all about reinventing the wheel). My function extends the Date object and allows you to pass in an ISO8601 date (2008-11-01T20:39:57.78-06:00). The function will then return the Date. In the date string argument the dashes and colons are optional. The decimal point for milliseconds is mandatory (although specifying milliseconds isn’t). If a timezone offset is specified, the ‘+’ or ‘-’ sign must be included. This function should also work with iCalendar(RFC2445) formatted dates. If a the date string doesn’t match the format, there will be a final attempt to parse it with the built in Date.parse() method.

Code:


Date.prototype.setISO8601 = function(dString){

var regexp = /(\d\d\d\d)(-)?(\d\d)(-)?(\d\d)(T)?(\d\d)(:)?(\d\d)(:)?(\d\d)(\.\d+)?(Z|([+-])(\d\d)(:)?(\d\d))/;

if (dString.toString().match(new RegExp(regexp))) {
var d = dString.match(new RegExp(regexp));
var offset = 0;

this.setUTCDate(1);
this.setUTCFullYear(parseInt(d[1],10));
this.setUTCMonth(parseInt(d[3],10) - 1);
this.setUTCDate(parseInt(d[5],10));
this.setUTCHours(parseInt(d[7],10));
this.setUTCMinutes(parseInt(d[9],10));
this.setUTCSeconds(parseInt(d[11],10));
if (d[12])
this.setUTCMilliseconds(parseFloat(d[12]) * 1000);
else
this.setUTCMilliseconds(0);
if (d[13] != 'Z') {
offset = (d[15] * 60) + parseInt(d[17],10);
offset *= ((d[14] == '-') ? -1 : 1);
this.setTime(this.getTime() - offset * 60 * 1000);
}
}
else {
this.setTime(Date.parse(dString));
}
return this;
};

Usage:


var today = new Date();
today.setISO8601('2008-12-19T16:39:57.67Z');

MooTools Events Calendar – Web Embeddable Javascript Calendar

Friday, October 3rd, 2008

Month ViewThis is the official release of the unofficial MooTools Events Calendar. It is an embeddable web calendar that was built using the MooTools JavaScript framework. Currently, it is still under development, but may be sufficient for your needs. Check out the project page here: MooTools Events Calendar

-

v0.3.0 (August 5, 2009)

  • Accepts events that span across multiple days
  • MooTools v1.2.3 required.

v0.2.2 (April 11, 2009)

  • Fixed a rendering problem for people outside of the U.S.
  • Added the option for weeks to start on Monday

v0.2.1 (Feb 9, 2009)

  • bug fix – usage error with parseInt(). Events wouldn’t load on the 8th and 9th of a month.
  • HTML allowed in events. This allows for events to link elsewhere.

v0.2.0 (Feb 1, 2009)

  • uses plug-ins or direct loading through the constructor for events
  • uses iCal/ISO 8601 dates/times for event input
  • different style sheets can be used for 3 different sized calendars

v0.1.0 (Oct 3, 2008)

  • month, week, and day views
  • tool tips for month view events (using Tips)
  • scrolling day events for month view (using Scroller)
  • events loaded manually or possibly through a JSON feed