$(document).ready( function() {

	// ---------------------- INITIALIZE ------------------------------

	var fluxCalID = '#fluxCalendar'; // reference element on site
	$.fluxCal = $(fluxCalID);

	var fetchingRecords = false; // tracks if an AJAX request is active

	var weekStr = "";

	$.ajaxSetup({cache:false});

	var debug = 0;
	var mobileBreakPoint = 420;

	// ----------------------------------------------------------------

	if (debug) { 
		$("<div id='debug'></div>")
			.css('position', 'fixed')
			.css('top', '5px')
			.css('right', '45px')
			.css('padding', '5px')
			.css('background-color', '#fff')
			.css('border', '1px solid #000')
			.appendTo('body');
	}

	function loadEvents(){
		var json = null;
		fetchingRecords = true;
		if ($.fluxCal.data('params')) { $.params = '&'+$.fluxCal.data('params'); } else { $.params = ''; }
		if ($.fluxCal.data('pastevents')) { $.pastevents = '&pastevents='+$.fluxCal.data('pastevents'); } else { $.pastevents = ''; }
		$.ajax({
			'async': false,
			'global': false,
			'url': 'http://calendar.instone.com/get.php?cal='+$.fluxCal.data('id')+$.params+'&offset='+$.fluxCal.data('offset')+'&limit='+$.fluxCal.data('limit')+$.pastevents,
			'dataType': "jsonp",
			'success': function(response) {

				if (!response.length==0) { // if we have events to show

					// append new records
					for (i in response) {
						// ------------- calendar template start -----------------

						if (response[i].WeekEnd==1) { dayClass='holiday' } else {dayClass='weekday'}
						if (response[i].LocationName!=0) {locationData="<a href='#'>"+response[i].LocationName+"</a>"} else {locationData='&nbsp;'}
						if (response[i].TravelTime!='') {travelTime=response[i].TravelTime+' minutes'} else {travelTime='&nbsp;'}
						if (response[i].ArriveTimeDT!='') {arriveBy=response[i].ArriveTime} else {arriveBy='&nbsp;'}
						if (response[i].BusTime==null) {response[i].BusTime='';}
						if (response[i].Opponent) {opponent=response[i].Opponent} else {opponent='&nbsp;'}
						if (response[i].Score) {score=response[i].Score} else {score='&nbsp;'}
						// if (response[i].Description) {description="<table class='notesBlck' cellspacing='0'><tr><td>"+response[i].Description+"</td></tr></table>"} else {description=''}
						if (response[i].Description) {description="<div class='cal_notesBlck'>"+response[i].Description+"</div>";} else {description='';}
						if (response[i].PostponedContent) {description="<div class='cal_notesBlck'>"+response[i].PostponedContent+"</div>"}
						if (response[i].Directions==null) {response[i].Directions='';}
						if (response[i].Directions) {directions="<h3>Directions</h3><p>"+response[i].Directions+"</p>";} else {directions='';}
						if (response[i].Phone==null) {response[i].Phone='';}
						if (response[i].PhotoExists==1) {
							locationImg="<img src='/system/calendar/locationphoto.php?id="+response[i].LocationID+"' class='locationPic cal_locPhoto cal_responsive' />";
							photoClass="WithPhoto";
						} else {
							locationImg='';
							photoClass="";
						}

						if (response[i].rsvp.length==4) {
							rsvpStr = "<span class='rsvpY' title='Yes'>"+response[i].rsvp[0]+"</span> <span class='rsvpN' title='No'>"+response[i].rsvp[1]+"</span> <span class='rsvpM' title='Maybe'>"+response[i].rsvp[2]+"</span> <span class='rsvpX'  title='No response yet'>"+response[i].rsvp[3]+"</span>";
						} else {
							rsvpStr = "-";
						}

						if (response[i].MultiDay==1) {
							response[i].Day 		= response[i].StartDay + '-' + response[i].EndDay;
							response[i].DayName	= response[i].StartDayNameShort + '-' + response[i].EndDayNameShort;
							response[i].StTime 	= response[i].MultiStartTime + ' - ' + response[i].MultiEndTime
						}

						if (!$("#calWrap #calTitle").length) {

							subscribeURL = "<a href='http://calendar.instone.com/cadmin/subscription/wizard/"+$.fluxCal.data('id')+"' class='subscribe' target='_blank'>Subscribe</a>";
							
							$("<div id='calManage' class='login'>"+subscribeURL+"<span class='loginLink'> | "+"<a href='http://calendar.instone.com/cadmin' target='_blank'>Login</a></span></div>").appendTo("#calWrap");
							$("<h2 id='calTitle'>"+response[i].calendarName+"</h2>").appendTo("#calWrap");
						}
						
						if ($.fluxCal.data('week')=="show") {
							if (response[i].Week != $.fluxCal.data('weeknum')) {
								weekStr = "<p class='weekNum'>Week "+response[i].Week+"</p>";
							} else {
								weekStr = "";
							}
							$.fluxCal.data('weeknum', response[i].Week);
						}

						if (response[i].Weather.length > 0) {
	weatherwidget = response[i].Weather;
} else {
	weatherwidget = "";
}
calStr = 
	weekStr + 
	"<div id='r"+response[i].AppointmentID+"' class='cal_calendarElm "+response[i].classByStatAndTense+"' >"+
		"<div class='cal_calWrap'>"+
			"<div class='cal_dateBlck cal_"+dayClass+"'>"+
				"<h2>"+
					"<span class='cal_fYearMon'>"+response[i].MonthYear+"</span> <span class='cal_fDayNum'>"+response[i].Day+"</span> <span class='cal_fDayName'>"+response[i].DayName+"</span>"+
				"</h2>"+
				weatherwidget+
			"</div>"+
			"<div class='cal_fieldsBlck'>"+
				"<div class='cal_cell cal_fEventType'>"+
					"<span class='cal_lbl'>"+response[i].EventType+"</span>"+
					"<span class='cal_dta'>"+response[i].Event+"</span>"+
				"</div>"+
				"<div class='cal_cell cal_fTeam'>"+
					"<span class='cal_lbl'>Team</span>"+
					"<span class='cal_dta'>"+response[i].teamNames+"</span>"+
				"</div>"+
				"<div class='cal_cell cal_fTime'>"+
					"<span class='cal_lbl'>Time</span>"+
					"<span class='cal_dta'>"+response[i].StTime+"</span>"+
				"</div>"+
				"<div class='cal_cell cal_fLocation'>"+
					"<span class='cal_lbl'>Location</span>"+
					"<span class='cal_dta'><a href='#'>"+locationData+"</a></span>"+
				"</div>"+
				"<div class='cal_cell cal_fStatus'>"+
					"<span class='cal_lbl'>Status</span>"+
					"<span class='cal_dta'>"+response[i].apntStatus+"</span>"+
				"</div>"+
				description+
				"<div class='cal_descrBlck'>"+
					locationImg+
					"<div class='cal_descr"+photoClass+"'>"+
						"<a class='cal_gmaps' href='"+response[i].MapURL+"' target='_blank'><img src='/system/calendar/image/gmaps64.png' alt='Google Maps'></a>"+
						"<h2>"+response[i].LocationName+"</h2>"+
						"<div class='cal_address'>"+
							response[i].Address+"<br/>"+
							response[i].City+", "+response[i].StateID+" "+response[i].ZIP+"<br/>"+response[i].Phone+
						"</div>"+
						directions+
					"</div>"+
				"</div>"+
			"</div>"+
		"</div>"+
		"<div class='cal_addTo'>"+response[i].addTo+"</div>"+
	"</div>";						
						$(calStr).appendTo("#calWrap");

						// --------------calendar template end   -----------------

					}

					$.fluxCal.data('offset', $.fluxCal.data('offset') + $.fluxCal.data('limit')); // update offset value

					fetchingRecords = false;

					if (debug) { $("#debug").text( $.fluxCal.data('offset') ); }

				} else if ($(".cal_calendarElm").length==0) {
					$("<p class='calFeedback'>There are no future events to show. <a href='http://calendar.instone.com/cadmin' target='_blank'>Login</a></p>").appendTo("#calWrap");
				} else {
					$("<p class='calFeedback'>End of future events.</p>").appendTo("#calWrap");
				}

			}
		});
	}

	if ($.fluxCal.length>0) {// if a fluxcalendar is embedded

		// toggle description box for a calendar event
		// $("body").on('click', ".fLocation a", function(){
		// 	$(".descrBlck").hide();
		// 	$(".descrBlck", $(this).closest('.fieldsBlck')).toggle();
		// 	return false;
		// });
		$("body").on('click', ".cal_fLocation a", function(){
			$(".cal_descrBlck").hide();
			// $(".cal_descrBlck", $(this).closest('.cal_fieldsBlck')).toggle();
			$(".cal_descrBlck", $(this).closest('.cal_fieldsBlck')).css('display','flex');
			return false;
		});

		// triggering reachBottom event
		$(window).scroll( function(){
			if ($(".cal_calendarElm").length != 0) { // if there is an embedded calendar with future events 
				if ( ($(window).scrollTop() - $(".cal_calendarElm").last().offset().top + $(window).height()) > -($(window).height() ) && !fetchingRecords ) {
					$.fluxCal.trigger({type:'reachBottom'}); // trigger event
				}
			}
		});

		// additional load of content
		$(document).on('reachBottom', fluxCalID, loadEvents);

		// initial load of content
		(function(){
			$.fluxCal.empty();
			$("<div id='calWrap'></div>").appendTo(fluxCalID);
			loadEvents();
		})();

	}

});