// ******************************************************

var photosByPage;
var curPage = 1;
var map;

var side_bar_html = "";
var gmarkers = [];
var htmls = [];
var i = 0;



function variablesurl(name){
	var regexS = "[\\?&]"+name+"=([^&#]*)";
	var regex = new RegExp ( regexS );
	var tmpURL = window.location.href;
	var results = regex.exec( tmpURL );
	alert("Esto es un mensaje de JavaScriptfuncion");
	if( results == null )
		return"";
	else
		return results[1];
	
}

// ******************************************************
var defaultArgs = null;

// ******************************************************
var layer = null;


// ******************************************************
function Tab(options) {
  this.index = options.index;
  this.name = options.name;
  this.set = options.set;
  this.order = options.order;
  this.kmlText = options.kmlText;
  this.kmlLink = options.kmlLink;
  this.showAsTab = options.showAsTab;
  this.hasCheckboxAll = options.hasCheckboxAll;
  this.html = null;
}


// ******************************************************
var tabs = new Array();


// ******************************************************
var currentTab;


// ******************************************************
var initialTabIndex = null;

// ******************************************************
var defaultTab;


// ******************************************************
function addTab(options) {
  var tab = new Tab(options);
  tab.html = $('#tab_li_' + options.index);
  tabs.push(tab);
}


// ******************************************************
function findTabByIndex(index) {
  for (var i = 0, l = tabs.length; i < l; ++i) {
    if (tabs[i].index == index) {
      return tabs[i];
    }
  }
  return null;
}


function mapTypeToInt(type) {
  switch (type) {
    case G_NORMAL_MAP: return 0; break;
    case G_SATELLITE_MAP: return 1; break;
    case G_HYBRID_MAP: return 2; break;
    default: return 2;
  }
}


function historyChange(newLocation) {
  function extractDataFromLocation(location, outArgs) {
    if (location.length > 0) {
      var args = location.split('&');
      for (var i = 0; i < args.length; i++) {
        var arg = args[i].split('=');
        outArgs[arg[0]] = parseFloat(arg[1]);
      }
    }
  }
  function isClose(x, y) {
    return (Math.abs(x - y) < 0.000001);
  }

  var args = { ln: -33, lt: 28, z: 15, k: 1, tab: defaultTab.index };
  if (defaultArgs != null) {
    args.ln = defaultArgs.ln;
    args.lt = defaultArgs.lt;
    args.z = defaultArgs.z;
  }
  extractDataFromLocation(newLocation, args);

  var tabChanged = false;
  if (!currentTab || currentTab.index != args.tab) {
    activateTab(findTabByIndex(args.tab), false);
    tabChanged = true;
  }

  var center = map.getCenter();
  var k = mapTypeToInt(map.getCurrentMapType());
  var robberyZoom = args.z;
  var mapsApiZoom = 17 - robberyZoom;

  if (tabChanged ||
      !center ||
      !isClose(args.lt, center.lat()) ||
      !isClose(args.ln, center.lng()) ||
      mapsApiZoom != map.getZoom() ||
      args.k != k)
    map.setCenter(new GLatLng(args.lt, args.ln), mapsApiZoom,
                  map.getMapTypes()[args.k]);
}


function GPositionControl() {}


GPositionControl.prototype = new GControl(true, true);


function getCoordsCenter(map) {
  function dec2sex(dec, lat) {
    var letter = lat ? (dec >= 0 ? 'N' : 'S') : (dec >= 0 ? 'E' : 'W');
    dec = Math.abs(dec);
    var deg = Math.floor(dec);
    var min = Math.floor((dec - deg) * 60);
    var sec = (dec - deg - min / 60) * 3600;
    return deg + '\u00B0 ' + min + '\' ' + sec.toFixed(2) + '" ' + letter;
  }
  var center = map.getCenter();
  return dec2sex(center.lat(), true) + ' ' + dec2sex(center.lng(), false);
}


GPositionControl.prototype.initialize = function(map) {
  var container = document.createElement('div');
  var extra = document.createElement('div');
  extra.innerHTML = getCoordsCenter(map);
  extra.style.color = (map.getCurrentMapType() == G_NORMAL_MAP ?
                       'black' : 'white');
  extra.style.fontSize = '8pt';
  container.appendChild(extra);
  map.getContainer().appendChild(container);
  GEvent.addListener(map, 'move', function() {
    extra.innerHTML = getCoordsCenter(map) });
  GEvent.addListener(map, 'maptypechanged', function() {
    extra.style.color =
        map.getCurrentMapType() == G_NORMAL_MAP ? 'black' : 'white' });

  return container;
};


GPositionControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(70, 7));
};


function clamp(i, a, b) {
  return i <= a ? a : i >= b ? b : i
}


function centerMapAtLatLong(name, pt, mapsApiZoom) {
  map.setCenter(pt, mapsApiZoom, map.getCurrentMapType());
}

function resetMap() {
  map.setCenter(new GLatLng(28, -33), 15, G_SATELLITE_MAP);
}


// ******************************************************
function updateKmlLink(tab) {
// ******************************************************
  var link = $('#kml-link');
  link.text(tab.kmlText);
  link.attr('href', tab.kmlLink);
}


// ******************************************************
function setUpInitialTab(tab) {
  currentTab = tab;
  currentTab.html.toggleClass('active');
  curPage = 1;
  if (currentTab.hasCheckboxAll) {
    if ($('#all_layer_checkbox').attr('checked')) {
      updateKmlLink(findTabByIndex(10));
    } else {
      updateKmlLink(currentTab);
    }
    $('#tab_checkbox_area').show();
  } else {
    updateKmlLink(currentTab);
    $('#tab_checkbox_area').hide();
  }
}


// ******************************************************
function activateTab(tab, refresh) {
  if (currentTab) {
    currentTab.html.removeClass('active');
    currentTab.html.find('.total_photos').html('');
  }
  setUpInitialTab(tab);
  currentTab.html.find('.loading').css('display', 'inline');

  activateLayer();
  if (refresh) {
    onMoveEndMap();
  }

  return false;
}


function onLoad() {

  var x = 'info';
  x += '@';
  x += 'robberymaps.com';
  $('#m').attr({href: 'mailto:' + x});

  $.each(tabs, function() {
      var tab = this;
      tab.html.find('a').click(function(event) {
          event.preventDefault();
          event.stopPropagation();
          return activateTab(tab, true);
        });
    });


  $('#all_layer_checkbox').click(function() {
      var checkbox = $('#all_layer_checkbox');
      activateTab(currentTab, true);
      return true;
    });

  defaultTab = findTabByIndex(initialTabIndex);
  setUpInitialTab(defaultTab);

  onResize();
  setupGMap('map', {});
  $(window).resize(onResize);
}


function onResize() {
  if ($('#map').css('display') == 'none')
    return;
  // resize the map
  var m = $('#map').get(0);
  var d = getDimensions(m);
  var windowHeight = getWindowHeight();
  m.style.height = (windowHeight - d.top - 46) + 'px';
  if (map) map.checkResize();
  d = getDimensions(m);
}


function onMoveEndMap() {
  plotRobbery();
  updateLinkToThisPage();
}


// ******************************************************
function getLayerName() {

  /*
  var label = 'public';  

  if (currentTab.hasCheckboxAll && $('#all_layer_checkbox').attr('checked')) {
    label = 'all';  // "all" photos (also rejected)
  } else if (currentTab.set == 'recent') {
    label = 'recent';  // "recent" photo set
  } else if (!isNaN(userId = parseInt(currentTab.set))) {
    label = 'user.' + userId;
  } else if (currentTab.set.substr(0, 4) == 'tag-') {
    label = 'tag.' + currentTab.set.substr(4);
  } else if (currentTab.set == 'public') {
  } else {
    // Unknown layer, default to the public layer
  }

  var sorting = 'p';  // sort all layers by popularity
  return 'lmc:com.robbery.' + sorting + '.' + label;
  */
}


// ******************************************************
function activateLayer() {
  if (layer != null) {
    map.removeOverlay(layer);
  }
  layer = new GLayer(getLayerName());
  map.addOverlay(layer);
  
}
  

 var iconBlue = new GIcon(); 
    iconBlue.image = 'http://labs.google.com/ridefinder/images/mm_20_blue.png';
    iconBlue.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
    iconBlue.iconSize = new GSize(12, 20);
    iconBlue.shadowSize = new GSize(22, 20);
    iconBlue.iconAnchor = new GPoint(6, 20);
    iconBlue.infoWindowAnchor = new GPoint(5, 1);

    var iconRed = new GIcon(); 
    iconRed.image = 'http://labs.google.com/ridefinder/images/mm_20_red.png';
    iconRed.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
    iconRed.iconSize = new GSize(12, 20);
    iconRed.shadowSize = new GSize(22, 20);
    iconRed.iconAnchor = new GPoint(6, 20);
    iconRed.infoWindowAnchor = new GPoint(5, 1);

    var customIcons = [];
    customIcons["a"] = iconBlue;
    customIcons["b"] = iconRed;
    


function saveData() {
      var mail = escape(document.getElementById("mail").value);
      var title = escape(document.getElementById("title").value);
      var descr = escape(document.getElementById("descr").value);
      
      var city = escape(document.getElementById("city").value);
      var latlng = marker.getLatLng();
      var lat = latlng.lat();
      var lng = latlng.lng();

      var url = "map_phpsqlinfo_addrow.php?mail=" + mail + "&title=" + title +
                "&descr=" + descr + "&lat=" + lat + "&lng=" + lng + "&city=" + city;
      GDownloadUrl(url, function(data, responseCode) {
        if (responseCode == 200 && data.length <= 1) {
          marker.closeInfoWindow();
          /*document.getElementById("message").innerHTML = "Location added.";*/
          
        }
      });
    
      
  // -----------Codigo para recargar marcas--------------------------
      
         GDownloadUrl("map_phpsqlajax_genxml.php", function(data) {
          var xml = GXml.parse(data);
          var markers = xml.documentElement.getElementsByTagName("marker");
          for (var i = 0; i < markers.length; i++) {
            var title = markers[i].getAttribute("title");
            var descr = markers[i].getAttribute("descr");
            var city = markers[i].getAttribute("city");     
            //var date = markers[i].getAttribute("date");
            var type = "a";
            var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                    parseFloat(markers[i].getAttribute("lng")));
            var marker = createMarker(point, title, descr, city, type); //fecha
            map.addOverlay(marker);
            
          }
        });
  
  
  
  function createMarker(point, title, descr, city, date, type) {
      var marker = new GMarker(point, customIcons[type]);
      var html = "<table width=\"100%\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"Estilo2\"><tr><td><b>" + title + "</b> <br/>" + descr + "<br/>" + city + "</tr></table>"; //date
      GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
      });
      return marker;
    }
  // -------------------------------------
   
    }




function setupGMap(m, opts) {




  function createMarker(point,title,descr,city) {
      var marker = new GMarker(point);
      var html = "<table width=\"100%\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"Estilo2\"><tr><td><b>" + title + "</b> <br/>" + descr + "<br/>" + city + "</tr></table>"; //date
      GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml(html);
      });
      gmarkers[i] = marker;
      htmls[i] = "<table width=\"100%\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"Estilo2\"><tr><td><b>" + title + "</b> <br/>" + descr + "<br/>" + city + "</tr></table>";
      side_bar_html += '<a href="javascript:myclick(' + i + ')">' + title + '<\/a><br>' + descr + '<br/>' + city + '<br/><br/>';
      i++;
      return marker;
    }


 
  

  // Initializing Google Map
  m = $('#'+m).get(0);
  map = new GMap2(document.getElementById("map")); 
  map.addControl(new GMapTypeControl());
 
  
 
  GEvent.addListener(map, "click", function(overlay, latlng) {
          if (latlng) {
            
            marker = new GMarker(latlng, {draggable:true});
            
            GEvent.addListener(marker, "click", function() {
              var html = "<table class=\"Estilo2\">" +
                         "<tr><td>Mail:</td> <td><input type='text' class=\"Estilo2\" id='mail' value='mail@mail.com' style='color: #ccc;' onfocus=\"this.value=''; this.style.color='#000000';\" /> </td> </tr>" +
                         "<tr><td>Titulo:</td> <td><input type='text' class=\"Estilo2\" id='title' value='Titulo' style='color: #ccc;' onfocus=\"this.value=''; this.style.color='#000000';\" /></td> </tr>" +
                         "<tr><td>Descripcion:</td> <td><input type='textarea' class=\"Estilo2\" cols='20' rows='4' id='descr' value='Descripcion de lo sucedido' style='color: #ccc;' onfocus=\"this.value=''; this.style.color='#000000';\" /></td></tr>" +
                         "<tr><td>Ciudad:</td> <td><input type='text' class=\"Estilo2\" id='city' value='Ciudad' style='color: #ccc;' onfocus=\"this.value=''; this.style.color='#000000';\" /></td></tr>" +
                         //"<tr><td>Fecha:</td> <td><input type='text' id='date' value='dd/mm/aaaa' maxlength='10' onclick=\"this.value='';\" style='color: #ccc;' /></td></tr>" +
                         "<tr><td></td><td><input type='button' class=\"Estilo2\" value='Save & Close' onclick='saveData()'/></td></tr>";

              marker.openInfoWindow(html);
            });
            map.addOverlay(marker);
            
          }
          
        });
  



  
  GDownloadUrl("map_phpsqlajax_genxml.php", function(data) {
          var xml = GXml.parse(data);
          var markers = xml.documentElement.getElementsByTagName("marker");
          for (var i=0; i < markers.length; i++) {
            var title = markers[i].getAttribute("title");
            var descr = markers[i].getAttribute("descr");
            var city = markers[i].getAttribute("city");
            var type = "a";
            var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                    parseFloat(markers[i].getAttribute("lng")));
            var marker = createMarker(point, title, descr, city); 
            map.addOverlay(marker);
          }
         document.getElementById("side_bar").innerHTML = side_bar_html; 
        });
        


 // ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

  
  
  //activateLayer();

  photosByPage = Math.floor(
      (m.offsetHeight - $('.pages').get(0).offsetHeight) / 115) * 4;

  $.history.init(historyChange);

  // Adding controls to the maps
  map.addControl(new GMapTypeControl());
  map.addControl(new GLargeMapControl());
  map.addControl(new GPositionControl());
  map.enableScrollWheelZoom();
  map.enableDoubleClickZoom();
  map.enableContinuousZoom();

  var ads = new GAdsManager(map, 'ca-google-robbery',
    { mode: 'experimental', channel: 16860543});
  ads.enable();

  plotRobbery();
  GEvent.addListener(map, 'moveend', onMoveEndMap);
}





function myclick(i) {
        //alert("Esto es un mensaje de JavaScript");       
        gmarkers[i].openInfoWindowHtml(htmls[i]); 
} 
      





function updateLinkToThisPage() {
  var p = map.getCenter();
  var k = mapTypeToInt(map.getCurrentMapType());
  var mapsApiZoom = map.getZoom();
  var robberyZoom = 17 - mapsApiZoom;
  var hash = 'lt=' + p.lat().toFixed(6) + '&ln=' + p.lng().toFixed(6) + '&z=' +
      robberyZoom + '&k=' + k + '&a=1' + '&tab=' + currentTab.index;
  $.history.load(hash);
  
 /* var ie=(document.all)? true:false;  
  if (ie) window.location.reload(); */
  
  if (prova == "1") {
	window.location.reload();
    prova=0;
	}
	
  
	


  
}


function plotRobbery() {
  var p = curPage;
  var bounds = map.getBounds();
  var sw = bounds.getSouthWest();
  var ne = bounds.getNorthEast();

  urlParameters = {
    'order': currentTab.order,
    'set': currentTab.set,
    'size': 'thumbnail',
    'from': (p - 1) * photosByPage,
    'to': p * photosByPage,
    'minx': sw.lng(),
    'miny': sw.lat(),
    'maxx': ne.lng(),
    'maxy': ne.lat()};
  if (currentTab.hasCheckboxAll && $('#all_layer_checkbox').attr('checked')) {
    urlParameters.set = 'full';
  }

  var loading = $('#tabs > li.active > a > img.loading').css(
      'display', 'inline');
  setTimeout(function() {
      if ('undefined' != typeof loading) {
        loading.css('display', 'none');
      }
    }, 2000);



}


// ******************************************************
function updatePreviews(jsonResponse, textStatus) {
  if (textStatus != 'success') {
    return;
// ******************************************************
  }

  $('#preview').html('');
  var photos = jsonResponse.photos;
  var count = jsonResponse.count;
  var has_more = jsonResponse.has_more;
  $('#tabs > li.active span.total_photos').html(' (' + count + ')');

  var en = '#enabled_next_link';
  var dn = '#disabled_next_link';
  var ep = '#enabled_previous_link';
  var dp = '#disabled_previous_link';

  $(has_more ? en : dn).css('display', 'inline');
  $(has_more ? dn : en).css('display', 'none');

  $(curPage > 1 ? ep : dp).css('display', 'inline');
  $(curPage > 1 ? dp : ep).css('display', 'none');

  if (photos.length == 0) {
    $(currentTab.html).find('img.loading').css('display', 'none');
  }

  var points = [];
  var ids = [];
  for (var i = 0; i < photos.length; i++) {
    var photo = photos[i];
    points.push(new GLatLng(photo.latitude, photo.longitude));
    ids.push(photo.photo_id);
  }

  for (var i = 0; i < photos.length; i++) {
    $('#preview').append(getPreviewDOM(photos[i], i));
  }

  if (photos.length == 0 && curPage > 1) {
    curPage = 1;
  }
}


function getPreviewDOM(photo, i) {
  var id = photo.photo_id;

  var a = document.createElement('A');
  a.href = '/photo/' + id;

  var img = document.createElement('IMG');

  onHoverIn = function() {
    $(this).css('background', '#ff0000');
  };
  onHoverOut = function() {
    $(this).css('background', '#ffffff');
  };
  newAttrs = {
    title: photo.photo_title,
    id: 'r' + id,
    src: photo.photo_file_url,
    p_id: id
  };
  $(img).attr(newAttrs).hover(onHoverIn, onHoverOut);

  var div = document.createElement('DIV');
  div.appendChild(a);
  a.appendChild(img);
  return div;
}


function Dimensions(left, top, width, height) {
  this.left = left;
  this.top = top;
  this.width = width;
  this.height = height;
}


function getDimensions(control) {
  var tmp = control;
  var left = 0;
  var top = 0;

  while (tmp != null) {
    left += tmp.offsetLeft;
    top += tmp.offsetTop;
    tmp = tmp.offsetParent;
  }
  return new Dimensions(left, top, control.offsetWidth, control.offsetHeight);
}


function getWindowHeight() {
  var windowHeight = 0;
  if (typeof(window.innerHeight) == 'number')
    windowHeight = window.innerHeight;
  else if (document.documentElement && document.documentElement.clientHeight)
    windowHeight = document.documentElement.clientHeight;
  else if (document.body && document.body.clientHeight)
    windowHeight = document.body.clientHeight;

  return windowHeight;
}


function getWindowWidth() {
  var windowWidth = 0;
  if (typeof(window.innerWidth) == 'number')
    windowWidth = window.innerWidth;
  else if (document.documentElement && document.documentElement.clientWidth)
    windowWidth = document.documentElement.clientWidth;
  else if (document.body && document.body.clientWidth)
    windowWidth = document.body.clientWidth;

  return windowWidth;
}
