<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Mapa</title>
<link rel="stylesheet" href="/solbus/style.css" type="text/css">
<script src="http://maps.google.com/maps?file=api&v=2&sensor=true_or_false&key=ABQIAAAAInWGLDEdM8V4nJErgz5ojBRAxeJ8iULgW-6sVNO1tQiF-XQhYxRg_Xxa1hC-MpcNiTHFeSv0lDfw2Q" type="text/javascript"></script>
</head>
<body onload='mapaStart()' onunload='GUnload()'>
<script type='text/javascript'>
//<![CDATA[
var mapa;
var markery=[];
var markery1=[];
function odswiezSidebar()
{
var html='<ul style="height: 529px; overflow: auto;">'
var licznik=0;
for(i=0; i<markery.length; i++)
{
if(!markery[i].isHidden())
{
html+='<li><a href="#" onclick="markery['+i+'].pokazInfo(); return false;"><b>'+markery[i].miasto1+'</b> <br /> '+markery[i].ulica1+'</a></li>';
licznik++;
}
}
html+='</ul>';
if(licznik!=i)
html='<div id="obiekt"><h2>Obiekty</h2><h3>Wyswietlono <strong>'+licznik+'</strong> z <strong>'+i+'</strong> obiektów</h3></div>'+html;
else
html='<div id="obiekt"><h2>Obiekty</h2></div>'+html;
document.getElementById('sidebar').innerHTML=html;
}
// ta funkcja jest wywoływana przy kliknięciu na pole checkbox
function przerysuj(checkbox,wazne)
{
// je¶li kliknięty checkbox jest zaznaczony, to wywołujemy funkcję z parametrem, mówi±cym że ma pokazać markery
// je¶li kliknięty checkbox nie jest zaznaczony, to wywołujemy funkcję z parametrem, mówi±cym że ma ukryć markery
if(document.getElementById(checkbox).checked)
ukryjPokazKategorie(wazne,true);
else
ukryjPokazKategorie(wazne,false);
odswiezSidebar();
}
// ta funkcja pokazuje lub ukrywa markery danej kategorii, zgodnie z przekazanymi argumentami
function ukryjPokazKategorie(wazne,pokaz)
{
// kategoria oznacza id kategorii której widzialno¶ć trzeba zmienić
// je¶li pokaz = false, to znaczy że mamy ukryć, w przeciwnym wypadku pokazać
// dla każdego z markerów
for(var i=0; i<markery.length; i++)
{
// je¶li poszukiwana kategoria jest kategori± markera
if(markery[i].wazne==wazne)
{
// to go ukrywamy lub pokazujemy, w zależno¶ci od argumetu pokaz
if(pokaz==true)
markery[i].show();
else
markery[i].hide();
}
}
}
GMarker.prototype.pokazInfo=function()
{
this.openInfoWindowTabsHtml(this.opis1);
};
// Checkbox otoczenia
// ta funkcja jest wywoływana przy kliknięciu na pole checkbox
function rysuj(checkbox,nazwa)
{
// je¶li kliknięty checkbox jest zaznaczony, to wywołujemy funkcję z parametrem, mówi±cym że ma pokazać markery
// je¶li kliknięty checkbox nie jest zaznaczony, to wywołujemy funkcję z parametrem, mówi±cym że ma ukryć markery
if(document.getElementById(checkbox).checked)
ukryjPokazNazwa(nazwa,true);
else
ukryjPokazNazwa(nazwa,false);
}
var ikonaTak = new GIcon();
ikonaTak.image = 'http://projekty.svp.pl/ikonki/solbus1.png';
ikonaTak.iconSize = new GSize(45, 45);
ikonaTak.iconAnchor = new GPoint(15, 12);
ikonaTak.shadow = 'http://projekty.svp.pl/ikonki/solbus_c.png';
ikonaTak.infoWindowAnchor = new GPoint(20,20);
var ikonaNie= new GIcon();
ikonaNie.image = 'http://projekty.svp.pl/ikonki/solbus.png';
ikonaNie.iconSize = new GSize(30, 30);
ikonaNie.iconAnchor = new GPoint(15, 12);
ikonaNie.shadow = 'http://projekty.svp.pl/ikonki/solbus1_c.png';
ikonaNie.infoWindowAnchor = new GPoint(15,12);
var ikona = [];
ikona["tak"] = ikonaTak;
ikona["nie"] = ikonaNie;
function mapaStart()
{
if(GBrowserIsCompatible())
{
mapa = new GMap2(document.getElementById("mapka"),G_NORMAL_MAP);
mapa.setCenter(new GLatLng(52.1234804, 19.0084378), 6);
// kontrolki mapy
mapa.addControl(new GLargeMapControl());
mapa.enableDoubleClickZoom();
mapa.enableContinuousZoom();
mapa.enableScrollWheelZoom();
GDownloadUrl('/solbus/wczytaj2.php', function(dane,kodOdpowiedzi)
{
if(kodOdpowiedzi==200)
{
var xml = GXml.parse(dane);
var markery = xml.documentElement.getElementsByTagName("marker");
for(var i=0; i<markery.length; i++)
{
var id = markery[i].getAttribute("id");
var punkt = new GLatLng(parseFloat(markery[i].getAttribute("lat")),
parseFloat(markery[i].getAttribute("lng")));
var miasto = markery[i].getAttribute("miasto");
var ulica = markery[i].getAttribute("ulica");
var wazne = markery[i].getAttribute("wazne");
var nazwa = markery[i].getAttribute("nazwa");
var tel = markery[i].getAttribute("tel");
var fax = markery[i].getAttribute("fax");
var marker = dodajMarker(id,punkt,miasto,ulica,wazne,nazwa,tel,fax);
}
odswiezSidebar();
//alert('Wczytano '+markery.length+' markerów z bazy danych');
}
else
{
alert('Nie mogłem wczytać danych');
}
}
);
}
}
function dodajMarker(id,punkt,miasto,ulica,wazne,nazwa,tel,fax)
{
opis = '<div id="dymek"><h3>'+miasto+'</h3><h4>ulica: '+ulica+'</h4><h5><b>'+nazwa+'</b> <br /> '+tel+'<br /> '+fax+'</h5><br />';
var infoTabs = [
new GInfoWindowTab("Opis", opis),
];
var marker = new GMarker(punkt, ikona[wazne]);
marker.opis1 = infoTabs;
marker.ulica1 = ulica;
marker.miasto1 = miasto;
mapa.addOverlay(marker);
marker.wazne = wazne;
markery.push(marker);
GEvent.addListener(marker,"click",function()
{
marker.pokazInfo();
});
return marker;
}
// ]]>
</script>
<table>
<tr>
<td>
<div id='mapka' >
<!-- tu będzie mapa -->
</div>
</td>
<td style=" width:200px; vertical-align: top;" id="sidebar">
</td>
</tr>
</table>
</body>
</html>