var hotels = {
	// Various settings needed by the singleton.
	// Note: In this case, some of the information may be stored in the global var window.fiteness
	settings: {
		bookingURL: 'http://www.starwoodhotels.com/sheraton/search/ratelist.html?propertyID=%PROPID%'
	}, // END settings
	
	
	
	// Selectors for the html elements used by the singleton
	elements: {
		container: '#hotels',
		individual: '.hotel',
		regions: '#region',
		countries: '#country',
		cities: '#city',
		reset: '#resetFilterLink',
		hotelImage: '.hotelImage',
		bookNowLink: '.bookNowLink',
		hotelHeading: 'h3'
	}, // END elements
	
	
	
	/*
	 * init()
	 * 
	 * Initialize the singleton.
	 */
	init: function(){
		var that = this;
		
		// Disable/reset dropdowns for now
		$(that.elements.regions).attr({ disabled: 'diabled' });
		$(that.elements.countries).attr({ disabled: 'disabled' });
		$(that.elements.cities).attr({ disabled: 'disabled' });
		
		// Assign the previously fetched data to a local variable.
		that.data = window.fitness.hotelData;
		
		// Process the returned html making any necessary changes/additions.
		that.processData();
		
		// Show all hotels.
		that.show();
		
		// Create all needed event handlers and populate dropdowns
		that.createHandlers();
		that.popluateRegions();
	}, // END init()
	
	
	
	/* FUNCTIONS IN ALPHABETICAL ORDER ****/
	
	
	
	/*
	 * createHandlers()
	 * 
	 * Create all the needed event handlers for the singleton
	 */
	createHandlers: function(){
		var that = this;
		
		// Each handler calls unbind first in order to make sure we don't pile
		// up handlers since each time the section is loaded init is called.
		
		// Change handler for region dropdown
		$(that.elements.regions).unbind().live('change', function() {
			$(this).blur();
			
			that.resetCountries();
			that.resetCities();
			
			that.selectedRegion = $(this).val();
			
			that.populateCountries();
			that.show();
		});
		
		// Change handler for country dropdown
		$(that.elements.countries).unbind().live('change', function() {
			$(this).blur();
			
			that.resetCities();
			
			that.selectedCountry = $(this).val();
			
			that.populateCities();
			that.show();
		});
		
		// Change handler for city dropdown
		$(that.elements.cities).unbind().live('change', function() {
			$(this).blur();
			
			that.selectedCity = $(this).val();
			that.show();
		});
		
		// Click handler for reset link
		$(that.elements.reset).live('click', function() {
			that.resetCountries();
			that.resetCities();
			
			$(that.elements.regions).val('');
			that.selectedRegion = '';
			
			that.show();
		});
	}, // END createHandlers()
	
	
	
	/*
	 * populateCities()
	 * 
	 * Populate the city dropdown with cities for the selected region and country
	 */
	populateCities: function() {
		var that = this;
		
		var cityObj = {};
		var cityArray = [];
		
		// Filter the data based on the selected region/country and add each city to the object as a key resulting in an
		// object with keys representing a unique list of cities for the selected region/country
		$(that.data).filter('[country="' + that.selectedCountry + '"]').each(function() {
			cityObj[$(this).attr('city')] = '';	
		});
		
		// Iterate over the object pushing each key onto the array resulting an array containing the unique city names for the selected region/country
		for (city in cityObj) {
			cityArray.push(city);
		}
		cityArray.sort();
		
		// Rest the city dropdown to it's initial state
		that.resetCities();
		
		// Create an option for each city in the array.
		for (var i = 0; i < cityArray.length; i++) {
			$(that.elements.cities).append(
				$('<option>')
					.attr({
						value: cityArray[i]
					})
					.text(cityArray[i])
			);
		}
		
		// Enable the city dropdown.
		$(that.elements.cities).removeAttr('disabled');
		
		// If there is only 1 city for the selected region/country, auto select it
		if (cityArray.length == 1) {
			// setTimeout for IE6 compatibility
			setTimeout(function() {
				$(that.elements.cities).val(cityArray[0]);
			}, 1);
		}
	}, // END populateCities()


	
	/*
	 * populateCountries()
	 * 
	 * Populate the country dropdown with countries for the selected region.
	 */
	populateCountries: function() {
		var that = this;
		
		var countryObj = {};
		var countryArray = [];
		
		// Add each country to the object as a key resulting in an object with keys representing a unique list of countries from the data.
		$(that.data).filter('[region="' + that.selectedRegion + '"]').each(function() {
			countryObj[$(this).attr('country')] = '';
		});
		
		// Iterate over the object and push eack key onto the array resulting in an array containing unique country names for the region.
		for (country in countryObj) {
			countryArray.push(country);
		}
		countryArray.sort();
		
		// Reset the country dropdown to it's initial state.
		that.resetCountries();
		
		// Create an option element for each country in the array.
		for (var i = 0; i < countryArray.length; i++) {
			$(that.elements.countries).append(
				$('<option>')
					.attr({
						value: countryArray[i]
					})
					.text(countryArray[i])
			);
		}
		
		// Enable the country dropdown
		$(that.elements.countries).removeAttr('disabled');
		
		// Make sure country/city vars are not set
		that.selectedCountry = '';
		that.selectedCity = '';
		
		// If only 1 country exists, auto select it
		if (countryArray.length == 1) {
			// setTimeout is for IE6 compatibility
			setTimeout(function(){
				$(that.elements.countries).val(countryArary[0]);
			}, 1);
		}
	}, // END populateCountries()
	
	
	
	/*
	 * populateRegions()
	 * 
	 * Populate the region dropdown with regions from the data.
	 */
	popluateRegions: function() {
		var that = this;
		
		var regionObj = {};
		var regionArray = [];
		
		// Add each region to the object as a key resulting in an object with keys representing the unique region names from the data.
		that.data.each(function() {
			regionObj[$(this).attr('region')] = '';
		});
		
		// Iterate over the object and push each key onto the array as a value resulting in a array containing unique region names.
		for (region in regionObj) {
			regionArray.push(region);
		}
		regionArray.sort();
		
		$(that.elements.regions).empty().append('<option value="">Region: All</option>');
		
		// Add an option to the dropdown for each region
		for (var i = 0; i < regionArray.length; i++) {
			$(that.elements.regions).append(
				$('<option>')
					.attr({
						value: regionArray[i]
					})
					.text(regionArray[i])
			);
		}
		
		// Enable the drop down.
		$(that.elements.regions).removeAttr('disabled');
		
		// Make sure nothing is in the selected region var
		that.selectedRegion = '';
		
		// If there's only 1 region, auto select it
		if (regionArray.length == 1) {
			// setTimeout is for IE6 compatibility
			setTimeout(function(){
				$(that.elements.regions).val(regionArray[0]);
			}, 1);
		}
	}, // END populateRegions()
	
	
	
	/*
	 * processData()
	 * 
	 * Iterate of the data set to prepare it for use.
	 */
	processData: function() {
		var that = this;
		
		that.data.each(function(){
			var $heading = $(that.elements.hotelHeadings, this);
			var headingText = $heading.text();
			var bookingURL = that.settings.bookingURL.replace('%PROPID%', $(this).attr('id'));
			
			// Wrap the heading, hotel image and booking buttons in links to the booking engine.
			$heading.empty();
			$heading.append(
				$('<a>')
					.attr({
						href: bookingURL,
						target: '_blank'
					})
					.text(headingText)
			);
			
			$(that.elements.hotelImage, this).wrap(
				$('<a>')
					.attr({
						href: bookingURL,
						target: '_blank'
					})
			);
			
			$(that.elements.bookNowLink, this).attr({
				href: bookingURL,
				target: '_blank'
			});
			
			// Copy some data to attributes for filtering convenience
			$(this).attr({
				country: $('.country', this).text(),
				city: $('.city', this).text()
			});
			
		});
	}, // END processData()
	
	
	
	/*
	 * resetCities()
	 * 
	 * Reset the city dropdown to it's initial state in preparation for population.
	 */
	resetCities: function() {
		var that = this;
		
		that.selectedCity = '';
		
		$(that.elements.cities)
			.empty()
			.attr({ disabled: 'disabled' })
			.append('<option value="">City: All</option>');
	}, // END resetCities()
	
	
	
	/*
	 * resetCountries()
	 * 
	 * Reset the country dropdown to it's initial state in preparation for population.
	 */
	resetCountries: function() {
		var that = this;
		
		that.selectedCountry = '';
		
		$(that.elements.countries)
			.empty()
			.attr({ disabled: 'disabled' })
			.append('<option value="">Country: All</option>');
	}, // END resetCountries
	
	
	
	/*
	 * show()
	 *
	 * Display the list of hotels filted by the user input.
	 */
	show: function(){
		var that = this;
		var filtered = that.data;
		
		// Conditionally filter the whole set of hotels based on the value of the dropdowns.
		if (that.selectedRegion) {
			filtered = filtered.filter('[region="' + that.selectedRegion + '"]');
		}
		
		if (that.selectedCountry) {
			filtered = filtered.filter('[country="' + that.selectedCountry + '"]');
		}
		
		if (that.selectedCity) {
			filtered = filtered.filter('[city="' + that.selectedCity + '"]');
		}
		
		$(that.elements.container).empty();
		
		// Append each hotel in the filtered set to the DOM
		filtered.each(function(){
			$(this).appendTo(that.elements.container);
		});
	}, // END show()
	
	
	
	/*
	 * This is just here so you don't have to worry about the trailing , (comma) on the last item.
	 */
	dummy: ''
	
}; // END hotels()