// global variable to hold all page related variables shared between scripts...
var avalanche = {};

$(
	function() {

		// Make it so that any .prefill text fields behave correctly.
		$(':input.prefill').each(
			function(i) {
				var $this = $(this);
				var originalVal = $this.val();
				$this.bind(
					'focus',
					function() {
						var $this = $(this);
						if ($this.val().toLowerCase() == originalVal.toLowerCase()) {
							$this.val('');
						}
					}
				).bind(
					'blur',
					function() {
						var $this = $(this);
						if ($this.val() == '') {
							$this.val(originalVal);
						}
					}
				);
			}
		);

		// Make collapsible areas work correctly...

		$('.closeonload').removeClass('open').addClass('closed');

		$('.collapsible>h2,.collapsible.dynamic>h3').wrapInner('<a href="#" class="collapsible-toggle"/>');

		$('.collapsible-toggle').bind(
			'click',
			function(e) {
				var $collapsible = $(this).parents('.collapsible');
				if ($collapsible.is('.open')) {
					$collapsible.removeClass('open').addClass('closed');
				} else if ($collapsible.is('.closed')) {
					$collapsible.removeClass('closed').addClass('open');
				}
				this.blur();
				return false;
			}
		);

		// Big intro paragraphs

		$('.big-intro-p>p:first').addClass('intro');

		// Sortable tables

		$.fn.sortableTables = function() {
			return $(this).each(
				function() {
					var headers = {};
					var sortList = [];
					$(this).find('thead th').each(
						function(i) {
							var $th = $(this);
							if ($th.is('.no-sort')) {
								headers[i] = { sorter: false };
							} else if ($th.is('.default-sort')) {
								sortList.push([i, 0]);
							} else if ($th.is('.default-sort-desc')) {
								sortList.push([i, 1]);
							}
						}
					);
					$(this).tablesorter(
						{
							'cssAsc': 'sortby-up',
							'cssDesc': 'sortby-down',
							'cssHeader': 'active',
							'headers': headers,
							'sortList': sortList
						}
					).bind(
						'sortEnd',
						function(e) {
							$('tr', e.target).each(
								function(i) {
									$(this)[i == 0 ? 'addClass' : 'removeClass']('first');
								}
							);
						}
					);
				}
			);
		};

		$('table.sortable').sortableTables();


		// Searchable tables

		$('.table-search-holder').each(
			function(i) {
				var $searchHolder = $(this);
				var $table = $searchHolder.next();
				if ($table.is('table.searchable')) {
					$table.tablesearcher({ input: $searchHolder.find('.table-search') });
					$searchHolder.show();
				}
			}
		);

		// Overlays links..

		$('body').append(
			$('<div id="overlay"><div class="loaded-content" /></div>')
		);

		var loadedContentsByUrl = {};

		$('.lb-holder a[href*=lb=1], a.lightbox').overlay(
			{
				expose: '#000',
				target: '#overlay',
				onBeforeLoad: function() {
					var overlay = this;
					var $loadedContent = this.getContent().find(".loaded-content")
							.empty();

					$('body').addClass('busy');

					var trigg = this.getTrigger();

					var destWidth = trigg.attr('rel') ? this.getTrigger().attr('rel') + 'px' : null;
					if (destWidth == null) {
						if (trigg.is('.lb-two-col')) {
							destWidth = 516;
						} else if (trigg.is('.fullwidth-img')) {
							destWidth = 960;
						}
					}

					var url = this.getTrigger().attr('href');

					if (loadedContentsByUrl[url]) {

						$loadedContent.append(loadedContentsByUrl[url]);

						var $scrollable = $loadedContent.find('.scrollable');
						if ($scrollable.length) {
							setTimeout(
								function() {
									var t = $scrollable.position().top;
									var containerSpace = $(window).height() - 130 - t;
									if (containerSpace < 150) containerSpace = 150;
									var contentHeight = $scrollable.outerHeight() + 20;
									if (contentHeight > containerSpace) { // need to scroll the contents
										$scrollable.height(containerSpace + 'px')
									} else { // shrink the container
										$scrollable.css('height', 'auto');
									}
								}, 100);
						}
						$('body').removeClass('busy');
						return true;
					}

					$('#overlay').css('width', destWidth);

					var extension = url.substring(url.lastIndexOf('.') + 1).toLowerCase();
					switch (extension) {
						case 'jpg':
						case 'jpeg':
						case 'png':
						case 'gif':
							var $img = $('<img class="fullsize-image" />').bind(
								'load.avalanche-overlay',
								function() {
									loadedContentsByUrl[url] = $('<div />').append(
										$('<h1>&nbsp;</h1>'),
										$img
									);
									$('#overlay').css('width', 'auto');
									$loadedContent.css('height', 'auto');
									$img.unbind('.avalanche-overlay');
									overlay.load();
								}
							).attr('src', url);
							break;
						default:
							$.ajax(
								{
									url: url,
									success: function(data, textStatus) {
										loadedContentsByUrl[url] = $('<div />').html(data).find('h1.univers').removeClass('univers').end();
										overlay.load();
									}
								}
							);
					}
					return false;
				}

			}
		);

		// Labels at the top of forms...

		$('.inputs>li:first>label').css('margin-top', '0');

		// Fix data tables which ADX has incorrectly marked up
		// If the first row doesn't have TH nodes then give it a class of "thead".
		// Add a class of "first" to the second row...

		$('table.data').each(
			function() {
				$(this).find('tr').each(
					function(i) {
						var $tr = $(this);
						if (i == 0) {
							if ($tr.find('th').length == 0) {
								$tr.addClass('thead');
							}
						} else {
							$tr.addClass('first');
							return false;
						}
					}
				);
			}
		);

		// Form validation
		if ($.fn.validate) { // if validate plugin is loaded
			$('form').each(
				function(i) {
					$(this).validate(
						{
							highlight: function(element, errorClass) {
								var $p = $(element).addClass(errorClass).parent();
								if ($p.is('li')) {
									$p.addClass('highlight');
								}
							},
							unhighlight: function(element, errorClass) {
								var $p = $(element).removeClass(errorClass).parent();
								if ($p.is('li')) {
									$p.removeClass('highlight');
								}
							},
							invalidHandler: avalanche.formInvalidHandler
						}
					);
				}
			);
		}

		// Tooltips

		$('.tooltip-trigger').tooltip(
			{
				relative: true,
				position: 'bottom left',
				offset: [5, 25],
				effect: 'fade'
			}
		);

		// Bulletin map tooltips

		var travelAdviceData = [
			{
				advice: '~',
				message: '~',
				icon: '0'
			},
			{
				advice: 'Normal Caution',
				message: 'Avalanches are infrequent but possible.  Appropriate conditions for informed backcountry travel.',
				icon: '-200'
			},
			{
				advice: 'Extra Caution',
				message: 'Avalanches will occur with human and other triggers. Avalanche training and experience are essential for safe backcountry travel.',
				icon: '-150'
			},
			{
				advice: 'Not Recommended',
				message: 'Avalanches are occurring frequently. Inappropriate conditions for backcountry travel without extensive avalanche training and experience.',
				icon: '-100'
			},
			{
				advice: 'Extra Caution',
				message: 'Conditions change from good with frozen snow to poor with melted snow. Avalanche training and experience are essential to monitor conditions for safe travel.',
				icon: '-50'
			},
			{
				advice: '~',
				message: '~',
				icon: '0'
			}
		];

		$('#m_bulletin_map area').each(
			function(i) {
				var $area = $(this);
				var $tt = $('#bulletin-tooltip').css('opacity', 0);
				var $regionTitle = $tt.find('h2');
				var $icon = $tt.find('#travel-icon');
				var $advice = $tt.find('li:eq(1) p:first');
				//var $link = $tt.find('a');
				var $message = $tt.find('li:eq(2) p');

				$area.hover(
					function(e) {
						var dangerLevel = $area.attr('rel');
						var data = travelAdviceData[dangerLevel];
						$regionTitle.text($area.attr('alt'));
						$icon.css('background-position', '0 ' + data.icon + 'px');
						$advice.text(data.advice);
						$message.text(data.message);
						//$link.attr('href', $area.attr('href'));
						$tt.stop().show().css({
							'top': (e.pageY + 20) + 'px',
							'left': (e.pageX - 290) + 'px'

						}).fadeTo(300, 1);
					},
					function(e) {
						$tt.stop().fadeOut(200, 0);
					}
				);
			}
		);

		// Homepage calendars

		$('#homepage-calendar').each(
			function() {
				var $calContainer = $(this);
				var $cal = $calContainer.append($('<div/>')).find('>div');
				var dataUri = $calContainer.find('a').remove().attr('href');
				$calContainer.find('a').remove();
				var d = new Date();

				var displayedMonth = d.getMonth();
				var displayedYear = d.getFullYear();
				var firstMonth = displayedYear + '-' + displayedMonth;

				var createCalendar = function(m, y) {
					$.ajax({
						url: '/dataservice.asmx/GetEvents',
						data: '{' +
							'month: ' + (m + 1) + ',' +
							'year: ' + y +
						'}',
						dataType: 'json',
						type: 'POST',
						contentType: 'application/json; charset=utf-8',
						success: function(data, textStatus) {
							eval('a = ' + data.d);
							var events = a.events;
							Date.format = 'yyyy-mm-dd';
							$cal.empty().renderCalendar(
								{
									month: m,
									year: y,
									showHeader: $.dpConst.SHOW_HEADER_NONE,
									renderCallback: function($td, thisDate, month, year) {
										if (thisDate.getDate() == 1) {
											$td
												.text(thisDate.asString('mmm').toUpperCase())
												.addClass('first-of-month');
										} else if (thisDate.isWeekend()) {
											$td.addClass('weekend');
										}

										var todaysEvents = [];
										var d = thisDate.asString();
										for (var i = 0; i < events.length; i++) {
											var event = events[i];
											if (event.date == d) {
												todaysEvents.push(event);
											}
										}
										var event = todaysEvents[0]; // TODO: Will only get the first event per day...
										if (event) {
											var ttStr = '<div class="tooltip tt-narrow"><div class="tooltip-contents">'
												+ '<h3>' + event.name + '</h3>'
												+ '<p>' + event.location + '</p>'
											//+ '<p><a class="arrow-link" href="' + dataUri + '?month=' + (thisDate.getMonth() + 1) + '&year=' + thisDate.getFullYear() + '#' + event.date + '">View Details</a></p>'
												+ '</div></div>';
											var $tip = $(ttStr);
											$cal.after($tip);
											$td
												.addClass('event training')
											/*
											.wrapInner(
											$('<a href="' + event.link + '"/>')
											)*/
												.tooltip(
													{
														tip: $tip,
														relative: true,
														position: 'bottom left',
														offset: [0, 33],
														effect: 'fade'
													}
												);
										}

									}
								}
							);
							displayedMonth = m;
							displayedYear = y;
							$('#month-change>li.prev')[y + '-' + m == firstMonth ? 'addClass' : 'removeClass']('disabled');
							//Date.format = 'mm/dd/yyyy';
						}
					});
				};

				var zeroPad = function(n) {
					return n < 9 ? '0' + n : n;
				}

				$calContainer.append(
					$('<ul id="month-change"/>').append(
						$('<li class="prev disabled">&lt;</li>').bind(
							'click',
							function(e) {
								if (!$(this).is('.disabled')) {
									var destDate = Date.fromString(displayedYear + '-' + zeroPad(displayedMonth + 1) + '-01', 'yyyy-mm-dd').addMonths(-1);
									createCalendar(destDate.getMonth(), destDate.getFullYear());
								}
							}
						),
						$('<li class="next">&gt;</li>').bind(
							'click',
							function(e) {
								var destDate = Date.fromString(displayedYear + '-' + zeroPad(displayedMonth + 1) + '-01', 'yyyy-mm-dd').addMonths(1);
								createCalendar(destDate.getMonth(), destDate.getFullYear());
							}
						)
					)
				);

				createCalendar(displayedMonth, displayedYear);
			}
		);
	}
);