var DateSelector = Class.create();

DateSelector.prototype = {

	initialize: function(id, futureMeetings, futureMeetingDates, options) {
		this.id = id;
		this.datesId = 'dates'
		this.meetings = futureMeetings;
		this.meetingDates = futureMeetingDates;
		this.options = {
			datesToShow:       5,
			buttonId: 		 'change_date_button',
			selectedMeetingId: 'meeting_id',
			click: 			 this.onClick
		}
		Object.extend(this.options, options || {});
		this.currentIndex = 0;
		this.meetingsToDates = { };
		this.datesToMeetings = { };
		for(var i = 0; i < futureMeetings.length; i++) {
			this.meetingsToDates[this.meetings[i]] = this.meetingDates[i];
			this.datesToMeetings[this.meetingDates[i]] = this.meetings[i];
		}
		
		
		$(this.id).innerHTML = 	
			'<div class="head"><h5>SELECT DATE<a href="#" id="close_button" ><img src="/images/ttb/button_close_small.brown.gif" border="0" /></a></h5> </div>' + 
			'<div class="sel_date_right"> <div id="' + this.datesId + '" class="dates"> </div> </div>';
		$('close_button').onclick = this.hide.bind(this);
	},

	currentMeeting: function(){
		return this.meetings[this.currentIndex];
	},

	show: function() {
		Element.hide(this.options.buttonId);
		/* Add a hidden input to keep track of the first meeting in the list. */
		var html = '<input type="hidden" id="firstMeetingInList" value="' + this.currentMeeting() + '"/> <table>';
		var now = new Date();
		var startIndex = this.currentIndex;
		var stopIndex = this.currentIndex + this.options.datesToShow;
		if(stopIndex > this.meetings.length) stopIndex = this.meetings.length;

		/* Create the table rows with links to select those dates. */
		for (var i = startIndex; i < stopIndex; i++) {
			var d = this.meetingDates[i];
            if(this.currentMeeting() == d){
				html += '<tr><td class="currently_selected">' + InviteSchedule.prettyDate(d) + '</td></tr>';		
			} else {
				html += '<tr><td><a href="#" class="date_selector_link" style="color: #155E8D;" id="dateselector_' + d + '" >' + InviteSchedule.prettyDate(d) + '</a> </td></tr>';		
			}
		}
		/* Pad the table so that we don't get rows spaced out in some paginations and squished together in others. */
		var numRows = stopIndex - startIndex;
		if(numRows < this.options.datesToShow) {
			var paddingRows = this.options.datesToShow - numRows;
			for(var i = 0; i < paddingRows; i++){
				html += "<tr> <td> &nbsp; </td></tr>";
			}
		}
		html += '</table>';
		if(startIndex == 0) {
			html += '<div class="nav1"> <div class="prev"> <a href="#" > &nbsp; </div>  ';
		} else {
			html += '<div class="nav1"> <div class="prev"> <a href="#" id="date_selector_prev" > &laquo; Prev </a> </div>  ';
		}
		if(stopIndex == this.meetings.length) {
			html += '<div class="next"><a href="#" > &nbsp; </a></div> </div>';
		} else {
			html += '<div class="next"><a href="#" id="date_selector_next" > Next &raquo; </a></div> </div>';
		}

		$(this.datesId).innerHTML = html;
		if($('date_selector_next')) {
			$('date_selector_next').onclick = this.nextDates.bind(this);
		}
		if($('date_selector_prev')) {
			$('date_selector_prev').onclick = this.prevDates.bind(this);
		}
		var dateLinks = $$('.date_selector_link');
		var callback = this.options.click;
		dateLinks.each( function(link) {
			var meeting = link.id.split('_');
			link.onclick = function() { callback(meeting[1]); }
		});

		Element.show(this.id);
	},


	hide: function() {
		Element.show(this.options.buttonId);
		Element.hide(this.id);
	},

	onClick: function(meeting) {
		alert("You clicked: " + meeting);
	},

	currentlySelectedMeeting: function() {
		$F(selectedMeetingId);
	},

	getStartIndex: function() {
		/* Find the index of the currently displayed meeting. */
		var current = GuestResponse.currentIndex();
		/* If there are not DATES_TO_SHOW meetings to display, then back up a few. */
		var numberMeetingsAfterCurrent = (FUTURE_MEETINGS.length - current);
		if(numberMeetingsAfterCurrent < DATES_TO_SHOW) {
			current = FUTURE_MEETINGS.length - DATES_TO_SHOW;
			if(current < 0) current = 0;
		}
		return current;

	},

	nextDates: function() {
		var newStart = this.currentIndex + this.options.datesToShow;
		if(newStart > this.meetings.length) {
			newStart = this.meetings.length - this.options.datesToShow;
			if(newStart < 0) {
				newStart = 0;
			}
		}
		this.currentIndex = newStart;
		this.show();
		return false;
	},

	prevDates: function() {
		var newStart = this.currentIndex - this.options.datesToShow;
		if(newStart < 0) newStart = 0;
		this.currentIndex = newStart;
		this.show();
		return false;
	},
	
	getMeetingFromDate: function(dateIdx) {
		return this.datesToMeetings[dateIdx];
	}

}