// Infowin class for displaying a miniature info window. Does not
// respond to any events - so you should show and remove the
// overlay yourself as necessary.

function Infowin(latlng, html) {
	map.removeOverlay(infoMarker);
	infoMarker = new Object;
	this_ = infoMarker;
	this_.parent='';
	this_.name="infoMarker";
	this_.latlng_ = latlng;
	this_.html_ = html;
	this_.force_= true;
	this_.prototype = new GControl();

	// Creates the DIV representing the infowindow
	this_.initialize = function(map) {
		var div = $('<div />');
		
		this_.parent= div.css({
				position : 'absolute',
				width : 234
			}).appendTo(map.getPane(G_MAP_FLOAT_PANE))
		
		this_.map_ = map;
		this_.div_ = div;
		
		this_.update(html);
	}

	this_.update = function(html){
		this_.html_ = html;
		
		this_.div_.empty();
		
		$('<div />').css({
				'background' : 'url(images/css/GMapInfoWin-top.png) no-repeat bottom left',
				height : 22,
				padding: '0 0 0 0'
			}).appendTo(this.div_);
		
		gControler=$('<div />').css({
				'background' : 'url(images/css/GMapInfoWin-close.png) no-repeat',
				height : 25,
				width : 20,
				'margin': '-20px 20px 5px 0',
				'cursor': 'pointer',
				'float' : 'right'
			}).appendTo(this.div_);
		
		gControler.click(function(){
				this_.parent.remove();
			});

		var content = $('<div/>').addClass('GMapInfoWin-content').css({
				'position' : 'relative',
				'overflow' : 'hidden',
				'max-height' : 100,
				'font-family' : 'Arial',
				'font-size': 10,
				'top' : 0,
				'padding': '5px 10px'
			}).html(html);
		
		$('<div />').css({
				'background-image' : 'url(images/css/GMapInfoWin-bottom.png)',
				'background-position' : 'bottom left',
				'padding' : '0 10px 25px 10px'
			}).append(content).appendTo(this.div_);
		
		this_.redraw();
	}
	
	// Remove the main DIV from the map pane
	this_.remove = function() {
	  this_.div_.remove();
	}

	// Copy our data to a new instance
	this_.copy = function() {
	  return new Infowin(this_.latlng_, this_.html_);
	}

	// Redraw based on the current projection and zoom level
	this_.redraw = function(force) {
		if(!force){
			return;
		}
		var point = this_.map_.fromLatLngToDivPixel(this_.latlng_);

		// Now position our DIV based on the DIV coordinates of our bounds
		this_.div_.css({
				left : point.x - 108,
				top : point.y - this_.div_.height() 
			});
		point.x += 110;
		var posY =this_.map_.fromDivPixelToLatLng(point);
		point.x -= 220;
		point.y -= this_.div_.height();
		var posX= this_.map_.fromDivPixelToLatLng(point);
		var posMapa= this_.map_.getBounds();
		
		var poligono= new GPolyline([posX,posY],'#FF00FF',5);
		var posPoligono=poligono.getBounds();
		if (this_.force_==true) {
			this_.reUbicar(posMapa, posPoligono);
		}
	}
	
	this_.reUbicar = function(posMapa,posPoligono){
		//alert('reubicando');
		if (!posMapa.containsBounds(posPoligono)) {
			tamMapa= this_.map_.getSize();
			latLng = this_.map_.fromLatLngToContainerPixel(posPoligono.getSouthWest());
			polIzq = latLng.x;
			polAbajo = latLng.y;
			polDer= polIzq + this_.div_.width();
			polArriba = polAbajo - this_.div_.height();
			//alert(polArriba + " :::" + polAbajo);
			if(polIzq<15){
				this_.map_.panBy(new GSize((polIzq*-1)+25,0));
			} else if (polArriba<50){
				this_.map_.panBy(new GSize(0,(polArriba*-1)+65));
			} else if(polDer>tamMapa.width-10){
				this_.map_.panBy(new GSize((tamMapa.width-30-polDer),0));
			} else if (polAbajo>tamMapa.height-10){
				this_.map_.panBy(new GSize(0,(tamMapa.height-20-polAbajo)));
			}
			var posMapa2= this_.map_.getBounds();
			setTimeout(function(){infoMarker.reUbicar(posMapa2,posPoligono) },500);
			this_.force_=false;
			
		} else {
			//alert('ubicado');
			this_.force_=false;
		}
	}
	
}


function mensajeDistancia(html){
	this.html= html;
	this.container="";
	this.prototype = new GControl(false,true);
	
	this.initialize = function(map) {
		this.container = document.createElement("div");
		if (this.html != undefined) {
			$(this.container).html(this.html);
			this.setStyle(this.container);
		} else {
			$(this.container).html('');
		}
		map.getContainer().appendChild(this.container);
		return this.container;
	}
	
	this.getDefaultPosition = function() {
		return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 30));
	}
	
	this.printable = function() {
		return true;
	}
	
	this.selectable=function(){
		return false;
	}
	
	this.update = function (html_value){
		this.html=html_value;
		if (this.html != undefined && this.html!='') {
			$(this.container).html(this.html);
			this.setStyle(this.container);
		} else {
			$(this.container).html('');
			this.setStyleInvisible(this.container);
		}
	}
	
	this.setStyle = function (div) {
		$(div).css({
				'background-color':'#FFFFFF',
				width: '185px',
				//height: '50px',
				'border' : '2px solid #000000',
				'font-family' : 'Arial',
				'font-size' : '11px',
				'text-align' : 'center',
				'padding' : '3px 5px'
			});
	}
	this.setStyleInvisible = function (div) {
		$(div).css({
			width:'0px', 'border':'0px', 'padding':'0px'
		});
	}
}


marcadoresMapas= new Array();
function quitarMarcadoresMapas(){
	total=marcadoresMapas.length;
	for (var i = 0; i < total; i++) {
		map.removeOverlay(eval(marcadoresMapas.pop()));
	}
}

markerActivo='';
function activarMarkerWin(index){
	if(markerActivo!=''){
		$("#mark_"+markerActivo).css({'background' : ' url(images/maps/point2.png) no-repeat'});
	}
	markerActivo=index;
	$("#mark_"+index).css({'background' : ' url(images/maps/point2-activo.png) no-repeat'});
	document.getElementById("my_chart").marcar_elemento_flash(index);
}


function markerWin(latlng, index) {
	this.parent='';
	this.name="markerInfo" + index ;
	this.latlng_ = eval(latlng + ");"); //hack por el split que hacemos al datos.
	this.html_ = "";
	this.force_= true;
	this.index_=index;
	this.prototype = new GControl();

	// Creates the DIV representing the infowindow
	this.initialize = function(map) {
		var div = $('<div />');
		this.parent= div.css({
				position : 'absolute',
				width : 12,
				height:12
			}).appendTo(map.getPane(G_MAP_FLOAT_PANE));
		
		this.map_ = map;
		this.div_ = div;
		this.update('');
	}

	this.update = function(html){
		this.html_ = html;
		this.div_.empty();
		this.gControler=$('<div id="mark_'+this.index_+'" />').css({
				'background' : ' url(images/maps/point2.png) no-repeat',
				//'background' : '#FFFFFF',
				//'border':'1px solid #000000',
				height : 12,
				width : 12,
				'cursor': 'pointer',
				padding: '0 0 0 0',
				'margin' : '6px'
			}).appendTo(this.div_);
		
		eval("this.gControler.click(function(){ activarMarkerWin("+this.index_+");	}); ");
		this.redraw(true);
	}
	
	// Remove the main DIV from the map pane
	this.remove = function() {
	  this.div_.remove();
	}

	// Copy our data to a new instance
	this.copy = function() {
	  return new markerWin(this.latlng_, this.index_);
	}
	// Redraw based on the current projection and zoom level
	this.redraw = function(force) {
		if(!force){
			return;
		}
		var point = this.map_.fromLatLngToDivPixel(this.latlng_);
		// Now position our DIV based on the DIV coordinates of our bounds
		this.div_.css({
				left : point.x - 10,
				top : point.y - this.div_.height()
			});
	}
	return this;
	
}


//debugguer js de objetos 
function var_dump(obj,div){
	var temp = "";
	if (div == "undefined") {
		for (x in obj) {
			//temp += x + ": " + obj[x] + "\n";
			temp += x + "\n";
		}
		alert(temp);
	} else {
		for (x in obj) {
			temp += x + ": " + obj[x] + "<br>";
			//temp += x + "<br>";
		}
		$(div).html(temp);
	}
}

