var ESC_CODE_KEY = 27;
var ENTER_CODE_KEY = 13;


$(document).ready(function() {
	var initScale = 11;
	var initLat = 60.1698125;
	var initLng = 24.9382401;
	var showIndicator=true;

	SetMapModule(initLat,initLng,initScale,showIndicator);

	SetFilterModule();
	
	GetData();
});


function GetChecked(selector) {
	var checked = [];
	$(selector).filter(":checked").each(function() {
		checked.push($(this).val());
	});
	return checked;
}

function GetKeyValueString(key, value) {
	return key + "=" + value;
}

function FormatDate(date) {
	var dateArray = date.split("/");
	return dateArray[2] + "-" + dateArray[0] + "-" + dateArray[1];
}

function GetFilterValues(){
	var filter = [];
	
	filter.push(GetKeyValueString("date_arr", FormatDate($("#date_arr").val())));
	filter.push(GetKeyValueString("date_dep", FormatDate($("#date_dep").val())));
	filter.push(GetKeyValueString("stars", GetChecked(".hotel_category").join(",")));
	filter.push(GetKeyValueString("room_type", $("#room_type").val()));
	filter.push(GetKeyValueString("val_to", $("#val_to").val()));
	filter.push(GetKeyValueString("list_sort", $("#list_sort").val()));
	filter.push(GetKeyValueString("rnd", Math.random()));
	
	return filter;
}

function GetData() {
	map.closeInfoWindow();
	mapIndicator.show();

	var filter = GetFilterValues();

	$.ajax({
		type: "get",
		url: "/cgi-bin/map_hotels/map_hotels_rus.cgi",
		data: filter.join("&"),
		contentType: "application/json; charset=utf-8",
		dataType: "json",
		async: true,
		success: function(data) {
			mapIndicator.hide();
			ShowHotels(data.hotels);
		},
		error: function(event, request, settings) {
      }
	});
}

function ShowSearchHeader(hotelsCount){
	var matchingHotels;
	
	if(hotelsCount>0) {
		if(hotelsCount==1) {
		  matchingHotels=hotelsCount+" гостиниц найдено";
		}
		else {
		  matchingHotels=hotelsCount+" гостиниц найдено";
		}
	}
	else {
		matchingHotels="No Matching Hotels";
	}
	
	var header="\
<tr>\
<td class='menu_stars'>\
<b><span id='matches_count'>"+matchingHotels+"</span></b>\
</td>\
</tr>\
<tr>\
<td class='punktir'>\
<img width='186' height='1' alt='' src='/images/emp.gif'>\
</td>\
</tr>\
";
	
	$("#search_header").html("<tbody>"+header+"</tbody>");
}

function ShowHotels(hotels) {
	map.clearOverlays();
	
	var markers=[];
	
	var hotelsCount = hotels == null ? 0 : hotels.length;
	
	ShowSearchHeader(hotelsCount);
	
	var results="";
	
	for (var i = 0; i < hotelsCount; i++) {
		var hotel = hotels[i];
		markers[hotel.shortname] = CreateMarker(hotel,i+1);
		map.addOverlay(markers[hotel.shortname]);
		
		results+=GetResultHtml(hotel,markers[hotel.shortname]);
	}
	
	var jSearchResults=$("#search_results");
	jSearchResults.html("<tbody>"+results+"</tbody>");
	
	jSearchResults.find(".results_hotelname,.results_icon").click(function(){
		var hotelShortname=$(this).parents(".result:eq(0)").find(".results_shortname").text();
		GetHotelInfo(hotelShortname,markers[hotelShortname]);
	});
}

function CreateMarker(hotel,numResult) {
	var hotelIcon;
	switch (hotel.star) {
		case "0":
			hotelIcon = GetCustomIcon(mapIcons.noStars,numResult);
			break;
		case "1":
			hotelIcon = GetCustomIcon(mapIcons.oneStar,numResult);
			break;
		case "2":
			hotelIcon = GetCustomIcon(mapIcons.twoStars,numResult);
			break;
		case "3":
			hotelIcon = GetCustomIcon(mapIcons.threeStars,numResult);
			break;
		case "4":
			hotelIcon = GetCustomIcon(mapIcons.fourStars,numResult);
			break;
		case "5":
			hotelIcon = GetCustomIcon(mapIcons.fiveStars,numResult);
			break;
	}
	

	//создаем маркер
	var marker = new GMarker(
		new GLatLng(parseFloat(hotel.lat), parseFloat(hotel.lng)),
		{
			draggable: false,
			bouncy: false,
			title: hotel.hotelname,
			icon: hotelIcon
		}
	);

	//добавляем обработчик клика на маркере
	GEvent.addListener(marker, 'click', function(){
		GetHotelInfo(hotel.shortname,marker);
	});

	return marker;
}

function GetCustomIcon(icon,numResult){
	return new GIcon(icon,icon.image.replace("image.png","images/"+numResult+".png"));
}

function GetStarsHtml(hotelStars,imageFileName){
	var starsImage="<img  border='0' src='/images/"+imageFileName+"' alt=''>";
	var starsImages=[];
	
	if(hotelStars>0){
		for(var i=0;i<hotelStars;i++){
			starsImages.push(starsImage);
		}
	}
	
	return starsImages.join("");
}

function GetResultHtml(hotel,marker) {
	return "\
<tr class='result'>\
<td>\
<table width='100%' style='table-layout:fixed;'>\
<tbody>\
<tr>\
<td valign='top' width='25'>\
<img class='results_icon pointer' width='23' height='23' src='"+marker.getIcon().image+"' alt=''>\
</td>\
<td valign='top' align='left'>\
<span class='results_hotelname font13 colored dashed pointer'>"+hotel.hotelname+"</span>\
</td>\
<td valign='top' align='right' width='62' >\
"+GetStarsHtml(hotel.star,"star.gif")+"\
</td>\
</tr>\
<tr>\
<td colspan='3'>\
<span class='results_description font11'>"+hotel.description+"</span>\
</td>\
</tr>\
<tr>\
<td colspan='3' align='right'>\
<span class='results_shortname'>"+hotel.shortname+"</span>\
</td>\
</tr>\
</tbody>\
</table>\
</td>\
</tr>\
<tr>\
<td colspan='3' class='punktir'>\
<img src='images/emp.gif' width='186' height='1' alt=''>\
</td>\
</tr>\
";
}
/*
<span class='font10'>Starting at </span>\
<span class='results_currency font11 bolded'>"+hotel.currency+" </span>\
<span class='results_price font11 bolded'>"+hotel.price+"</span>\
<span class='font11 bolded'>/night</span>\
*/
function GetHotelInfo(hotelShortname,marker) {	
	ShowBalloon(marker,hotelShortname);
	
	var filter=GetFilterValues();
	filter.push(GetKeyValueString("action", "single_hotel"));
	filter.push(GetKeyValueString("shortname", hotelShortname));
	
	$.ajax({
		type: "get",
		url: "/cgi-bin/map_hotels/map_hotels_rus.cgi",
		data: filter.join("&"),
		contentType: "application/json; charset=utf-8",
		dataType: "json",
		async: true,
		success: function(data) {
			FillBalloon(marker,data.hotel);
		},
		error: function(event, request, settings) {
		}
	});
}

function ShowBalloon(marker,hotelShortname) {
	var baloonTemplate="\
<div id='{_hotelShortname}' class='map_info_window'>\
<table class='map_info_indicator' cellspacing='0' cellpadding='0' width='100%' height='100%'>\
<tr>\
<td align='center' valign='middle'>\
<img src='images/indicator.gif' alt=''/>\
</td>\
</tr>\
</table>\
<table class='map_info_content' cellspacing='0' cellpadding='0' width='100%' height='100%'>\
<tr>\
<td>\
<table width='100%'>\
<tbody>\
<tr>\
<td valign='top' width='23'>\
<img class='map_info_icon' width='23' height='23' src='' alt=''>\
</td>\
<td valign='top' align='left'>\
<a href='' class='map_info_hotelname font14 colored'></a>\
</td>\
<td class='map_info_stars' valign='top' align='right' width='60' >\
</td>\
<td width='6'>\
</td>\
</tr>\
</tbody>\
</table>\
</td>\
</tr>\
<tr>\
<td>\
<table width='100%'>\
<tbody>\
<tr>\
<td valign='top'>\
<table width='100%' height='115'>\
<tbody>\
<tr>\
<td valign='top'>\
<span class='map_info_description font11'></span>\
</td>\
</tr>\
<tr>\
<td valign='top'>\
<a href='' class='map_info_pricepage font11 colored'>Дополнительно</a>\
</td>\
</tr>\
<tr>\
<td>\
<br>\
<a href='' class='map_info_reservationspage font13 bolded colored'>Бронировать!</a>\
</td>\
</tr>\
</tbody>\
</table>\
</td>\
<td valign='top' width='115'>\
<img class='map_info_image' width='115' height='115' src='' alt=''>\
</td>\
</tr>\
</tbody>\
</table>\
</td>\
</tr>\
<tr>\
<td>\
<span class='font11 bolded'>Адрес: </span>\
<span class='map_info_address font11'></span>\
</td>\
</tr>\
<tr>\
<td valign='bottom' align='right'>\
<span class='font11 bolded'> Звоните +7-812-309-57-60</span>\
</td>\
</tr>\
</table>\
</div>\
";

	baloonTemplate=baloonTemplate
		.replace("{_hotelShortname}","balloon_"+hotelShortname);
	
	marker.openInfoWindowHtml(baloonTemplate, {});
}
/*
<span class='font10'>Цены от </span>\
<span class='map_info_price font11 bolded'></span> \
<span class='map_info_currency font11 bolded'></span><span class='font11 bolded'>/ночь</span>\
*/
function FillBalloon(marker,hotelinfo) {
	var jBalloonContent=$("#balloon_"+hotelinfo.shortname);

	jBalloonContent.find(".map_info_indicator").remove();
	jBalloonContent.find(".map_info_content").show();
	
	jBalloonContent.find(".map_info_icon").attr({"src":marker.getIcon().image});
	jBalloonContent.find(".map_info_hotelname")
		.attr({"href":""+hotelinfo.pagename+"-price.htm"})
		.text(hotelinfo.hotelname);
	jBalloonContent.find(".map_info_stars")
		.html(GetStarsHtml(hotelinfo.star,"star.gif"));
	jBalloonContent.find(".map_info_address").text(hotelinfo.address);
	jBalloonContent.find(".map_info_description").text(hotelinfo.description);
//	jBalloonContent.find(".map_info_price").text(hotelinfo.price);
//	jBalloonContent.find(".map_info_currency").text(hotelinfo.currency);

	jBalloonContent.find(".map_info_pricepage")
		.attr({"href":""+hotelinfo.pagename+"-price.htm"});
	jBalloonContent.find(".map_info_reservationspage")
		.attr({"href":""+hotelinfo.pagename+"-reservations.htm"});
	jBalloonContent.find(".map_info_image")
		.attr({"src":""+hotelinfo.image});

	//если контент будет не влезать, то лучше увеличить шаблон в style.css
	//но если не хочется, то можно так
	//marker.openInfoWindowHtml(jBalloonContent.html(), {});
	//только информационное окошко разок моргнет, так как откроется заново
}