var rbCalendar = {

	months : ['January','February','March','April','May','June','July','August','September','October','November','December'],
	days : ['Sun','Mon','Tue','Wed','Fri','Sat'],
	today : null,
	month : null,
	widgets : null,
	selected_day : null,

	init : function () {
		rbCalendar.today = new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate());
		rbCalendar.month = new Date(new Date().getFullYear(), new Date().getMonth(), 1);
		rbCalendar.widgets = $$('.calendar_widget');
		rbCalendar.widgets.each(function (element) {
			rbCalendar.drawCalendar(element, rbCalendar.today.getFullYear(), rbCalendar.today.getMonth());
		})
		$$('.calendar_widget_input').each(function (element) {
			element.hide();
		})
	},

	drawCalendar : function (element, year, month) {
		element = $(element);
		var current_month = new Date(year, month, 1);
		var first_day = current_month.getDay();
		var previous_month = new Date(year, month - 1, 1);
		var next_month = new Date(year, month + 1, 1);
		var month_length = 32 - new Date(year, month, 32).getDate();
		var cells = Math.ceil((first_day + month_length) / 7) * 7;
		
		output = '';

		output += '<div class="month_selector"><ul>'
		if (current_month > rbCalendar.today) { output += '<li class="month_previous"><a href="javascript:rbCalendar.drawCalendar(\'' + element.id + '\',' + previous_month.getFullYear() + ',' + previous_month.getMonth() + ');" title="Click for the previous month"><span>Previous Month</span></a></li>'; } else { output += '<li class="month_previous"></li>'; }
		output += '<li class="month_current"><a href="javascript:rbCalendar.drawCalendar(\'' + element.id + '\',' + rbCalendar.month.getFullYear() + ',' + rbCalendar.month.getMonth() + ');" title="Click to return to the current month"><span>' + rbCalendar.months[current_month.getMonth()] + ' ' + current_month.getFullYear() + '</span></a></li>';
		output += '<li class="month_next"><a href="javascript:rbCalendar.drawCalendar(\'' + element.id + '\',' + next_month.getFullYear() + ',' + next_month.getMonth() + ');" title="Click for the next month"><span>Next Month</span></a></li></ul><br class="clear" /></div>';
		output += '<table class="date_selector"><thead><tr><th>Sun</th><th>Mon</th><th>Tue</th><th>Wed</th><th>Thu</th><th>Fri</th><th>Sat</th></tr></thead><tr class="odd">';

		for (var i = 1; i <= cells; i++) {
			if (i%7 == 1 && i > 1) { if ((i-1)%2 == 0) { output += '</tr><tr class="odd">'; } else { output += '</tr>\n<tr>'; } }
			current_day = i - first_day;
			if (current_day > 0 && current_day <= month_length) {
				current_date = new Date(year, month, current_day);
				
				anchor_class = '';
				if (current_date.toString() == rbCalendar.today.toString()) { anchor_class += ' today'; }
				if (current_date.toString() == $(element.id + '_input').value) { anchor_class += ' selected'; }

				if (current_date > rbCalendar.today) {
					output += '<td><a href="javascript:rbCalendar.selectDate(\'' + element.id + '\',\'' + new Date(year ,month ,current_day).toString() + '\');" class="' + anchor_class + '">' + current_day +'</a></td>';
				} else {
					output += '<td><span class="' + anchor_class + '">' + current_day +'</span></td>';
				}
			} else {
				output += '<td></td>';
			}
		}
		output += '</tr></table>';

		element.innerHTML = output;
	},

	selectDate : function (element, date) {
		$(element + '_input').value = date;
		rbCalendar.drawCalendar(element, new Date(date).getFullYear(), new Date(date).getMonth())
	}

}

Event.observe(window, 'load', rbCalendar.init);


var rbAppointment = {

	current_store : null,
	
	init : function () {
		$('ap_location').observe('change',rbAppointment.changeLocation);
		$('ap_location').observe('keyup',rbAppointment.changeLocation);
	},
	
	changeLocation : function () {
		if (this.value == 0) {
			if (rbAppointment.current_store) {
				$('ap_store_' + rbAppointment.current_store).hide();
			}
			rbAppointment.current_store = null;
		} else {
			if (rbAppointment.current_store) {
				$('ap_store_' + rbAppointment.current_store).hide();
			}
			rbAppointment.current_store = this.value;
			$('ap_store_' + rbAppointment.current_store).show();
		}
	},
	
	submit : function () {
		var form_errors = [];
		var email_filter = /^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i;
		
		$$('input').each(function (element) {
			element.removeClassName('alert');
		})
		
		if ($('ap_first_name').value == '') { form_errors[form_errors.length] = 'First Name'; $('ap_first_name').addClassName('alert'); }
		if ($('ap_last_name').value == '') { form_errors[form_errors.length] = 'Last Name'; $('ap_last_name').addClassName('alert'); }
		if ($('ap_area_code').value.length < 3 || $('ap_phone_1').value.length < 3 || $('ap_phone_2').value.length < 4) { form_errors[form_errors.length] = 'Phone Number'; $('ap_area_code').addClassName('alert'); $('ap_phone_1').addClassName('alert'); $('ap_phone_2').addClassName('alert'); }
		if (!email_filter.test($('ap_email').value)) { form_errors[form_errors.length] = 'E-mail Address'; $('ap_email').addClassName('alert'); }
		if ($('ap_location').value == '0') { form_errors[form_errors.length] = 'Preferred Location'; $('ap_location').addClassName('alert'); }
		if ($('ap_calendar_input').value == '') { form_errors[form_errors.length] = 'Preferred Date'; }
		
		if (form_errors.length > 0) {
			$('ap_error_list').innerHTML = '<strong>' + form_errors.join(', ') + '</strong>';
			$('ap_alert').appear();
			if (window.parent.popup) {
				window.parent.popup.scroll();
			}
		} else {
			if (window.parent.popup) {
				window.parent.popup.scroll();
			}
			$('ap_form').submit();
		}
	}
}

Event.observe(window, 'load', rbAppointment.init);