Implement rough populate method

spec/specs.js

@@ -23,13 +23,13 @@ describe("Initialization", {
     teardownHTML();
   },
 
-  'should push new instances to the Timeframe object': function(){
+  'pushes new instances to the Timeframe object': function(){
     var old_count = Timeframes.length;
     Instance = new Timeframe('calendar');
     value_of(Timeframes.length).should_be(old_count + 1);
   },
 
-  'options sanity check': function(){
+  'options are sane': function(){
     Instance = new Timeframe('calendar', {months: 42});
     value_of(Instance.options.months).should_be(42);
   }
@@ -44,7 +44,7 @@ describe("HTML Scaffolding with default options", {
     teardownHTML();
   },
 
-  'should build the proper buttons': function(){
+  'builds the proper buttons': function(){
     var buttonList = $('calendar_menu');
     value_of(buttonList).should_not_be(null);
     value_of(buttonList.getElement('li a.previous')).should_not_be(null);
@@ -53,7 +53,7 @@ describe("HTML Scaffolding with default options", {
     value_of(buttonList.getElement('li a.next')).should_not_be(null);
   },
 
-  'should build the proper fields': function(){
+  'builds the proper fields': function(){
     var fieldsContainer = $('calendar_fields');
     value_of(fieldsContainer).should_not_be(null);
     value_of(Instance.fields.start).should_not_be(null);
@@ -62,11 +62,11 @@ describe("HTML Scaffolding with default options", {
     value_of(fieldsContainer.getElement('input.end')).should_be(Instance.fields.end);
   },
 
-  'should build out two calendar tables': function(){
+  'builds out two calendar tables': function(){
     value_of(Instance.element.getElements('table').length).should_be(2);
   },
 
-  'should list out the seven days of the week': function(){
+  'lists out the seven days of the week': function(){
     var headings = Instance.element.getElement('table').getElements('th');
     value_of(headings.length).should_be(7);
     value_of(headings[0].get('text')).should_be('S')
@@ -85,9 +85,20 @@ describe("HTML Scaffolding with default options", {
     value_of(headings[6].get('abbr')).should_be('Saturday')
   },
 
-  'should insert 6 rows of tds and 1 row of trs': function(){
+  'inserts 6 rows of tds and 1 row of trs': function(){
     var trs = Instance.element.getElement('table').getElements('tr');
     value_of(trs.length).should_be(7);
+  },
+
+  'fills in the calendars caption': function(){
+    var first_caption = Instance.element.getElements('caption')[0];
+    var second_caption = Instance.element.getElements('caption')[1];
+    value_of(first_caption.get('text').length > 1).should_be(true);
+    value_of(second_caption.get('text').length > 1).should_be(true);
+  },
+
+  'fills in calendar tables with last month and this month': function(){
+
   }
 });
 
@@ -103,7 +114,7 @@ describe("HTML Scaffolding with custom buttons & fields", {
     $('extraHTML').dispose();
   },
 
-  'should build the proper buttons given ids': function(){
+  'builds the proper buttons given ids': function(){
     Instance = new Timeframe('calendar', {
       previousButton: 'ooglyPrevious',
       todayButton: 'ooglyToday',
@@ -120,7 +131,7 @@ describe("HTML Scaffolding with custom buttons & fields", {
     value_of($('ooglyNext').hasClass('next')).should_be(true);
   },
 
-  'should build the proper fields given ids': function(){
+  'builds the proper fields given ids': function(){
     Instance = new Timeframe('calendar', {
       startField: 'ooglyStart',
       endField: 'ooglyEnd'

src/timeframe.js

@@ -31,7 +31,7 @@ var Timeframe = new Class({
   // Keeps an array of the calendar tables available
   calendars: [],
   // Hash containing the start and end fields
-  fields: new Hash(),
+  fields: {},
   // Keeps a running count of how many months are in this.calendars
   months: 0,
 
@@ -52,8 +52,15 @@ var Timeframe = new Class({
     this.element.adopt(new Element('div', {id: this.element.id + "_container"}))
 
     this.options.months.times(this.createCalendar.bind(this));
+
+    this.date = new Date();
+    this.populate();
   },
 
+  /*
+    Function: createCalendar
+    Creates a new blank calendar table (for a month)
+  */
   createCalendar: function(){
     // Create a base table
     var calendar = new Element('table', {
@@ -63,7 +70,6 @@ var Timeframe = new Class({
     // Insert a <caption>
     var caption = new Element('caption');
     calendar.adopt(caption);
-    calendar.set('caption', caption);
 
     // Insert the headings
     var thead = new Element('thead')
@@ -93,6 +99,61 @@ var Timeframe = new Class({
     this.months = this.calendars.length;
   },
 
+  /* 
+    Function: destroyCalendar
+    Removes the last calendar from the array
+  */
+  destroyCalendar: function(){
+    this.calendars.pop();
+    this.months = this.calendars.length;
+  },
+
+  /*
+    Function: populate
+    Populates the active calendars with date numberss
+  */
+  populate: function(){
+    var month = this.date.neutral();
+    month.setDate(1);
+    this.calendars.each(function(calendar){
+      calendar.getElement('caption').set('text', this.options.monthNames[month.getMonth()] + ' ' + month.getFullYear());
+
+      // Setup the iterator and setup inactive to know it's before the month
+      var iterator = new Date(month);
+      var offset = (iterator.getDay()  - this.options.weekOffset) % 7;
+      var inactive = offset > 0 ? 'pre beyond' : false;
+      iterator.setDate(iterator.getDate() - offset);
+      if (iterator.getDate() > 1 && !inactive){
+        iterator.setDate(iterator.getDate() - 7);
+        if (iterator.getDate() > 1) inactive = 'pre beyond';
+      }
+
+      calendar.getElements('td').each(function(dayCell){
+        var date = new Date(iterator);
+        dayCell.set({
+          'date': date,
+          'text': date.getDate(),
+          'class': inactive || 'active'
+        });
+        if ((this.options.earliest && date < this.earliest) || (this.latest && date > this.latest)){
+          dayCell.addClass('unselectable');
+        }else{
+          dayCell.addClass('selectable');
+        }
+        if (iterator.toString() === new Date().neutral().toString()) dayCell.addClass('today');
+        dayCell.set('baseClass', dayCell.get('class'));
+
+        // Iterate one day and add class if it's beyond the month
+        iterator.setDate(iterator.getDate() + 1);
+        if (iterator.getDate() == 1) inactive = inactive ? false : 'post beyond';
+      }, this);
+
+      // Iterate to the next month
+      month.setMonth(month.getMonth() + 1);
+    }, this);
+  },
+
+  // Internal function to create buttons used for calendar navigation
   _buildButtons: function(){
     var buttons = new Hash({
       previous: { label: '&larr;', element: $(this.options.previousButton) },
@@ -116,6 +177,7 @@ var Timeframe = new Class({
     this.element.grab(buttonList, 'top')
   },
 
+  // Internal function to build the fields used for start/end dates
   _buildFields: function() {
     var fieldsContainer = new Element('div', {id: this.element.id + '_fields', 'class': 'timeframe_fields'});
     this.fields.each(function(element, key){
@@ -134,4 +196,10 @@ var Timeframe = new Class({
 
     // TODO: this.parseField('start').refreshField('start').parseField('end').refreshField('end').initDate = new Date(this.date);
   }
+});
+
+$extend(Date.prototype, {
+  neutral: function() {
+    return new Date(this.getFullYear(), this.getMonth(), this.getDate(), 12);
+  }
 });