// Este .js faz o controle da combo de estado/cidade/concessionária
// e faz a integração em um mapa.

// Variável global de controle

// Para controle das janelas dos detalhes da concessionárias no mapa

// Inicializa as variáveis e os componentes

var tag_once = false;

var data_obj;

function init(selectEstado, selectCidade, selectBairro, mapCanvas,  concessionariasDiv) {
	var MAP_API = new Object();
	
	MAP_API.mapCanvas = mapCanvas; // $('#map_canvas');
	MAP_API.selectEstado = selectEstado; // $("select#estados")
	MAP_API.selectCidade = selectCidade; // $("select#cidades")
	MAP_API.selectBairro = selectBairro; // $("select#bairros")
	MAP_API.concessionariasDiv = concessionariasDiv; // $('#concessionariasDiv')
	
	MAP_API.estados = new Array();
	MAP_API.cidades = new Array();
	MAP_API.concessionarias = new Array();
	MAP_API.markers = new Array();
	
	if(MAP_API.selectCidade) {
		MAP_API.selectEstado.change(function(){
			changeComboEstado($(this).val(), MAP_API);
		});
	}

	if(MAP_API.mapCanvas) {
		MAP_API.selectCidade.change(function(){
			changeComboCidade($(this).val(), MAP_API);
		});
		
		if(MAP_API.selectBairro) {
			MAP_API.selectBairro.change(function(){
				changeComboBairro($(this).val(), MAP_API);
			});
		}
		
	}

	if(!data_obj) {
		loadData(MAP_API);
	} else {
		initTela(data_obj, MAP_API);
	}
}

// Funcao Ajax recursiva. Se não conseguir conectar, tenta novamente, se conseguir popula os campos da tela
function loadData(MAP_API) {
	jQuery.ajax({
		url: serverAddr + 'ajax/concessionariaJSON.htm?callback=?',
		dataType: 'json',
		success: function(data) {initTela(data, MAP_API);},
		error: function() {loadData(MAP_API);},
		timeout: 10000
	});
}

// Faz o deslocamento para o mapa. Se o objeto não possuir latitude e longitude, busca o endereço e seta o resultado  
// no objeto para Futuras buscas
function panTo(object, endereco, MAP_API) {
	if(MAP_API.mapCanvas){
		if(object.lat && object.lng) {
			var latlng = new google.maps.LatLng(object.lat, object.lng);
			MAP_API.mapCanvas.gmap('getMap').panTo(latlng);
		} else {
			MAP_API.mapCanvas.gmap('search', {'address': endereco + ', Brasil'}, function(found, results) {
				if(found) {
					MAP_API.mapCanvas.gmap('getMap').panTo(results[0].geometry.location);
					MAP_API.mapCanvas.gmap({'zoom':5});
					object.lat = results[0].geometry.location.lat();
					object.lng = results[0].geometry.location.lng();
				}
		    });
		}
	}
}

// Preenche a tela com os dados iniciais
// data segue o formato JSON abaixo:
// {"estados":
//		[{"id":22,"nome":"AC","cidades":
//			[{"id":57,"nome":"RIO BRANCO","endereço""endereco":"Rod. AC 01 Km 02, Sala B TRIÂNGULO CEP:69901180 RIO BRANCO AC":,"concessionarias":
//				[{"id":74,"nome":"PORTO RIO BRANCO"}]}]
//			}]
//		}]
//  }
function createOption (label, id) {
	return $('<option></option>').val(id).html(label)[0];
}

function initTela(data, MAP_API) {
	data_obj = data;
	
	var optionsE = new Array();
	if(MAP_API.selectCidade) {
		optionsE.push(createOption('Estado', ''));
	}
	
	$.each(data.estados, function(idxE, ctxE) {
		if(MAP_API.selectCidade) {
			optionsE.push(createOption(ctxE.nome, ctxE.id));
		} else {
			optionsE.push(createOption(ctxE.nome, ctxE.uf));
		}
		MAP_API.estados[ctxE.id] = new Object();
		MAP_API.estados[ctxE.id].estado = ctxE;
		var cidadesArr = new Array();
		$.each(ctxE.cidades, function(idxCi, ctxCi) {
			cidadesArr[ctxCi.id] = new Object();
			cidadesArr[ctxCi.id].cidade = ctxCi;
			MAP_API.cidades[ctxCi.id] = new Object();
			MAP_API.cidades[ctxCi.id].cidade = ctxCi;
			var concessionariasArr = new Array();
			$.each(ctxCi.concessionarias, function(idxCo, ctxCo) {
				concessionariasArr[ctxCo.id] = new Object();
				concessionariasArr[ctxCo.id].concessionaria = ctxCo;
				MAP_API.concessionarias[ctxCo.id] = new Object();
				MAP_API.concessionarias[ctxCo.id].concessionaria = ctxCo;
			});
			var concessionariasSort = concessionariasArr.sort(sortConcessionarias);
			cidadesArr[ctxCi.id].concessionarias = concessionariasSort;
			MAP_API.cidades[ctxCi.id].concessionarias = concessionariasSort;
		});
		MAP_API.estados[ctxE.id].cidades = cidadesArr.sort(sortCidades);
	});

	var idEstadoAnt = MAP_API.selectEstado.val();
	
	MAP_API.selectEstado.html(optionsE);
	
	if(MAP_API.mapCanvas) {
		initMap(MAP_API.mapCanvas);
	}
	
	var populouSelects = populaSelects(MAP_API, idEstadoAnt);

	if(!populouSelects) {
		preencheDivConcessionarias(MAP_API.concessionarias, true, MAP_API);
	}
}

function sortConcessionarias(c1, c2) {
	var A = c1.concessionaria.nome.toLowerCase();
	var B = c2.concessionaria.nome.toLowerCase();
	if (A < B){
		return -1;
	}else if (A > B){
		return  1;
	}else{
		return 0;
	}
}

function sortCidades(c1, c2) {
	var A = c1.cidade.nome.toLowerCase();
    var B = c2.cidade.nome.toLowerCase();
    if (A < B){
       return -1;
    }else if (A > B){
      return  1;
    }else{
      return 0;
    }
}

function initMap(map) {
// Inicializa o mapa. As coordenadas abaixo correspondem ao centro do Brasil.
	if(map) {
		var latlng = new google.maps.LatLng(-23.548943,-46.638818);
		map.gmap({'zoom':4, 'center':latlng});
	}
}

// Decodifica os parâmetros passados da tela anterior de busca e popula nos selects
function populaSelects(MAP_API, estadoIdAnt){
	var parameters = {};

	document.location.search.replace(/\??(?:([^=]+)=([^&]*)&?)/g, function () {
	    function decode(s) {
	        return decodeURIComponent(s.split("+").join(" "));
	    }

	    parameters[decode(arguments[1])] = decode(arguments[2]);
	});

	var estadoId = estadoIdAnt;

	var cidadeId = parameters["cidades"];
	if(!estadoId) {
		estadoId = parameters["estados"];
	}
	
	if(cidadeId != ""){
		tag_once = true;
	}
	if(cidadeId == "" && estadoId == ""){
		 trackPageGoogle("/concessionarias");
	}
	
	

	var populou = false;
	if(estadoId) {
		MAP_API.selectEstado.val(estadoId);
		MAP_API.selectEstado.change();
		populou = true;
	}
	
	if(cidadeId) {
		MAP_API.selectCidade.val(cidadeId);
		MAP_API.selectCidade.change();
		populou = true;
	}
	
	
	return populou;
}

function preencheDivConcessionarias(concessionarias, somenteMarker, MAP_API) {
	if(MAP_API.concessionariasDiv && MAP_API.mapCanvas) {
		$.each(MAP_API.markers, function(idxIw, ctxIw) {
			ctxIw.infowindow.close();
			ctxIw.marker.setMap(null);
		});
		MAP_API.markers = new Array()

		// Busca o scrollable
		var api = MAP_API.concessionariasDiv.parent().data("scrollable");
		// Limpa os botões de navegação
		$('.navi').empty();
		// Limpa os itens para repopular as concessionarias
		api.getItems().each(function(item){
			api.getItems().remove(item);
		});
		
		var div = $(document.createElement('div'));
		var idx = 0;
		var add = false;

		$.each(concessionarias, function(idxCo, ctxCo) {
			if(ctxCo) {
				idx++;
				add = false;

				var p = $(document.createElement('p'));
				p.attr('class', 'text');
				var c = ctxCo.concessionaria;
				// Endereço de exibição na div lateral
				var concessionariaStr = '<div><b>' + c.nome + '</b></div>'
				var endereco = c.endereco + ', ' + c.numero + ' ' + c.complemento;
				endereco += '<br/>CEP ' + c.cep + '<br/>';
				endereco += getTelefones(c);
				var link = $(document.createElement ('A'));
				link.append(document.createTextNode ('Ver no mapa'));
				link.attr('href', 'javascript:;');
				link.attr('class', 'btnMapa');
				p.append(concessionariaStr).append('<br/>' + endereco + '<br/>').append(link);
				div.append(p);

				// Insere a busca de 3 em 3
				if(idx % 3 == 0 && !somenteMarker) {
					api.addItem(div);
					div = $(document.createElement('div')); 
					add = true;
//					hideNav();
				}
				
				
				// Adiciona o marker, infowindow e associa o link a infowindow
				if(c.lat && c.lng) {
					MAP_API.mapCanvas.gmap('addMarker', { 'position': new google.maps.LatLng(c.lat, c.lng), 'icon':'../img/concessionarias/pin_nissan.png' }, function(map, marker) {
						var pIw = $(document.createElement('p'));
						pIw.attr('class', 'infoWindow');
						var content = '<h3>' + c.nome + '</h3><div>' + c.endereco + ', ' + c.numero + ' ' + c.complemento + '</div><div>' + c.bairro + '</div><div style="padding-bottom:10px">CEP: ' + c.cep + '</div>';
						content += getTelefones(c);
						pIw.append(content);
						var markerObj = new Object();
						var iw = MAP_API.mapCanvas.gmap('addInfoWindow', { 'position':new google.maps.LatLng(c.lat, c.lng), 'content': pIw[0] }, function(iw) {
							markerObj.marker = marker;
							markerObj.infowindow = iw;
							
							$(marker).click(function() {
								// Fecha todas as infoWindows antes de abrir
								$.each(MAP_API.markers, function(idxIw, ctxIw) {
									ctxIw.infowindow.close();
								})
								iw.open(map, marker);
								map.panTo(marker.getPosition());
								loadPanoramio(iw, marker.getPosition());
							});
						});
						MAP_API.markers.push(markerObj);
						$(link).click(function() {
							trackEventGoogle('concessionarias', 'ver-mapa', c.nome);
							$(marker).triggerEvent('click');
							return false;
						});
					});
				}
			}
		});
		
		if(idx <= 3 || idx > 50){
			hideNav();
		} else {
			showNav();
		}

		if(idx < 50 ){
			if(tag_once){
				tag_once = false;
			} else {
				trackPageGoogle("/concessionarias/resultado-de-busca");
			}
		}
		
		// Volta para o início da navegação
		if(!add && !somenteMarker) {
			api.addItem(div);
		}
		api.begin();
		
		
		
	}
}


function getTelefones(c) {
	var content = '';
	$.each(c.telefones, function (idxT, ctxT){
		if(ctxT.tipo==0) {
			content += 'TEL: ';
		} else if(ctxT.tipo == 1) {
			content += 'FAX: ';
		} else {
			content += 'CEL: ';
		}
		content += ctxT.telefone + '<br/>';
	});
	return content;
}

// Evento de mudança do combo estado
function changeComboEstado(estadoId, MAP_API) {
	var optionsCi = new Array();
	optionsCi.push(createOption('Cidade', ''));
	
	var optionsBa = new Array();
	optionsBa.push(createOption('Bairro', ''));
	
	var estado = MAP_API.estados[estadoId];
	if(estadoId && estado) {
		var concessionariasArr = new Array();
		var bairrosArr = new Array();
		panTo(estado.estado, estado.estado.nome, MAP_API);
		$.each(estado.cidades, function(idxCi, ctxCi) {
			if(ctxCi) {
				optionsCi.push(createOption(ctxCi.cidade.nome, ctxCi.cidade.id));
				$.each(ctxCi.concessionarias, function(idxCo, ctxCo) {
					if(ctxCo) {
						concessionariasArr[ctxCo.concessionaria.id] = ctxCo;
						if(bairrosArr.indexOf(ctxCo.concessionaria.bairro) < 0) {
							bairrosArr.push(ctxCo.concessionaria.bairro);
						}
					}
				});
			}
		});
		
		$.each(bairrosArr.sort(), function(idxBa, ctxBa){
			optionsBa.push(createOption(ctxBa, ctxBa));
		});
		
		preencheDivConcessionarias(concessionariasArr, false, MAP_API);
		
	} else {
		preencheDivConcessionarias(MAP_API.concessionarias, true, MAP_API);
		initMap(MAP_API.mapCanvas);
	}
	MAP_API.selectCidade.html(optionsCi);
	if(MAP_API.selectBairro){
		MAP_API.selectBairro.html(optionsBa);
	}
}

//Evento de mudança do combo cidade
function changeComboCidade(cidadeId, MAP_API) {
	var cidade = MAP_API.cidades[cidadeId]
	if(cidadeId && cidade) {
		var optionsBa = new Array();
		optionsBa.push(createOption('Bairro', ''));
		
		var bairrosArr = new Array();
		var concessionariasArr = new Array();
		panTo(cidade.cidade, cidade.cidade.nome, MAP_API);
		$.each(cidade.concessionarias, function(idxCo, ctxCo) {
			if(ctxCo) {
				//Preenche array de bairros
				if(bairrosArr.indexOf(ctxCo.concessionaria.bairro) < 0) {
					bairrosArr.push(ctxCo.concessionaria.bairro);
				}
				concessionariasArr[ctxCo.concessionaria.id] = ctxCo;
			}
		});
		
		$.each(bairrosArr.sort(), function(idxBa, ctxBa){
			optionsBa.push(createOption(ctxBa, ctxBa));
		});

		preencheDivConcessionarias(concessionariasArr, false, MAP_API);
		if(MAP_API.selectBairro) {
			MAP_API.selectBairro.html(optionsBa);
		}
	} else {
		MAP_API.selectEstado.change();
	}
}

//Evento de mudança do combo bairro
function changeComboBairro(bairro, MAP_API) {
	var estadoId = MAP_API.selectEstado.val();
	var estado = MAP_API.estados[estadoId]
	
	if(estadoId && estado && bairro) {
		var concessionariasArr = new Array();

		$.each(estado.cidades, function(idxCi, ctxCi) {
			if(ctxCi){
				$.each(ctxCi.cidade.concessionarias, function(idxCo, ctxCo) {
					if(ctxCo && ctxCo.bairro == bairro) {
						concessionariasArr[ctxCo.id] = MAP_API.concessionarias[ctxCo.id];
					}
				});
			}
		});
		
		preencheDivConcessionarias(concessionariasArr, false, MAP_API);
	}
}

function loadPanoramio(iw, pos) {
	var src = 'http://www.panoramio.com/map/get_panoramas.php?set=4766818&from=0&to=1&callback=?';
	src += '&minx=' + pos.lng() + '&maxx=' + pos.lng() + '&miny=' + pos.lat() + '&maxy=' + pos.lat();
//	src +='&minx=-180&miny=-90&maxx=180&maxy=90&size=thumbnail&mapfilter=true'
	jQuery.ajax({
		url: src,
		dataType: 'json',
		success: function(data) {loadPanoramioIW(iw, data)},
		error: function() {}
	});
}

function loadPanoramioIW(iw, data) {
	if(data && typeof data.photos != "undefined" && data.photos.length > 0) {
		var div = document.createElement('div');
		div.className='panoramio';
		var p = data.photos[0];
		var html = iw.getContent();
		html += '<a href="' + p["photo_url"] + '" target="_blank">' + '<img src="';
		html += p["photo_file_url"] + '" title="' + p["photo_title"] + '" alt="';
		html += p["photo_title"] + '">' + '</a>';
		$(div).html(html);
		iw.setContent(html);
	}
}

function hideNav(){
	$("div.navi").hide();
	$("a.prev").hide();
	$("a.next").hide();
}
function showNav(){
	$("div.navi").show();
	$("a.prev").show();
	$("a.next").show();
}