window.addEvent('domready', function() {

	var request = new Request.HTML({
		onSuccess: function(html) {
			var menu = $('sideBarNav').clone();
			$('contentWrapper').set('text', '');
			// console.log(html);
			$('contentWrapper').adopt(html);
			// $('sideBarNav').adopt(menu);
		}
	});

	function sidenavbar () {
		// Adaption IE6
		   if(window.ie6) var heightValue='100%';
		   else var heightValue='';

		   // Selectors of the containers for switches and content
		   var togglerName='.accordion_toggler_';
		   var contentName='.accordion_content_';


		   // Position selectors
			var counter=1;
			var toggler=$$(togglerName+counter);
			var content=$$(contentName+counter);
			var activeElement = 0;



		while(toggler.length>0)
		{
		// console.log(activeElement);
		 // Apply accordion
		var accordionListElements = toggler.get('class');
		activeElement = accordionListElements.indexOf('accordion_toggler_'+counter+' active');

		new Accordion(toggler, content, {
			trigger: 'click',
		    opacity: false,
		    display: activeElement,
		    alwaysHide: true,
			initialDisplayFx:true,
		    onComplete: function() {
		       var element=$(this.elements[this.previous]);
		       if(element && element.offsetHeight>0) element.setStyle('height', heightValue);
		    },
		    onActive: function(toggler, content) {
		       toggler.addClass('open');
		    },
		    onBackground: function(toggler, content) {
		       toggler.removeClass('open');
		    }
		 });

		 // Set selectors for next level
		 counter++;
		 toggler=$$(togglerName+counter);
		 content=$$(contentName+counter);

		}

		$$('#sideBarNav a').each(function(element){
									element.addEvent('click', function(event){
										// event.stop();
										// request.send({url:element.rel})
									})
								}
							);
	}
	function slideshow () {
		var mySlideShow;

		mySlideShow = new SlideShow('imageScroller',{
			delay: 10000,
			autoplay: true
		});
		mySlideShow.addEvent('show', function(slideData){
			$$('#imageScrollerController li')[slideData.previous.index+1].morph('.notActiveImage').removeClass('currentImage');
			$$('#imageScrollerController li')[slideData.next.index+1].morph('.currentImage').addClass('currentImage');
		});
		if ($$('#imageScroller li').length != 10000) {
			var imageScrollerController = new Element('ul',{id:'imageScrollerController'}).inject('imageWrapper');

			new Element('li',{
								html:'<img src="resources/images/imageScrollerLeftArrow.gif" alt="previous picture"/>',
								id:'previousImage',
								events:{
									click: function  (event) {
										mySlideShow.showPrevious();
									}
							}
						}
						).inject(imageScrollerController);

			$$('#imageScroller li').each(function  (element, index) {
				new Element('li',{
									text:index+1,
									events:{
										click: function  (event) {
											mySlideShow.show(index);
										}
									}
								}).inject(imageScrollerController);
			})
			$$('#imageScrollerController li')[1].addClass('currentImage');
			new Element('li',{
								html:'<img src="resources/images/imageScrollerRightArrow.gif" alt="next picture"/>',
								id:'nextImage',
								events:{
									click: function  (event) {
										mySlideShow.showNext();
									}
							}
						}
						).inject(imageScrollerController);
			imageScrollerController.position({
				relativeTo: $('imageScroller'),
				position: 'bottomRight',
			    edge: 'bottomRight',
				offset:{x: -10, y:-6}
			});
		};
	}
	function tourSlideshow () {
		var mySlideShow;
		var items = $$('#recommendedTours>li>div').clone();
		$('recommendedTours').empty();
		var listItem;
		items.each(function  (item, index) {
			if (index%3 == 0) {
				listItem = new Element('li').inject('recommendedTours');
			};
			item.inject(listItem);
		})
		// console.log($('recommendedTours'));

		mySlideShow = new SlideShow('recommendedTours',{
					delay: 10000,
					autoplay: false
					// transition:'pushLeft'
				});

				new Element('li',{
									html:'<img src="resources/images/homePageArrowLeft.gif" alt="previous page"/>',
									id:'previousTour',
									events:{
										click: function  (event) {
											// mySlideShow.resetOptions({
											//   transition: 'pushRight'
											// });
											mySlideShow.showPrevious();
										}
								}
							}
							).inject($('recommendedTours').getParent());

				new Element('li',{
									html:'<img src="resources/images/homePageArrowRight.gif" alt="next page"/>',
									id:'nextTour',
									events:{
										click: function  (event) {
											// mySlideShow.resetOptions({
											//   transition: 'pushLeft'
											// });
											mySlideShow.showNext();
										}
								}
							}
							).inject($('recommendedTours').getParent());
							$('nextTour').position({
											relativeTo: $('recommendedTours').getParent('div'),
											position: 'middleRight',
										    edge: 'upperRight',
											offset:{x: 2, y:-14}
											});
							$('previousTour').position({
											relativeTo: $('recommendedTours').getParent('div'),
											position: 'middleLeft',
										    edge: 'upperLeft',
											offset:{x: -6}
											});
	}
	function createPages(itemsPerPage){
		var pages         = $$('.pagination>ul>li');
		var numberOfPages = 0;
		var lists         = Array();
		pages.each(function (element, index) {
			if (index%5 == 0) {
				lists[numberOfPages] = new Element('ul').inject($$('.pagination')[0]);
				numberOfPages++;
			};
			element.inject(lists[numberOfPages-1]);
		})
		$$('.pagination>ul')[0].destroy();
	}
	function listPagination () {
		var pagination;
		var pages = $$('.pagination ul');
		var paginationController = new Element('ul',{ 'id':'paginationController'}).inject('paginationControllerHolder');
		new Element('li',{
							text:'◀',
							id:'previousPage',
							events:{
								click: function  (event) {
									var currentPage;
									$$('#paginationController li').each(function  (element, index) {
										if (element.hasClass('currentPage')) {
											currentPage = index;
										};
									});
									$$('#paginationController li').removeClass('currentPage');
									if(currentPage == 1){
										currentPage = $$('#paginationController li').length-1;
									}

									var nextItem = $$('#paginationController li')[currentPage].getPrevious('li');
									nextItem.addClass('currentPage');
									pages.each(function  (list) {
										list.setStyle('display', 'none');
									})

									pages[currentPage-2].setStyle('display', 'block');
								}
						}
					}
					).inject('paginationController');

		pages.each(function (element, index) {
			if (index == 0) {
				element.setStyle('display', 'block');
			}else{
				element.setStyle('display', 'none');
			};

			var pagingElement = new Element('li',{
								text:index+1,
								events:{
									click: function  (event) {
										pages.each(function  (list) {
											list.setStyle('display', 'none');
										})
										pages[index].setStyle('display', 'block');
										event.target.getParent().getElements('li').removeClass('currentPage');
										event.target.addClass('currentPage');
 									}
								}
							}).inject(paginationController);
			if (index+1 == 1) {
				pagingElement.addClass('currentPage');
			};
		})
		new Element('li',{
							text:'▶',
							id:'nextPage',
							events:{
								click: function  (event) {
									var currentPage;
									$$('#paginationController li').each(function  (element, index) {
										if (element.hasClass('currentPage')) {
											currentPage = index;
										};
									});

									$$('#paginationController li').removeClass('currentPage');
									if($$('#paginationController li').length == currentPage+2){
										currentPage=0;
									}

									var nextItem = $$('#paginationController li')[currentPage].getNext('li');
									nextItem.addClass('currentPage');
									pages.each(function  (list) {
										list.setStyle('display', 'none');
									})
									pages[currentPage].setStyle('display', 'block');
								}
						}
					}
					).inject('paginationController');
	}
	function handleChange (e) {
		if (e.path == "/") {
			$('exchangableContentArea').getChildren().setStyle('display','none');
			$('exchangableContentArea').getFirst().setStyle('display','block');
			$('subNav').getFirst('li').addClass('active');
		}else{
			$('exchangableContentArea').getChildren().setStyle('display','none');
			$('exchangableContentArea').getChildren().each(function(element){
				if("/"+element.get('id') == e.path){
					element.setStyle('display','block');
				}
			})
			if (e.path == "/map") {
				var latlng = new google.maps.LatLng(4.039618, 22.5);
				var myOptions = {
									zoom: 3,
									center: latlng,
									mapTypeId: google.maps.MapTypeId.ROADMAP
								};
				var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
				var mySpinner = new Spinner('map_canvas');
				mySpinner.toggle();
				loadMapData(map, mySpinner);
			};
		}
	}

	function loadMapData(map, spinner){
		var iconPath = 'resources/images/marker.png';
		var jsonRequest = new Request.JSON({url: 'index.php/site/marker/'+$('map_canvas').get('rel'),
							onSuccess:function (jsonResponse) {
								var bounds = new google.maps.LatLngBounds();
								jsonResponse.each(function  (object, index) {
									if($chk(object)) {
										var markerPosition = new google.maps.LatLng(object.lat, object.long);
										var categoryMarker = new google.maps.Marker({
										      position: markerPosition,
										      map: map,
										      title: object.text,
											  icon: iconPath
										  });

										var infowindow = new google.maps.InfoWindow({
									        content: '<h3>'+object.name+'</h3><p><a class="more" href="'+object.url+'">Find out more about this Property&hellip;</a></p>'
									    });

										google.maps.event.addListener(categoryMarker, 'click', function() {
									      infowindow.open(map,categoryMarker);
									    });
										bounds.extend(markerPosition);
									}


								})
								map.fitBounds(bounds);
							},
							onComplete:function  () {
								spinner.toggle();
							}
		});

		jsonRequest.send();
	}
	function checkFilter (filter, type) {
			// console.log(filter);
			var mySpinner = new Spinner('filterBox');
			var currentSelection;
			var request = new Request.JSON({
				onRequest: function  (jsonResponse) {
					mySpinner.toggle();
					currentSelection = $$('#filterBox option[selected]');
					// console.log(currentSelection);
				},
				onComplete: function  () {

					var selectedCountry = $$('#countryFilter option').indexOf(currentSelection[0]);
					// console.log($$('#countryFilter option')[selectedCountry].set('selected', 'selected'));
					mySpinner.toggle();
				},
				onSuccess: function  (jsonResponse, text) {


					var selectFilter = $('travelInterestFilter').getFirst().clone();
					// $('travelInterestFilter').empty();
					selectFilter.inject('travelInterestFilter');

					jsonResponse.travelInterestFilter.each(function  (object) {
						var curElements = $('travelInterestFilter').getElements('option').get('value');
						if(curElements.indexOf(object.url_title) == -1){
							if (object.url_title == filter) {
								new Element('option',{'value':object.url_title, 'text':object.title, 'selected':'selected'}).inject('travelInterestFilter');
							}else{
								new Element('option',{'value':object.url_title, 'text':object.title}).inject('travelInterestFilter');
							}
						}
					})

					var selectFilter = $('countryFilter').getFirst().clone();

					// $('countryFilter').empty();
					selectFilter.inject('countryFilter');

					jsonResponse.countryFilter.each(function  (object) {
						var curElements = $('countryFilter').getElements('option').get('value');
						if(curElements.indexOf(object.url_title) == -1){
							if (object.url_title == filter) {
								new Element('option',{'value':object.url_title, 'text':object.title, 'selected':'selected'}).inject('countryFilter');
							}else{
								new Element('option',{'value':object.url_title, 'text':object.title}).inject('countryFilter');
							}

						}
					})
					if ($('exchangableContent')) {
						$('exchangableContent').load('ajax/destinationPage/countryFilter/all/all/');
					};
					/*
					if ($('exchangableContent')) {
						$('exchangableContent').load('ajax/destinationPage/countryFilter/' + currentSelection[0].get('value')
																		+ '/travelInterest/' + currentSelection[1].get('value')
																		+ '/duration' + currentSelection[2].get('value'));
					};
					*/
				}
			})
			if(filter) {
				request.send({url:'modules/getSelector/'+type+"/"+filter+"/"});


			}
	}
	function loadFilter () {
		$('countryFilter').addEvent('change',function(){
			checkFilter(this.value, 'destination');
		});

		$('travelInterestFilter').addEvent('change',function(){
			checkFilter(this.value, 'travelInterest');
		});
		$('durationFilter').addEvent('change',function(){
			checkFilter(this.value, 'duration');
		});
	}
	// ==========================
	// = REMOVE THIS LINE LATER =
	// ==========================
	// $('exchangableContent').load('ajax/destinationPage/countryFilter/botswana');

	function DOMFilter () {
		var currentSelection = Array();
		$$('.filterBox select').each(function (element) {
			element.addEvent('change',function(){
				// hide intro text if there is any
				if ($('introText')) {
					$('introText').setStyle('display', 'none');
				};
				$$('.filterBox select option[selected]').each(function  (element, index) {
					currentSelection[index] = element.get('value');
					// console.log(index)
				})
				// $$('#relatedTours li').each(function  (element) {
				// 	element.setStyle('display', 'block');
				// 	if ((!element.hasClass(currentSelection[0]))||(!element.hasClass(currentSelection[1]))||(!element.hasClass(currentSelection[2]))) {
				// 		element.setStyle('display', 'none');
				// 	};
				// })
				var filterSpinner = new Spinner($$('.filterBox')[0]);
				var request = new Request.JSON({
								onRequest: function  () {
									filterSpinner.toggle();
								},
								onComplete: function  () {
									filterSpinner.toggle();
								},
								onSuccess: function(jsonResponse) {
									// ======================================================
									// = get all countries from jsonResponse and parse them =
									// ======================================================
									var countries = $$('.filterBox select')[0];
									var selector  = countries.getFirst().clone();
									countries.empty();
									selector.inject(countries);
									jsonResponse.countryFilter.each(function (country, index) {
										if ($chk(country)) {
											var existingValues = countries.getChildren().get('value');
											if (existingValues.indexOf(country.url_title) == -1) {
												var optionField = new Element('option',{
													'value':country.url_title,
													'text':country.title
												});
												if (currentSelection[0]==country.url_title) {
													optionField.setProperty('selected', 'selected');
												};
												optionField.inject(countries);
											};
										};
									})

									var travelInterests = $$('.filterBox select')[1];
									var selector       = travelInterests.getFirst().clone();
									travelInterests.empty();
									selector.inject(travelInterests);
									jsonResponse.travelInterestFilter.each(function (travelInterest, index) {
										if ($chk(travelInterest)) {
											var existingValues = travelInterests.getChildren().get('value');
											if (existingValues.indexOf(travelInterest.url_title) == -1) {
												var optionField = new Element('option',{
													'value':travelInterest.url_title,
													'html':travelInterest.title
												});
												if (currentSelection[1]==travelInterest.url_title) {
													optionField.setProperty('selected', 'selected');
												};
												optionField.inject(travelInterests);
											};
										};
									})
									$$('.filterBox select option[selected]').each(function  (element, index) {
										currentSelection[index] = element.get('value');
										// console.log(index)
									})
									$$('#relatedTours li').each(function  (element) {
										element.setStyle('display', 'block');
										if ((!element.hasClass(currentSelection[0]))||(!element.hasClass(currentSelection[1]))||(!element.hasClass(currentSelection[2]))) {
											element.setStyle('display', 'none');
										};
									})
								}
							});


				request.send({url:'index.php/modules/getSelector/country/'+currentSelection[0]+"/travelInterest/"+currentSelection[1]+"/duration/"+currentSelection[2]});
			})
		})
	}
	function DOMHotelFilter () {
		var currentSelection = Array();
		$$('.filterBox select').each(function (element) {
			element.addEvent('change',function(){
				// hide intro text if there is any
				// if ($('introText')) {
				// 	$('introText').setStyle('display', 'none');
				// };
				$$('.filterBox select option[selected]').each(function  (element, index) {
					currentSelection[index] = element.get('value');
				})
				// $$('#relatedTours li').each(function  (element) {
				// 	element.setStyle('display', 'block');
				// 	if ((!element.hasClass(currentSelection[0]))||(!element.hasClass(currentSelection[1]))||(!element.hasClass(currentSelection[2]))) {
				// 		element.setStyle('display', 'none');
				// 	};
				// })
				var filterSpinner = new Spinner($$('.filterBox')[0]);

				var request = new Request.JSON({
								onRequest: function  () {
									filterSpinner.toggle();
								},
								onComplete: function  () {
									filterSpinner.toggle();
									// if (numberOfElementAfterFilter == 0) {
										loadPages();
									// };

								},
								onSuccess: function(jsonResponse) {
									// console.log($$('#hotelFilterBox select'));
									/*
									var regions  = $$('#hotelFilterBox select')[1];
									var selector = regions.getFirst().clone();

									regions.empty();
									selector.inject(regions);
									jsonResponse.regionFilter.each(function (region, index) {
										if ($chk(region)) {
											var existingValues = regions.getChildren().get('value');
											if (existingValues.indexOf(region.url_title) == -1) {
												var optionField = new Element('option',{
													'value':region.url_title,
													'text':region.title
												});
												if (currentSelection[1]==region.url_title) {
													optionField.setProperty('selected', 'selected');
												};
												optionField.inject(regions);
											};
										};
									})

									// removing any existing elements because they get loaded va ajax now anyway
									$('relatedTours').empty();
									*/
									$('relatedTours').empty();
								}
							});

				// @info This gets called when a country is selected in the drop down on the places overview template
				var selected = element.getSelected();

				if ($$(selected).getProperty('class') == 'country')
				{
					request.send({url:'index.php/modules/getSelectorHotelAndLodges/country/'+currentSelection[0]+'/region/all/rating/all'});
				}
				else
				{
					var parentCountry = $$(selected).getProperty('class').toString().replace('region parent_', '');
					var region = $$(selected).getProperty('value');

					$$(selected).getProperty('value', parentCountry);
					$$('#destinationFilter').getProperty('value', region);

					request.send({url:'index.php/modules/getSelectorHotelAndLodges/country/' + parentCountry + '/region/'+region+'/rating/all'});
				}
				/*
				if ($$($$(this).getSelected()).hasClass('region'))
				{
				//	var classes = $$($$(this).getSelected()).hasClass('region');
				//	var pieces = classes.toString().split(' ');

				//	alert(pieces);
					//request.send({url:'index.php/modules/getSelectorHotelAndLodges/country/'+currentSelection[0]+'/region/'+currentSelection[0]+'/rating/all'});
				}
				// find a country
				else if ($$($$(this).getSelected()).hasClass('country'))
				{
					alert('country');
					request.send({url:'index.php/modules/getSelectorHotelAndLodges/country/'+currentSelection[0]+'/region/all/rating/all'});
				}
				//request.send({url:'index.php/modules/getSelectorHotelAndLodges/country/'+currentSelection[0]+"/region/"+currentSelection[1]+"/rating/"+currentSelection[2]});
				*/
			})
		})
	}
	if($('filterBox')){
		// loadFilter();
		DOMFilter();
	}
	if($('hotelFilterBox')){
		// loadFilter();
		DOMHotelFilter();
	}
	if ($('imageScroller')) {
		slideshow();
	};
	if ($('sideBarNav')) {
		sidenavbar();
	};

	if ($('recommendedTours')){
		tourSlideshow();
	}
	if ($$('.pagination').length != 0) {
		createPages(5);
		listPagination();
	};
	if ($('exchangableContentArea')) {

		$('subNav').getElements('li>a').each(function  (el) {
			el.addEvent('click', function (e){
				e.stop();
				$$('#subNav li').each(function (listItems){
					listItems.removeClass('active');
				})
				e.target.getParent().addClass('active');
				SWFAddress.setValue(el.get('rel'));
			})
		})

		SWFAddress.addEventListener(SWFAddressEvent.CHANGE, handleChange);
	};
	new DatePicker('.date_toggler', {
		pickerClass: 'datepicker_ge',
		inputOutputFormat: 'F j, Y'
	});
	var quickEnquirySpinner = new Spinner('quickEnquiryBox');
	new FormCheck('quickEnquiry');


	var enquirySpinner = new Spinner('contactForm');
	new FormCheck('contactForm');
	new FormCheck('brochureForm');

		function loadPages () {
			var start        = 0;
			var loadMore;
			var loadLess;
			var desiredPosts = 5;
			var placesSpinner= new Spinner('relatedTours');
			var request      = new Request.HTML({
				method: 'get',
				link: 'cancel',
				noCache: true,
				onRequest: function() {
					$('relatedTours').empty();
					$('relatedTours').setStyle('min-height','50px');
					placesSpinner.toggle();
				},
				onSuccess: function(responseHTML, responseElements) {
					$('relatedTours').adopt(responseHTML);

					var _selected = $$('#countryFilter').getSelected();
					var _country = currentSelection[0];
					var _region = 'all';

					if ($$(_selected).getProperty('class') != 'country')
					{
						_country = $$(_selected).getProperty('class').toString().replace('region parent_', '');
						_region = $$(_selected).getProperty('value');
					}

					if ($('load-more')) {
						loadMore = $('load-more');
						loadMore.addEvent('click',function(){
							start += desiredPosts;
							var currentSelection = Array();
							$$('.filterBox select option[selected]').each(function  (element, index) {
								currentSelection[index] = element.get('value');

							})
							//begin the ajax attempt
							request.send({
								//url: 'index.php/modules/destinationHelper/country/'+currentSelection[0]+'/regions/'+currentSelection[1]+'/rating/'+currentSelection[2]+'/'+start
								url: 'index.php/modules/destinationHelper/country/'+_country+'/regions/' + _region + '/rating/all/'+start
							});
						});
					};
					if ($('load-less')) {
						loadLess = $('load-less');
						loadLess.addEvent('click',function(){
							start -= desiredPosts;
							var currentSelection = Array();
							$$('.filterBox select option[selected]').each(function  (element, index) {
								currentSelection[index] = element.get('value');

							})
							//begin the ajax attempt
							request.send({
								//url: 'index.php/modules/destinationHelper/country/'+currentSelection[0]+'/regions/'+currentSelection[1]+'/rating/'+currentSelection[2]+'/'+start
								url: 'index.php/modules/destinationHelper/country/'+_country+'/regions/' + _region + '/rating/all/'+start
							});
						});
					};

				},
				onFailure: function() {
					// reset the message
					// $('relatedTours').set('text','Oops! Try Again.');
				},
				onComplete: function() {
					placesSpinner.toggle();
					//remove the spinner
					// loadMore.removeClass('activate');
					// $$('#relatedTours li').each(function  (place) {
					// 	console.log(place.isDisplayed());
					// })

				}
			});
			var currentSelection = Array();
			$$('.filterBox select option[selected]').each(function  (element, index) {
				currentSelection[index] = element.get('value');

			})
			//@info This fetches the results for the on page load of the places overview template
			var _selected = $$('#countryFilter').getSelected();
			var _country = currentSelection[0];
			var _region = 'all';

			if ($$(_selected).getProperty('class') != 'country')
			{
				_country = $$(_selected).getProperty('class').toString().replace('region parent_', '');
				_region = $$(_selected).getProperty('value');
			}

			request.send({
						url: 'index.php/modules/destinationHelper/country/'+_country+'/regions/'+_region+'/rating/all/'+start
						//url: 'index.php/modules/destinationHelper/country/'+currentSelection[0]+'/regions/'+currentSelection[1]+'/rating/'+currentSelection[2]+'/'+start
						});


		}
		if ($('posts-container')) {
			loadPages();
		};

});