/**
 * 
 */
//
// getJSON( url, params )
//
function getJSON(url, params) {
	var response = $.ajax({
		type : 'post',
		url : url,
		data : params,
		format : 'json',
		async : false
	}).responseText;
	return response;
}

function formatRecord(obj) {

	var source = "<li>%s</li>";
	var photo_url = "<li><img class='thumb' src='%s' /></li>";
	var name = "<li><a href='%s'>%s</a></li>";
	var geo = "<li>%s, %s</li>";
	var price = "<li>%.2f %s</li>";
	var booking_url = "<li><a href='%s'>%s</a></li>";
	var row = "<div class='record rounded'><ul>%s</ul></div>";

	source = $.sprintf(source, obj.source);
	if (obj.photo_url) {
		photo_url = $.sprintf(photo_url, obj.photo_url
				+ "?nocache=<?php echo NOCACHE?>");
	}
	name = $.sprintf(name, obj.url_details, obj.name);
	geo = $.sprintf(geo, obj.city_name, obj.country_name);
	price = $.sprintf(price, obj.price_room_double, obj.price_room_currency);
	booking_url = $.sprintf(booking_url, obj.url_booking, "reservar...");

	row = $.sprintf(row, source + photo_url + name + geo + price + booking_url);

	return row;
}

function displayRecord(target, str) {
	$(target).append(str);
}

$(document).ready(
		function() {

			var target = "#target";
			var response = "";
			var url = "json.server.php";

			$('button').click(
					function(response) {
						// response = "<img src='/media/common/loading.gif' />";
						// $(target).css('backgroundColor','#FFF');

						var params = "country_id="
								+ $('input[name="country_id"]').attr('value');
						// alert(params);
						// exit();

						response = getJSON(url, params);

						$(target).html('');
						// alert(response);

						var arr = jQuery.parseJSON(response);

						$.each(arr, function(index, obj) {
							// alert(obj.name);
							var str = formatRecord(obj);
							displayRecord(target, str);
						});

						// var debug = '';
						// $.each(arr, function(index, obj) {
						// debug += index+':'+arr[index];
						// });

						$(target).append('<pre>' + response + '</pre>');
					});

		});