// google map variables
var centerLatitude = 48.79250328502993 //48.81002893103924; //48.79250328502993; 
var centerLongitude = 22.006301879882812; //22.006301879882812;
var startZoom = 13; //13;
var map;

var markersData; //global variable for all the markers 

//create array of areas
var areas = new Object();
areas.items = [];

areas.items.push ( {
    id: 'all',
    name: 'all',
    latitude: 48.79250328502993,
    longitude: 22.006301879882812, 
    zoom: 13 });

areas.items.push ( {
    id: 0,
    name: 'Biela Hora',
    latitude: 48.7721432365483,
    longitude: 21.951541900634766, 
    zoom: 13 });

areas.items.push ( {
    id: 1,
    name: 'Hôrka',
    latitude: 48.79827046389008,
    longitude: 21.976947784423828, 
    zoom: 15});

areas.items.push ( {
    id: 2,
    name: 'Medvedia Hora',
    latitude: 48.79996656679195,
    longitude: 22.002010345458984, 
    zoom: 14 });

areas.items.push ( {
    id: 3,
    name: 'Kalu¾a',
    latitude: 48.8073156833131,
    longitude: 22.00613021850586, 
    zoom: 14 });
    
areas.items.push ( {
    id: 4,
    name: 'Kamenec',
    latitude: 48.81002893103924,
    longitude: 22.011451721191406, 
    zoom: 14 });
    
areas.items.push ( {
    id: 5,
    name: 'Klokocov',
    latitude: 48.81036807668223,
    longitude: 22.02535629272461, 
    zoom: 14 });
    
areas.items.push ( {
    id: 6,
    name: 'Palkov',
    latitude: 48.81002893103924,
    longitude: 22.039260864257812, 
    zoom: 14 });
    
areas.items.push ( {
    id: 7,
    name: 'Vinianské Jazero',
    latitude: 48.817828700467274,
    longitude: 21.987075805664062, 
    zoom: 16 });


// array of google maps icons for markers 
var icons = new Object();
icons.items = [];


icons.items[1] = new GIcon();
icons.items[1].image = "images/hotel1183477550.png";
icons.items[1].iconSize = new GSize(20, 34);
icons.items[1].iconAnchor = new GPoint(10, 34);
icons.items[1].infoWindowAnchor = new GPoint(22, 1);
icons.items[4] = new GIcon();
icons.items[4].image = "images/chata1183539843.png";
icons.items[4].iconSize = new GSize(20, 34);
icons.items[4].iconAnchor = new GPoint(10, 34);
icons.items[4].infoWindowAnchor = new GPoint(22, 1);
icons.items[5] = new GIcon();
icons.items[5].image = "images/penzion1183477730.png";
icons.items[5].iconSize = new GSize(20, 34);
icons.items[5].iconAnchor = new GPoint(10, 34);
icons.items[5].infoWindowAnchor = new GPoint(22, 1);
icons.items[7] = new GIcon();
icons.items[7].image = "images/Restauracia1183539941.png";
icons.items[7].iconSize = new GSize(20, 34);
icons.items[7].iconAnchor = new GPoint(10, 34);
icons.items[7].infoWindowAnchor = new GPoint(22, 1);
icons.items[10] = new GIcon();
icons.items[10].image = "images/podujatie1183540179.png";
icons.items[10].iconSize = new GSize(20, 34);
icons.items[10].iconAnchor = new GPoint(10, 34);
icons.items[10].infoWindowAnchor = new GPoint(22, 1);
icons.items[12] = new GIcon();
icons.items[12].image = "images/sukromie1183470988.png";
icons.items[12].iconSize = new GSize(20, 34);
icons.items[12].iconAnchor = new GPoint(10, 34);
icons.items[12].infoWindowAnchor = new GPoint(22, 1);
icons.items[11] = new GIcon();
icons.items[11].image = "images/Turisticka_ubytovna1183540049.png";
icons.items[11].iconSize = new GSize(20, 34);
icons.items[11].iconAnchor = new GPoint(10, 34);
icons.items[11].infoWindowAnchor = new GPoint(22, 1);
      

function ShowTable(data) {
    return 'a';
}
//FUNCTIONS============================================================================
function getInfo(data) {
  
  var str = '<div class="t_info">';
  
  if (data.name != null && data.name.length > 0) str += '<div class="t_info_name">'+data.name+'</div>';
 
  if (data.telephone != null && data.telephone.length > 0) str += '<div class="t_info_tel"><b>tel:</b>'+data.telephone+'</div>';

  
  if (data.link != null && data.link.length > 0) str += '<div class="t_info_link"><a href="'+data.link+'" target="_blank">'+data.link+'</a> </div>';

  if (data.photo != null && data.photo.length >  0) str += '<div class="t_info_photo"><img src="images/'+data.photo+'"></div>';

  var tmpopen = data.open == 'SEASON' ? 'otvorené len v sezóne' : 'otvorené po celý rok';
  if (data.open != null && data.open.length > 0) str += '<div class="t_info_open">'+tmpopen+'</div>';

  if (data.capacity != null && data.capacity.length > 0) str += '<div class="t_info_cap"><b>kapacita:</b>'+data.capacity+'</div>';
  if (data.distance != null && data.distance.length > 0) str += '<div class="t_info_dist"><b>Vzdialenost od vody:</b>'+data.distance+'</div>';
  
  if (data.price != null && data.price.length > 0) str += '<div class="t_info_price"><b>Cena:</b>'+data.price+'</div>';
  
  str += '</div>';
  return str;
}


function getListItem(data) {
  
  var str = '' // <div class="list">';

  if (data.name != null && data.name.length > 0) str += '<div class="list_name">'+data.name+'</div>';
  if (data.capacity != null && data.capacity.length > 0) str += '<div class="list_cap"><b>kapacita:</b>'+data.capacity+'</div>';
  if (data.distance != null && data.distance.length > 0) str += '<div class="list_dist"><b>Vzdialenost od vody:</b>'+data.distance+'</div>';
  if (data.price != null && data.price.length > 0) str += '<div class="list_price"><b>Cena:</b>'+data.price+'</div>';
  
  //str += '</div>';
  return str;
}

function addMarker(data) {
         
  // Our info window content
  if (data.description != null && data.description.length > 0) {
    var infoTabs = [
      new GInfoWindowTab("Info", getInfo(data)),
      new GInfoWindowTab("Popis", '<div class="t_desc">'+data.description+'</div>')
    ];      
  } else {
    var infoTabs = [
      new GInfoWindowTab("Info", getInfo(data))
    ];      
  
  }
  
  //add item into list of records right to the map
  //$('listobjects').innerHTML += getListItem(data);
  
  var newdiv = document.createElement('div');
  newdiv.setAttribute('className', 'list');
  newdiv.setAttribute('class', 'list');
  newdiv.setAttribute('id', 'object'+data.id);
  //newdiv.className = 'object'+data.id;
  newdiv.innerHTML += getListItem(data);
  document.getElementById("listobjects").appendChild(newdiv);
  
   
  //add marker into a map
  var type = data.type;
  var tmp_ico = icons.items[type]; 
  var marker = new GMarker(new GLatLng(data.latitude, data.longitude), {icon: tmp_ico} /*, {draggable: true}*/ );    
  
  //newdiv.onclick = marker.openInfoWindowTabsHtml(infoTabs);  
  Event.observe('object'+data.id, 'click', function() { marker.openInfoWindowTabsHtml(infoTabs);} ); 
  Event.observe('object'+data.id, 'mouseover', function() { 
      marker.setImage('http://www.bicon2007.org.uk/static/pics/marker_34_yellow.png');}
    );
  Event.observe('object'+data.id, 'mouseout', function() { 
      marker.setImage(icons.items[type].image); } 
    );
  
  // set listener to open "bubble" over the marker after clicking
  GEvent.addListener(marker, 'click',
  function() {
      marker.openInfoWindowTabsHtml(infoTabs);
      }
  );

  
  map.addOverlay(marker);											          														      
}
															       
function showNumRecords(num) {
  $('numrecords').innerHTML = 'Počet nájdených objektov: <b>'+num+'</b>';
}


function getResponse(oReq, oJSN) {
    //$('loader').hide();    
    //$('debug').innerHTML += oReq.responseText+'<br /><br />';
    //$('debug').innerHTML += '<br /><b>RESPONSE</b><br />';
    var data = eval(oReq.responseText);
    
    for (var i = 0; i < data.length; i++) {
    	addMarker(data[i]);
    	//$('debug').innerHTML += data[i].name+'<br />';
    }
    showNumRecords(data.size());
}


function getMarkers() {
        //$('loader').show();
        $('numrecords').innerHTML = 'nahrávam...';
      	map.clearOverlays();
      	var markers = new Object;
      	//markers.items = [];	
          
      	//var type = $F('type');
      	var type = '';
        var area = $F('area');
        var open = $F('open');	
      	var url = 'data.php';
        //'type='+type+
        
                  if ('type1' != null && $F('type1') != null) type += '&type[]='+ $F('type1');
                  if ('type4' != null && $F('type4') != null) type += '&type[]='+ $F('type4');
                  if ('type5' != null && $F('type5') != null) type += '&type[]='+ $F('type5');
                  if ('type7' != null && $F('type7') != null) type += '&type[]='+ $F('type7');
                  if ('type10' != null && $F('type10') != null) type += '&type[]='+ $F('type10');
                  if ('type12' != null && $F('type12') != null) type += '&type[]='+ $F('type12');
                  if ('type11' != null && $F('type11') != null) type += '&type[]='+ $F('type11');
                 
      	
        var pars = 'area='+areas.items[area].id+'&open='+open+type;
        
        $('listobjects').innerHTML = '';

        //$('debug').innerHTML = pars+'<br />';  
      	// notice the use of a proxy to circumvent the Same Origin Policy.
      	
      	new Ajax.Request(url, {
      	    method: 'get',
      	    parameters: pars,
      	    onSuccess: getResponse} );

}

function init() {
if (GBrowserIsCompatible()) {
    $('loader').hide();
    map = new GMap2(document.getElementById("map"));
    map.addControl(new GLargeMapControl());
    map.addControl(new GMapTypeControl());
    map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom, G_SATELLITE_MAP);
    
    
    Event.observe( $('area'), 'change', function(event) {
      	var key = $F('area');
      	//map.clearOverlays();
      	//map.enableContinuousZoom();	
     	
      	//Smooth continuous zoom work for only smaller zoom
      	//map.panTo(new GLatLng(areas.items[key].latitude, areas.items[key].longitude));
      	map.setCenter(new GLatLng(areas.items[key].latitude, areas.items[key].longitude), areas.items[key].zoom);
      	getMarkers();
   	    //GEvent.addListener(map, "moveend", getMarkers);

    
    } );//end observe area
    
    //getMarkers();
    var tmp;
          Event.observe( $('type1'), 'click', getMarkers );
          Event.observe( $('type4'), 'click', getMarkers );
          Event.observe( $('type5'), 'click', getMarkers );
          Event.observe( $('type7'), 'click', getMarkers );
          Event.observe( $('type10'), 'click', getMarkers );
          Event.observe( $('type12'), 'click', getMarkers );
          Event.observe( $('type11'), 'click', getMarkers );
     
    
    Event.observe( $('open'), 'change', getMarkers );
    
    //show markers for default area and types after loading the script
    getMarkers();
  }
}

window.onload = init;
window.onunload = GUnload;