var currency_symbols = ({ "AUD":"A$",			"GBP":"£",			"CAD":"C$",			"CNY":"元",
																"EUR":"€",			"HKD":"HK$",		"INR":"Rs",			"IDR":"Rp",
																"ILS":"₪",			"JPY":"¥",			"KRW":"₩",			"MYR":"RM",
																"NZD":"NZ$",		"PKR":"Rs",			"PHP":"Php",		"RUB":"руб",
																"SAR":"﷼",			"SGD":"S$",			"ZAR":"R",			"SEK":"kr",
																"CHF":"SFr",		"TWD":"元",			"THB":"฿",			"USD":"$",
																"AED":" د.إ ",	"VND":"₫",			"ORG":"" });


// get the seleted option in the popular country dropdown	
// var pop_country = $('#popular_countries').find('option:selected').attr('val');
// get the seleted option in the popular city dropdown	
// var pop_city = $('#popular_cities').find('option:selected').attr('val');

var pop_page = 1;

$.ajaxSetup(
{ 
  timeout: 10000,
	beforeSend: function() {
		$('#popular_hotels_module h2').addClass('popLoader');
	},
  error: function(xhr) { }
});

var pop_preset = [ { 'country' : 'thailand',				'city' : 'bangkok'			, 'name' : 'Bangkok'			},
									 { 'country' : 'china',						'city' : 'hong-kong'	 	, 'name' : 'Hong Kong'		},
									 { 'country' : 'indonesia',				'city' : 'bali'				 	, 'name' : 'Bali'					},
									 { 'country' : 'malaysia',				'city' : 'kuala-lumpur'	, 'name' : 'Kuala Lumpur'	},
									 { 'country' : 'taiwan',					'city' : 'taipei'				, 'name' : 'Taipei'				},
									 { 'country' : 'thailand',				'city' : 'phuket'				, 'name' : 'Phuket'				},
									 { 'country' : 'philippines',			'city' : 'manila'				, 'name' : 'Manila'				},
									 { 'country' : 'united-kingdom', 	'city' : 'london'				, 'name' : 'London'				} ];

var pop_random = Math.floor(Math.random()*pop_preset.length);	

$().ready(function(){

	var pop_country = '';
	var pop_city = '';

	load_pop_country();

	// set default
	
	get_popular_hotels('#popular_hotels', pop_preset[pop_random]['country'].toLowerCase(), pop_preset[pop_random]['city'].toLowerCase(), pop_page);

	$('#popular_hotels_module h2 strong').text( pop_preset[pop_random]['name'] );
	
	$('#popular_hotels_module #hotel_city strong').text( pop_preset[pop_random]['name'] );

	
	$('#pop_all').attr('href', '/hotels/' + pop_preset[pop_random]['country'] + '/' + pop_preset[pop_random]['city'] );	
	
	$('#pop_prev, #pop_next').click(function(){		

		if ( $('#popular_cities').attr('disabled') == 'disabled' ) {
			pop_country = $('#popular_countries').find('option:selected').attr('val');
			pop_city = $('#popular_cities').find('option:selected').attr('val');
		} else {
			pop_country = pop_preset[pop_random]['country'];
			pop_city = pop_preset[pop_random]['city'];
		}
				
		// paginate only if the link clicked is not disabled		
		if( $(this).hasClass('disabled') == false ) {
			pop_paginate($(this).attr('id'), pop_country, pop_city );
		}
		
		return false;
		
	});
		
	$('#popular_countries').change(function(){		
			
		// set pagination to default
		pop_page = 1;
		
		// enable the popular city dropdown
		$('#popular_cities').attr('disabled', '');
		
		$('#pop_next').removeClass('disabled');

		load_pop_city( $('#popular_countries').find('option:selected').attr('val') );		
		
	});

	$('#popular_cities').change(function(){

		$('#pop_next').removeClass('disabled');
		
		// set pagination to default
		pop_page = 1;

		// get the country and city dropdown values
		pop_country = $('#popular_countries').find('option:selected').attr('val');
		pop_city = $('#popular_cities').find('option:selected').attr('val');

		// assign the show all link to a static /hotels/{country}/{city}
		$('#pop_all').attr('href', '/hotels/'+pop_country+'/'+pop_city);	

		// rebuild the top 10 list with the new city name
		get_popular_hotels( '#popular_hotels', pop_country.toLowerCase(), pop_city.toLowerCase(), pop_page );
		
		
		// change the title of the Most Popular Hotels: {city name}
		$('#popular_hotels_module h2 strong').text( $('#popular_cities').find('option[val='+pop_city+']').text() );
		$('#popular_hotels_module #hotel_city strong').text( $('#popular_cities').find('option[val='+pop_city+']').text() );
		
	});
		
}); // end dom ready

/**
 * Paginate: Prev and Next 10 Popular Hotels
 * -------------------------------------------------------
 * @param: element to add the li's in to {can be an UL or an OL}
 *         pop_country and pop_city
 * @desc:
 *       always reference a global variable pop_page
 *       do not allow prev if pop_page = 1
 *       do not allow next if pop_page = 5
 *       otherwise just add to pop_page or remove from pop_page
 *       rebuild the top 10 based on the pop_page
 */

function get_popular_hotels(el, pop_country, pop_city) {

	// initialize the popular URL
	// note: checks the current page from global var pop_page
	var pop_url = '/hotels/'+pop_country+'/'+pop_city+'.js?sort=satisfaction&display_currency='+currency+'&order=desc&per_page=10&page=' + pop_page;

	// get the JSON data
	$.getJSON( pop_url, function(data) {

		// if( data.size() == 0 )
		// {
		// 	pop_paginate('#pop_prev');
		// 	return false;
		// }

		$('#popular_hotels_module h2').removeClass('popLoader');

		// number of data items
		var data_count = 0;

		// initialize the hotels
		var popular_hotels = '';
		
		// initialize the pop_class, will be used as a reference to know it a hotel has satisfaction rating
		var pop_class = '';

		var item_price = '';
		var item_currency = '';
		var item_rating = '';		

		// loop through each data object from the JSON data
   	$.each(data, function(i, item) {
				
			// increment data count
			data_count++;
			
			if (item.best_rates[0] == undefined || item.best_rates == undefined) {
				item_price = '--';
				item_currency = '';			
			} else {
				item_price = Math.round(item.best_rates[0].amt);
				item_currency = item.best_rates[0].cc;			
			}
			
			// if there is no satisfaction rating, pop_class = 'no_satisfaction'
			if (item.satisfaction == 0) {
				pop_class = 'no_satisfaction';
				item_rating = '--';
			} else {
				pop_class = '';
				item_rating = Math.round(item.satisfaction*10)/10;
			}
			
			// build the hotel list
			popular_hotels += '<li class="' +
												pop_class + '">' +
												// '<span class="list_index">' + item.rank + '.</span>' +
												'<a href="'+
												item.url + '">' +
												item.name +
												'</a>' +
												
												// get satisfaction rating:
												// '<em title="get satisfaction rating">' + 												
												// Math.round(item.satisfaction*10)/10 +
												// '<span style="width:' +
												// (64-(item.satisfaction*64/5)) +
												// 'px"></span></em>' + 
												
												'<em title="get satisfaction rating">' + 												
												item_rating +												
												'</em>' + 
																								
												// best rates:
												'<span title="best_rates">' +
												item_currency + ' ' +
												item_price +
												'</span>' +
												'</li>';
						
		});


		// finally put the hotel list on the element
		$(el).html(popular_hotels);
	
		// if data count is less than 10, it is assumed that there is no more page
		if (data_count < 10) $('#pop_next').addClass('disabled');

	});

} // end function get_popular_hotels

/**
 * Load Popular Countries
 * -------------------------------------------------------
 * @param: none
 * @desc:
 *       get's the data object from the JSON data from /hotels/countries/list.js
 *       for each of the items in the data object get item.permalink and item.name  
 *       populate the country dropdown
 *       disable the popular cities dropdown
 */

function load_pop_country() {	

	// initialize the popular countries URL
	var pop_country_url = '/hotels/countries/list.js';

	// get the JSON data
	$.getJSON( pop_country_url, function(data) {

		$('#popular_hotels_module h2').removeClass('popLoader');

		// initialize the options
		var pop_options = '';

		// loop through each object 'item' in the JSON data
   	$.each(data, function(i, item) {
			// get object properties: item.permalink (for url building) and item.name (for display text)
			// build the option element for each item
			pop_options += '<option val="' + item.permalink + '">' + item.name +  '</option>';						
		});

		// finally insert the options to the popular city dropdown
		// also, insert 'Select a Country' as the first option			
		$('#popular_countries').html('<option selected="selected">Select a Country</option>' + pop_options);
		// disable the popular cities dropdown
		$('#popular_cities').attr('disabled', 'disabled');
		
	});
	
} // end function load_pop_country


/**
 * Load Popular Cities
 * -------------------------------------------------------
 * @param: country name
 * @desc:
 *       get's the data.location object from the JSON data from /hotels/{country name}.js
 *       for each of the locations get item.permalink and item.name  
 *       populate the cities dropdown
 *       rebuild the top 10 list using the selected country and the first city of that country
 */

function load_pop_city(country) {	

	// initialize the popular city URL	
	var pop_city_url = '/hotels/' + country + '.js';

	// get the JSON data except when country is Singapore
	if ( country != 'singapore') {
		$.getJSON( pop_city_url, function(data) {

			$('#popular_hotels_module h2').removeClass('popLoader');

			// initialize the options
			var pop_options = '';

			// loop through each object 'item' in the JSON data
	   	$.each(data.locations, function(i, item) {
				// get object properties: item.permalink (for url building) and item.name (for display text)
				// build the option element for each item
				pop_options += '<option val="' + item.permalink + '">' + item.name +  '</option>';						
			});

			// finally insert the options to the popular city dropdown
			$('#popular_cities').html(pop_options);

			// for each new popular city load assign default page to 1
			pop_page = 1;
			// get the seleted option in the popular country dropdown
			var pop_country = $('#popular_countries').find('option:selected').attr('val');
			// get the first option in the popular city dropdown
			var pop_city = $('#popular_cities').find('option').eq(0).attr('val');

			// change the title of the Most Popular Hotels: {city name}
			$('#popular_hotels_module h2 strong').text( $('#popular_cities').find('option[val='+pop_city+']').text() );
			$('#popular_hotels_module #hotel_city strong').text( $('#popular_cities').find('option[val='+pop_city+']').text() );

			// assign the show all link to a static /hotels/{country}/{city}
			$('#pop_all').attr('href', '/hotels/'+pop_country+'/'+pop_city);	

			if (pop_city == undefined) {

				if ($('#popular_countries').find('option:selected').attr('val') == 'hong-kong')
				{
					get_popular_hotels( '#popular_hotels', 'china', 'hong-kong', pop_page );
					$('#popular_cities').attr('disabled', 'disabled').html('<option>Hong Kong</option>');
					$('#popular_hotels_module h2 strong').text( 'Hong Kong' );
					$('#popular_hotels_module #hotel_city strong').text( 'Hong Kong' );	
				}
				else $('#popular_cities').attr('disabled', 'disabled').html('<option>No Cities Available</option>');

			} else {

				// rebuild the top 10 list for each change on the popular city dropdown
				get_popular_hotels( '#popular_hotels', pop_country.toLowerCase(), pop_city.toLowerCase(), pop_page );

			}

		});

	} else {
		
		get_popular_hotels( '#popular_hotels', 'singapore', 'singapore', pop_page );
		$('#popular_cities').attr('disabled', 'disabled').html('<option>Singapore</option>');
		$('#popular_hotels_module h2 strong').text( 'Singapore' );
		$('#popular_hotels_module #hotel_city strong').text( 'Singapore' );	

	}
	
}  // end function load_pop_city

/**
 * Paginate: Prev and Next 10 Popular Hotels
 * -------------------------------------------------------
 * @param: element id clicked to determine the direction {prev or next}
 * @desc:
 *       always reference a global variable pop_page
 *       do not allow prev if pop_page = 1
 *       do not allow next if pop_page = 5
 *       otherwise just add to pop_page or remove from pop_page
 *       rebuild the top 10 based on the pop_page
 */

function pop_paginate(el, pop_country, pop_city) {

	// if the current top 10 list is less than 10, it is assumed that there's no more pages 
	if( $('#popular_hotels li').size() < 10 ) {

		$('#pop_next').addClass('disabled');

	}

	// if on the first page
	if ( pop_page == 1 ) {

		// if prev is clicked: add a disabled class to prev link
		if (el == 'pop_prev') {											
			$('#pop_prev').addClass('disabled');
			pop_page = 1;

		// if next is clicked: remove disabled class from prev link	
		} else {																					
			$('#pop_prev').removeClass('disabled');
			pop_page++;			
		}

	// if on the max page (current max = 5)
	} else if ( pop_page == 5 ) {

		// if next is clicked: add a disabled class to next link
		if (el == 'pop_next') {			
			pop_page = 5;
			
		// if prev is clicked: remove disabled class from next link	
		}	else {			
			$('#pop_next').removeClass('disabled');
			pop_page--;					
		}

	// if in between pages 1 and 5
	} else {

		// remove disabled class from both next and prev links
		$('#pop_next, #pop_prev').removeClass('disabled');

		// increase page if prev is clicked
		if (el == 'pop_prev') {		
			// disable prev link if it comes from page 2
			if (pop_page == 2) $('#pop_prev').addClass('disabled');
			pop_page--;

		// decrease page if next is clicked			
		} else {			
			// disable next link if it comes from page 4
			if (pop_page == 4) $('#pop_next').addClass('disabled');
			pop_page++;			
		}
		
	}

	// rebuild the top 10 list for each change on the popular city dropdown
	get_popular_hotels( '#popular_hotels', pop_country, pop_city, pop_page );		

	return false;

} // end function pop_paginate