// config はconfig.jsに設定しています。

'use strict';

(function( $ ){

$.fn.calendar = function(options) {

	var defaults = {
		schedElem : $('#sched'),
		api_url : config.api_url
	}

	var events = {
		onDateChange : function() {},
		onMonthChange : function() {},
		onTimeChange : function() {},
		onLoad : function() {}
	}

	var settings = $.extend( {}, defaults, options );

	// declaration
	var _this = this;
	var _selector = this.selector;
	var _schedElem = settings.schedElem;
	var _schedSelector = settings.schedElem.selector;
	var _apiUrl = settings.api_url;
	var _currentDate = null;
	var _nextMonth, _prevMonth;
	var _calendarStatus = {};
	var _weekDaysJP = ['日','月','火','水','木','金','土'];

	// on calendar change date
	$(document).on('change', _selector+' table input[type="radio"]', function(){ calendarSelectDay(); });

	// on sched time change
	//$(document).on('change', _schedSelector+' input[type="radio"]', function(){ schedSeletTime(); });

	// on click prev 
	_this.find('.year_month .prev').on('click', function(){
		_currentDate = _prevMonth;
		ajaxGetCalendar(function(){
			events.onMonthChange();
		});
	});

	// on click next 
	_this.find('.year_month .next').on('click', function(){
		_currentDate = _nextMonth;
		ajaxGetCalendar(function(){
			events.onMonthChange();
		});
	});

	// functions 

	// initialize all
	function init() {
		ajaxGetCalendar(function(){
			calendarSelectDay();
			schedSeletTime();
			events.onLoad();
		});
	}

	// handles on select day
	function calendarSelectDay() {

		_this.find('table td').removeClass('active');
		_this.find('table td input[type="radio"]').each(function(){
			var isChecked = $(this).is(':checked');
			var _parent = $(this).parents('.available');

			if(isChecked) { 
				_parent.addClass('active'); 

				_calendarStatus.day = parseInt($(this).data('day'));
				_calendarStatus.week = $(this).data('week');
				_calendarStatus.weekdayJP = _weekDaysJP[$(this).data('week')];
				_calendarStatus.holiday = $(this).data('holiday');

				setDateText();

 				events.onDateChange(_calendarStatus);
			}
		});

		return false;
	}

	// handles on select sched time
	function schedSeletTime() {

		_schedElem.find('table td').removeClass('active');
		_schedElem.find('table td input[type="radio"]').each(function(){
			var isChecked = $(this).is(':checked');
			var _parent = $(this).parents('.available');

			if(isChecked) {
				events.onTimeChange($(this).val());
				_parent.addClass('active'); 
			}
		});

		return false;
	}

	// handles ajax call for calendar
	function ajaxGetCalendar(_callback) {

		if(!_state.dateRange || _state.dateRange === undefined) { _state.dateRange = null; }

		clearDateText();
		$.ajax({
            type	: "get",
            url		: _apiUrl+'calendar.php',
            data	: {
            	'store_id' : _state.storeId,
            	'plan_id' : _state.planId,
	        	'this_date' : _currentDate,
	        	'date_range' : _state.dateRange
            }
        }).done(function(res){

        	_prevMonth = res.prev_month;
        	_nextMonth = res.next_month;
        	_calendarStatus = {
	        	"day" : res.day,
	        	"month" : res.month,
	        	"year" : res.year,
	        	"week" : res.week
        	}

        	if(!_prevMonth) { _this.find('.year_month .prev').hide(); }
        	else			{ _this.find('.year_month .prev').show(); }

        	if(!_nextMonth) { _this.find('.year_month .next').hide(); }
        	else			{ _this.find('.year_month .next').show(); }

        	renderCalendar(res);
        	_callback();
        }).fail(function(e){
	        console.log(e);
        });

        return false;
	}

	function renderCalendar(res) {
		_state.calendarTimes = [];
		var tableRows = '';
		var tableCell;

		_this.find('.year_month .now').text(res.this_month);
		_this.find('.weekdays').nextAll('tr').remove();

		$.each(res.weeks, function(i, days) {
			tableCell = '';
			
			
			$.each(days, function(i, data) {
				if(data) {

					var tdClass = '';
					if(data['holiday']) 	{ tdClass = ' holiday'; }
					if(data['week'] == 6) 	{ tdClass = ' saturday'; }
					
					if(data.day_type != 0) {
						_state.calendarTimes[data.date_num] = {
							'year' 		: data.year,
							'month' 	: data.month,
							'day'		: data.date_num,
							'holiday' 	: data['holiday']
						};
					}

					if(data.day_type == 1) {
						// 電話
						var img = '<img src="'+_level+'images/reserve/icn_tel_0.png" alt="icn_tel_0" width="30" height="30" />';
						tableCell += '<td class="available'+tdClass+'">\
							<a href="tel:'+_state.storeTel+'">\
									<label>\
									<span>'+data.date_num+'</span>\
									'+img+'\
								</label>\
							</a>\
						</td>';
					}
					else if(data.day_type == 2) {
						var img = '<img src="'+_level+'images/reserve/icn_avail.png" alt="icn_tel_0" width="30" height="30" />';

						tableCell += '<td id="day'+data.date_num+'" class="available'+tdClass+'">\
							<label>\
								<span>'+data.date_num+'</span>\
								'+img+'\
								<input type="radio" data-day="'+data.date_num+'" data-week="'+data.week+'" data-holiday="'+data.holiday+'" name="ご予約日" value="'+data.date+'" />\
							</label>\
						</td>';
					}
					else if(data.day_type == 3) {
						var img = '<img src="'+_level+'images/reserve/icn_triangle.png" alt="icn_tel_0" width="30" height="" />';

						tableCell += '<td id="day'+data.date_num+'" class="available'+tdClass+'">\
							<label>\
								<span>'+data.date_num+'</span>\
								'+img+'\
								<input type="radio" data-day="'+data.date_num+'" data-week="'+data.week+'" data-holiday="'+data.holiday+'" name="ご予約日" value="'+data.date+'" />\
							</label>\
						</td>';
					}
					else if(data.day_type == 0) {
						tableCell += '<td class="'+tdClass+'">\
							<p><span>'+data.date_num+'</span></p>\
							<input type="radio" name="ご予約日" value="0" />\
						</td>';
					}

				}
				else { tableCell += '<td></td>'; }
			});

			tableRows += '<tr>'+tableCell+'</tr>'; 
		});

		_this.find('.weekdays').after(tableRows);
	}

	// public functions
	function setDateText() {

		var dateText = _calendarStatus.year+'年'+_calendarStatus.month+'月'+_calendarStatus.day+'日（'+_calendarStatus.weekdayJP+'）';
		_schedElem.find('.date_text').html(dateText);
	}

	// clears date text
	function clearDateText() {
		_schedElem.addClass('hidden');
		_schedElem.find('.date_text').html(''); 
	}

	// clears calendar
	function clear() {
		_this.find('.weekdays').nextAll('tr').remove(); 
		clearDateText();
	}

	return {
		events : events,
		init : init,
		clear: clear
	};
};
	

})( jQuery );