czfgmap

Subversion Repositories:

[/] [index.php] - Diff between revs 8 and 9

Rev 8 Rev 9

Line 49... Line 49...

} }

</style> </style>

<script src="http://maps.google.com/maps?file=api&v=2&key='.$GMapKey.'" <script src="http://maps.google.com/maps?file=api&v=2&key='.$GMapKey.'"

type="text/javascript"></script> type="text/javascript"></script>

<script src="http://www.google.com/uds/api?file=uds.js&v=1.0" type="text/javascript"></script> <script src="http://www.google.com/uds/api?file=uds.js&v=1.0" type="text/javascript"></script>

<script src="http://www.google.com/uds/solutions/localsearch/gmlocalsearch.js" type="text/javascript"></script> <script src="http://www.google.com/uds/solutions/localsearch/gmlocalsearch.js" type="text/javascript"></script>

<script type="text/javascript"> <script type="text/javascript">

//<![CDATA[

//### Globalni promenne ################################# //### Globalni promenne #################################

var CurrentDatabase = "czfmutf"; var CurrentDatabase = "czfmutf";

var NodeLimit = "200"; var NodeLimit = "200";

var NodeOrder = "ASC"; var NodeOrder = "ASC";

var NodeSortBy = "name"; var NodeSortBy = "name";

var Where = ""; var Where = "";

var LoadedNodes = new Array(); var LoadedNodes = new Array();

var LoadedLinks = new Array();

var map; var map;

var NodeIcon = new Array(); var NodeIcon = new Array();

var DatabaseNodeTables = new Array(); var DatabaseNodeTables = new Array();

var AutoFetchMode = true; var AutoFetchMode = true;

var AutoClearMode = true; var AutoClearMode = true;

Line 75... Line 78...

var PtA = new Array(); var PtA = new Array();

var PtB = new Array(); var PtB = new Array();

var PtC = new Array(); var PtC = new Array();

var PtPt = 1; var PtPt = 1;

var PtNum = 0; var PtNum = 0;

var MapSizeX = 800;

var MapSizeY = 600;

var MapCenterLat = 50.123567;

var MapCenterLon = 14.496258;

var MapZoom = 15;

var MapName = "Mapa";

var saved=[];

var LinkColType = new Array(); var LinkColType = new Array();

LinkColType["00000001"] = "#00aa00"; LinkColType["00000001"] = "#00aa00";

LinkColType["00000001"] = "#00FF00"; LinkColType["00000001"] = "#00FF00";

var LinkColTypeWifiBackbone = "#fafa00"; var LinkColTypeWifiBackbone = "#fafa00";

Line 108... Line 119...

} }

} }

//### Uvodni funkce ################################# //### Uvodni funkce #################################

function load() { function load() {

MapLoad();

LoadSettings();

}

function MapLoad() {

if (GBrowserIsCompatible()) { if (GBrowserIsCompatible()) {

map = new GMap2(document.getElementById("map"),{draggableCursor: \'crosshair\', draggingCursor: \'pointer\'}); map = new GMap2(document.getElementById("map"),{draggableCursor: \'crosshair\', draggingCursor: \'pointer\'});

map.addControl(new GLargeMapControl()); map.addControl(new GLargeMapControl());

map.addControl(new GMapTypeControl()); map.addControl(new GMapTypeControl());

map.addControl(new GOverviewMapControl()); var MapCenter = new GLatLng(MapCenterLat, MapCenterLon);

map.setCenter(new GLatLng(50.123567, 14.496258), 15); map.setCenter(MapCenter, MapZoom);

map.enableScrollWheelZoom(); map.enableScrollWheelZoom();

map.addControl(new GScaleControl()); map.addControl(new GScaleControl());

map.addControl(new MDControl());

// Selecting map type

var MapTypes = map.getMapTypes();

for(var i = 0; i < MapTypes.length; i++) {

if (MapName == MapTypes[i].getName()) map.setMapType(MapTypes[i]);

}

map.addControl(new GOverviewMapControl());

map.addControl(new google.maps.LocalSearch(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,20))); map.addControl(new google.maps.LocalSearch(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,20)));

//tohle zajisti znovunacteni nodu po presunu //tohle zajisti znovunacteni nodu po presunu

GEvent.addListener(map, "moveend", HandleMapMoveEnd); GEvent.addListener(map, "moveend", HandleMapMoveEnd);

//ziskani souradnic po kliknuti //ziskani souradnic po kliknuti

GEvent.addListener(map, \'click\', function(overlay, point) { if(point) { HandleNextPoint(point) }} ); GEvent.addListener(map, \'click\', function(overlay, point) { if(point) { HandleNextPoint(point) }} );

//tohle zajisti vypis pri startu //tohle zajisti vypis pri startu

var center = map.getCenter(); var center = map.getCenter();

document.getElementById("souradnice").innerHTML = CurrentDatabase + "<br>Souradnice stredu:" + center.toString() + "<br>Rozsah: " + map.getBounds()+"<br>Zvetseni: " + map.getZoom(); document.getElementById("SouradniceStredu").innerHTML = CurrentDatabase + "<br>Souradnice stredu:" + center.toString() + "<br>Rozsah: " + map.getBounds()+"<br>Zvetseni: " + map.getZoom();

//tohle zajisti prubezny vypis //tohle zajisti prubezny vypis

GEvent.addListener(map, "moveend", function() { GEvent.addListener(map, "moveend", function() {

var center = map.getCenter(); var center = map.getCenter();

document.getElementById("souradnice").innerHTML = CurrentDatabase + " " + map.getBounds().getSouthWest().lat() + "<br>Souradnice stredu: " + center.toString() + "<br>Rozsah: " + map.getBounds()+"<br>Zvetseni: " + map.getZoom(); document.getElementById("SouradniceStredu").innerHTML = CurrentDatabase + " " + map.getBounds().getSouthWest().lat() + "<br>Souradnice stredu: " + center.toString() + "<br>Rozsah: " + map.getBounds()+"<br>Zvetseni: " + map.getZoom();

}); });

document.getElementById("AutoFetchModeCheckButton").checked = true;

document.getElementById("AutoClearModeCheckButton").checked = true;

document.getElementById("NodeLimitSelectBox").value = NodeLimit;

document.getElementById("databaze").innerHTML = CurrentDatabase;

//prvotni zobrazeni

ClearOverlayAndData();

NodeLayer();

var pts = new Array();

// pts.push (new GLatLng(50.120771, 14.486246));

pts.push (new GLatLng(50.118212, 14.484079));

pts.push (new GLatLng(50.118707, 14.491160));

} }

} }

//### Ostatni funkce ########################### //### Ostatni funkce ###########################

Line 213... Line 224...

LinkColOpacity = 0.2; LinkColOpacity = 0.2;

LinkColBg = "#0000FF"; LinkColBg = "#0000FF";

LinkStyle = "dash"; LinkStyle = "dash";

} }

// DebugPrint(":"+ inplanning + ":"); // DebugPrint(":"+ inplanning + ":");

var Linepts = new Array();

Linepts = [LoadedNodes[id1],LoadedNodes[id2]];

LineLength = Math.round(GetLineLength(Linepts[0].lat(), Linepts[0].lng(), Linepts[1].lat(), Linepts[1].lng()));

var polyOptions = {geodesic:false}; var polyOptions = {geodesic:false};

var polyline = new GPolyline([LoadedNodes[id1],LoadedNodes[id2]], LinkColBg, 3 + LinkSize, LinkColBgOpacity, polyOptions); var polyline = new GPolyline([LoadedNodes[id1],LoadedNodes[id2]], LinkColBg, 3 + LinkSize, LinkColBgOpacity, polyOptions);

map.addOverlay(polyline); map.addOverlay(polyline);

Line 249... Line 256...

}); });

} }

//############################## //##############################

function HandleNextPoint(point) { function HandleNextPoint(point) {

var Distance = 0;

document.getElementById("NodeCoordinates").innerHTML = (point.y.toFixed(6)+\'x\'+point.x.toFixed(6)); document.getElementById("NodeCoordinates").innerHTML = (point.y.toFixed(6)+\'x\'+point.x.toFixed(6));

if ( PtPt == 1 ) { if ( PtPt == 1 ) {

document.getElementById("NodeCoordinatesA").innerHTML = (\'A \'+point.y.toFixed(6)+\'x\'+point.x.toFixed(6)); document.getElementById("NodeCoordinatesA").innerHTML = (\'A \'+point.y.toFixed(6)+\'x\'+point.x.toFixed(6));

Line 271... Line 277...

PtPt = PtPt + 1; PtPt = PtPt + 1;

if ( PtPt > 3 ) { PtPt = 1; } if ( PtPt > 3 ) { PtPt = 1; }

PtNum = PtNum + 1; PtNum = PtNum + 1;

// document.getElementById("NodeDistanceBC").innerHTML = (\'C \'+point.y.toFixed(6)+\'x\'+point.x.toFixed(6));

// document.getElementById("NodeDistanceABC").innerHTML = (\'ss\');

if ( PtNum > 1 ) { if ( PtNum > 1 ) {

Distance = Math.round(GetLineLength(PtA.lat(), PtA.lng(), PtB.lat(), PtB.lng())); var DistanceAB = Math.round(GetLineLength(PtA, PtB));

document.getElementById("NodeDistanceAB").innerHTML = Distance; document.getElementById("NodeDistanceAB").innerHTML = DistanceAB+\'m\';

document.getElementById("NodeDistanceBA").innerHTML = Distance; document.getElementById("NodeDistanceBA").innerHTML = DistanceAB+\'m\';

} }

if ( PtNum > 2 ) { if ( PtNum > 2 ) {

Distance = Math.round(GetLineLength(PtC.lat(), PtC.lng(), PtB.lat(), PtB.lng())); var DistanceBC = Math.round(GetLineLength(PtC, PtB));

document.getElementById("NodeDistanceBC").innerHTML = Distance; document.getElementById("NodeDistanceBC").innerHTML = DistanceBC+\'m\';

document.getElementById("NodeDistanceCB").innerHTML = Distance; document.getElementById("NodeDistanceCB").innerHTML = DistanceBC+\'m\';

document.getElementById("NodeDistanceABC").innerHTML = 1 * Distance + 1 * document.getElementById("NodeDistanceBA").innerHTML; var DistanceAC = Math.round(GetLineLength(PtC, PtA));

Distance = Math.round(GetLineLength(PtC.lat(), PtC.lng(), PtA.lat(), PtA.lng())); document.getElementById("NodeDistanceAC").innerHTML = DistanceAC+\'m\';

document.getElementById("NodeDistanceAC").innerHTML = Distance; document.getElementById("NodeDistanceCA").innerHTML = DistanceAC+\'m\';

document.getElementById("NodeDistanceCA").innerHTML = Distance;

document.getElementById("NodeAngleACB").innerHTML = Math.round(GetAngle(PtA, PtC, PtB))+\'st\';

document.getElementById("NodeAngleBAC").innerHTML = Math.round(GetAngle(PtB, PtC, PtA))+\'st\';

document.getElementById("NodeAngleCBA").innerHTML = Math.round(GetAngle(PtC, PtA, PtB))+\'st\';

document.getElementById("NodeDistanceBAC").innerHTML = ( DistanceAB + DistanceAC ) +\'m\';

document.getElementById("NodeDistanceABC").innerHTML = ( DistanceAB + DistanceBC ) +\'m\';

document.getElementById("NodeDistanceBCA").innerHTML = ( DistanceBC + DistanceAC ) +\'m\';

} }

}

document.getElementById("NodeAngleACB").innerHTML = (point.y.toFixed(6)+\'x\'+point.x.toFixed(6)); //##############################

document.getElementById("NodeAngleBAC").innerHTML = (point.y.toFixed(6)+\'x\'+point.x.toFixed(6)); function GetAngle(PA, PB, PC) {

document.getElementById("NodeAngleCBA").innerHTML = (point.y.toFixed(6)+\'x\'+point.x.toFixed(6)); var a = GetLineLength(PC, PB);

var b = GetLineLength(PC, PA);

var c = GetLineLength(PA, PB);

var s = ( a + b + c ) / 2;

var alfa = (360/Math.PI)*Math.asin(Math.sqrt((s-b)*(s-c)/(b*c)));

return alfa;

} }

//############################## //##############################

function GetLineLength(Lat1, Lon1, Lat2, Lon2) { function GetLineLength(PA, PB) {

var Lat1 = PA.lat();

var Lon1 = PA.lng();

var Lat2 = PB.lat();

var Lon2 = PB.lng();

var R = 6371; // km var R = 6371; // km

var dLat = (Lat2-Lat1) * Math.PI / 180; var dLat = (Lat2-Lat1) * Math.PI / 180;

var dLon = (Lon2-Lon1) * Math.PI / 180; var dLon = (Lon2-Lon1) * Math.PI / 180;

var a = Math.sin(dLat/2) * Math.sin(dLat/2) + var a = Math.sin(dLat/2) * Math.sin(dLat/2) +

Math.cos(Lat1 * Math.PI / 180) * Math.cos(Lat2 * Math.PI / 180) * Math.cos(Lat1 * Math.PI / 180) * Math.cos(Lat2 * Math.PI / 180) *

Line 334... Line 352...

} }

//############################## //##############################

function SwitchDatabase(NewDatabase) { function SwitchDatabase(NewDatabase) {

CurrentDatabase = NewDatabase; CurrentDatabase = NewDatabase;

document.getElementById("souradnice").innerHTML = CurrentDatabase; document.getElementById("SouradniceStredu").innerHTML = CurrentDatabase;

ClearOverlayAndData(); ClearOverlayAndData();

FetchOverlayAndData(); FetchOverlayAndData();

document.getElementById("status").innerHTML = "Databaze zmenena na "+CurrentDatabase; document.getElementById("status").innerHTML = "Databaze zmenena na "+CurrentDatabase;

document.getElementById("databaze").innerHTML = CurrentDatabase; document.getElementById("databaze").innerHTML = CurrentDatabase;

} }

Line 346... Line 364...

//############################## //##############################

function ChangeNodeLimit(NewNodeLimit) { function ChangeNodeLimit(NewNodeLimit) {

NodeLimit = NewNodeLimit; NodeLimit = NewNodeLimit;

FetchOverlayAndData(); FetchOverlayAndData();

document.getElementById("status").innerHTML = "Limit zmenen na "+NewNodeLimit; document.getElementById("status").innerHTML = "Limit zmenen na "+NewNodeLimit;

document.getElementById("NodeLimitSelectBox").value = NodeLimit;

}

//##############################

function ChangeMapSizeX(NewMapSizeX) {

MapSizeX = NewMapSizeX;

FetchOverlayAndData();

document.getElementById("status").innerHTML = "Rozmer X zmenen na "+MapSizeX;

document.getElementById("map").style.width = MapSizeX+"px";

ClearOverlayAndData();

MapLoad();

FetchOverlayAndData();

}

//##############################

function ChangeMapSizeY(NewMapSizeY) {

MapSizeY = NewMapSizeY;

FetchOverlayAndData();

document.getElementById("status").innerHTML = "Rozmer Y zmenen na "+MapSizeY;

document.getElementById("map").style.height = MapSizeY+"px";

ClearOverlayAndData();

MapLoad();

FetchOverlayAndData();

} }

//############################## //##############################

function DebugPrint(Text) { function DebugPrint(Text) {

document.getElementById("debug").innerHTML = document.getElementById("debug").innerHTML + Text; document.getElementById("debug").innerHTML = document.getElementById("debug").innerHTML + Text;

Line 369... Line 412...

} }

//############################## //##############################

function ClearOverlayAndData() { function ClearOverlayAndData() {

if (AutoClearMode) { if (AutoClearMode) {

Clear(); ForceClear();

}; };

} }

//############################## //##############################

function Clear() { function ForceClear() {

document.getElementById("status").innerHTML = "Smazano " + NumAddedNodes + " nodu"; document.getElementById("status").innerHTML = "Smazano " + NumAddedNodes + " nodu";

map.clearOverlays(); map.clearOverlays();

LoadedNodes=Array(); LoadedNodes=Array();

LoadedLinks=Array(); LoadedLinks=Array();

NumAddedNodes=0; NumAddedNodes=0;

document.getElementById("NumNodes").innerHTML = "Nacteno " + NumAddedNodes + " nodu"; document.getElementById("NumNodes").innerHTML = "Nacteno " + NumAddedNodes + " nodu";

LoadedLinks=Array();

NumAddedLinks=0; NumAddedLinks=0;

NumVisibleLinks=0; NumVisibleLinks=0;

NumInVisibleLinks=0; NumInVisibleLinks=0;

document.getElementById("NumLinks").innerHTML = "Nacteno " + NumAddedLinks + " linku"; document.getElementById("NumLinks").innerHTML = "Nacteno " + NumAddedLinks + " linku";

} }

Line 397... Line 439...

document.getElementById("status").innerHTML = "Automaticke nacitani zapnuto."; document.getElementById("status").innerHTML = "Automaticke nacitani zapnuto.";

} }

else { else {

document.getElementById("status").innerHTML = "Automaticke nacitani vypnuto."; document.getElementById("status").innerHTML = "Automaticke nacitani vypnuto.";

} }

document.getElementById("AutoFetchModeCheckButton").checked = AutoFetchMode;

} }

//############################## //##############################

function ToggleAutoClearMode(NewAutoClearMode) { function ToggleAutoClearMode(NewAutoClearMode) {

AutoClearMode = NewAutoClearMode; AutoClearMode = NewAutoClearMode;

if (AutoClearMode) { if (AutoClearMode) {

document.getElementById("status").innerHTML = "Automaticke mazani zapnuto."; document.getElementById("status").innerHTML = "Automaticke mazani zapnuto.";

} }

else { else {

document.getElementById("status").innerHTML = "Automaticke mazani vypnuto."; document.getElementById("status").innerHTML = "Automaticke mazani vypnuto.";

} }

document.getElementById("AutoClearModeCheckButton").checked = AutoClearMode;

} }

</script> //##############################

function SetCookie(Name, Data, Validity) {

var Day = 24 * 3600 * 1000;

var Expiration = new Date();

Expiration.setTime(Expiration.getTime() + Validity * Day);

document.cookie = Name + "=" + escape(Data) + "; expires=" + Expiration.toGMTString() + "; path=/";

}

//##############################

function GetCookie(Name) {

var Prefix = Name + "=";

var Begin = document.cookie.indexOf(Prefix);

if ( Begin == -1 )

return "";

Begin += Prefix.length;

if ( Begin >= document.cookie.length )

return "";

var End = document.cookie.indexOf(";", Begin);

if ( End == -1 )

End = document.cookie.length;

return unescape(document.cookie.substring(Begin, End));

}

//##############################

function SaveSettingsCookieText() {

var Text = "db=" + CurrentDatabase

+ "&map=" + map.getCurrentMapType().getName()

+ "&sizex=" + MapSizeX

+ "&sizey=" + MapSizeY

+ "&lat=" + map.getCenter().lat()

+ "&lon=" + map.getCenter().lng()

+ "&zoom=" + map.getZoom()

+ "&autofetch=" + AutoFetchMode

+ "&autoclear=" + AutoClearMode

+ "&nodelimit=" + NodeLimit

+ "&";

return Text;

}

//##############################

function LoadSettings() {

var Text = GetCookie("default");

var Begin = 0;

var End = 0;

End = Text.indexOf("&",Begin);

while (End > -1) {

var Parameter = Text.substring(Begin,End);

var EqualPosition = Parameter.indexOf("=");

if ((EqualPosition > -1) && (EqualPosition < Parameter.length)) {

var ParameterName = Parameter.substring(0,EqualPosition);

var ParameterValue = Parameter.substring(EqualPosition+1,Parameter.length);

if (ParameterName == "db") CurrentDatabase = ParameterValue;

if (ParameterName == "map") MapName = ParameterValue;

if (ParameterName == "sizex") MapSizeX = 1*ParameterValue;

if (ParameterName == "sizey") MapSizeY = 1*ParameterValue;

if (ParameterName == "lat") MapCenterLat = 1*ParameterValue;

if (ParameterName == "lon") MapCenterLon = 1*ParameterValue;

if (ParameterName == "zoom") MapZoom = 1*ParameterValue;

if ((ParameterName == "autofetch") && ParameterValue == "true" ) ToggleAutoFetchMode(true);

if ((ParameterName == "autofetch") && ParameterValue == "false" ) ToggleAutoFetchMode(false);

if ((ParameterName == "autoclear") && ParameterValue == "true" ) ToggleAutoClearMode(true);

if ((ParameterName == "autoclear") && ParameterValue == "false" ) ToggleAutoClearMode(false);

if (ParameterName == "nodelimit") ChangeNodeLimit(ParameterValue);

}

Begin = End + 1;

End = Text.indexOf("&",Begin);

}

document.getElementById("AutoFetchModeCheckButton").checked = AutoFetchMode;

document.getElementById("AutoClearModeCheckButton").checked = AutoClearMode;

document.getElementById("NodeLimitSelectBox").value = NodeLimit;

document.getElementById("databaze").innerHTML = CurrentDatabase;

document.getElementById("MapSizeXSelectBox").value = MapSizeX;

document.getElementById("MapSizeYSelectBox").value = MapSizeY;

document.getElementById("map").style.width = MapSizeX+"px";

document.getElementById("map").style.height = MapSizeY+"px";

ForceClear();

MapLoad();

FetchOverlayAndData();

}

//##############################

function MDControl() { }

MDControl.prototype = new GControl();

MDControl.prototype.initialize = function(map) {

var container = document.createElement("div");

var savepos= document.createElement("div");

savepos.title= "Save actual position and zoomlevel";

savepos.className= "MDbuttons";

container.appendChild(savepos);

savepos.appendChild(document.createTextNode("Save Position"));

GEvent.addDomListener(savepos, "click", function() {

var center = map.getCenter(); var zoom = map.getZoom();

saved.splice(0,2,center,zoom);

// alert("Saved Position: "+center.toUrlValue()+"\nZoomlevel: "+zoom);

});

var tosaved=document.createElement("div");

tosaved.title= "Back to saved position";

tosaved.className= "MDbuttons";

container.appendChild(tosaved);

tosaved.appendChild(document.createTextNode("To Saved"));

GEvent.addDomListener(tosaved, "click", function() {

if(saved.length > 0) { map.setZoom(saved[1]); map.panTo(saved[0]); }

});

map.getContainer().appendChild(container);

return container;

}

MDControl.prototype.getDefaultPosition = function() {

return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7,31));

}

//]]>

</script>

</head> </head>

<body onload="load()" onunload="GUnload()"> <body onload="load()" onunload="GUnload()">

<table> <table>

<tr> <tr>

<td> <td>

<div id="map" style="width: 800px; height: 600px"></div> <div id="map" class="gmaparea"></div>

</td> </td>

<td valign="top"> <td valign="top" class="controlarea">

<div id="UserInfo">'; <div id="UserInfo">';

echo "Prihlasen jako:<br>"; echo "Prihlasen jako:<br>";

echo $bbuserinfo['username']." "; echo $bbuserinfo['username']." ";

echo $bbuserinfo['userid']." "; echo $bbuserinfo['userid']." ";

Line 439... Line 600...

<input type="button" value="gendb" onClick="SwitchDatabase(\'gendb\');"/> <input type="button" value="gendb" onClick="SwitchDatabase(\'gendb\');"/>

<br> <br>

<div id="NumNodes">0</div> <div id="NumNodes">0</div>

<div id="NumLinks">0</div> <div id="NumLinks">0</div>

<input type="button" value="Nacist ted" onClick="Fetch();"/> <input type="button" value="Nacist ted" onClick="Fetch();"/>

<input type="button" value="Smazat ted" onClick="Clear();"/> <input type="button" value="Smazat ted" onClick="ForceClear();"/>

<br> <br>

Automaticke nacitani: Automaticke nacitani:

<input id="AutoFetchModeCheckButton" type="checkBox" onclick="ToggleAutoFetchMode(this.checked)"> <input id="AutoFetchModeCheckButton" type="checkBox" onclick="ToggleAutoFetchMode(this.checked)">

<br> <br>

Automaticke mazani: Automaticke mazani:

Line 456... Line 617...

<option value="60">60</option> <option value="60">60</option>

<option value="200">200</option> <option value="200">200</option>

<option value="500">500</option> <option value="500">500</option>

<option value="1000">1000</option> <option value="1000">1000</option>

</select> </select>

<table border="1">

<tr> <input type="button" value=\'Save settings\' onclick=\'SetCookie("default", SaveSettingsCookieText() , 365);\'>

<td> <input type="button" value=\'Load settings\' onclick=\'LoadSettings();\'>

<div id="NodeDistanceABC">ABC</div> <div>

</td> <select id="MapSizeXSelectBox" onchange="ChangeMapSizeX(this.value)">

<td> <option value="800" selected="selected">800</option>

A <option value="900">900</option>

</td> <option value="1000">1000</option>

<td> <option value="1100">1100</option>

B <option value="1200">1200</option>

</td> <option value="1300">1300</option>

<td> <option value="1400">1400</option>

C </select>

</td> X

</tr> <select id="MapSizeYSelectBox" onchange="ChangeMapSizeY(this.value)">

<tr> <option value="600" selected="selected">600</option>

<td> <option value="700">700</option>

<div id="NodeCoordinatesA">A</div> <option value="800">800</option>

</td> <option value="900">900</option>

<td> <option value="1000">1000</option>

<div id="NodeAngleACB">ACB</div> </select>

</td> </div>

<td>

<div id="NodeDistanceAB">AB</div>

</td>

<td>

<div id="NodeDistanceAC">AC</div>

</td>

</tr>

<tr>

<td>

<div id="NodeCoordinatesB">B</div>

</td>

<td>

<div id="NodeDistanceBA">BA</div>

</td>

<td>

<div id="NodeAngleBAC">BAC</div>

</td>

<td>

<div id="NodeDistanceBC">BC</div>

</td>

</tr>

<tr>

<td>

<div id="NodeCoordinatesC">C</div>

</td>

<td>

<div id="NodeDistanceCA">CA</div>

</td>

<td>

<div id="NodeDistanceCB">CB</div>

</td>

<td>

<div id="NodeAngleCBA">BAC</div>

</td>

</tr>

</table>

</td> </td>

</tr> </tr>

<tr> <tr>

<td colspan=2> <td class="statusarea" >

<div id="debug"></div> <div id="debug"></div>

<div id="status">Hotovo!</div> <div id="status">Hotovo!</div>

<div id="data"></div> <div id="data"></div>

<div id="NodeCoordinates">aaa</div> <div id="NodeCoordinates">aaa</div>

<div id="souradnice">Souradnice stredu:<br>Rozsah:<br>Zvetseni:</div> <div id="SouradniceStredu">Souradnice stredu:<br>Rozsah:<br>Zvetseni:</div>

<a href="http://code.google.com/apis/maps/documentation/examples/">http://code.google.com/apis/maps/documentation/examples/</a> <a href="http://code.google.com/apis/maps/documentation/examples/">http://code.google.com/apis/maps/documentation/examples/</a>

<br> <br>

<a href="http://code.google.com/apis/kml/documentation/kml_tut.html">http://code.google.com/apis/kml/documentation/kml_tut.html</a> <a href="http://code.google.com/apis/kml/documentation/kml_tut.html">http://code.google.com/apis/kml/documentation/kml_tut.html</a>

<br> <br>

<a href="http://mapki.com/wiki/Knowledge_Base">http://mapki.com/wiki/Knowledge_Base</a> <a href="http://mapki.com/wiki/Knowledge_Base">http://mapki.com/wiki/Knowledge_Base</a>

<br> <br>

<a href="http://www.bdcc.co.uk/Gmaps/BdccGmapBits.htm">http://www.bdcc.co.uk/Gmaps/BdccGmapBits.htm</a> <a href="http://www.bdcc.co.uk/Gmaps/BdccGmapBits.htm">http://www.bdcc.co.uk/Gmaps/BdccGmapBits.htm</a>

<br> <br>

http://www.czfree.net/forum/showthread.php?postid=197732#post197732 http://www.czfree.net/forum/showthread.php?postid=197732#post197732

<td>

<table border="1">

<tr>

<td>Mereni vzdalenosti a uhlu</td><td>A</td><td>B</td><td>C</td>

</tr>

<tr>

<td><div id="NodeCoordinatesA">A klikni na mapu</div></td><td><div id="NodeAngleACB">ACB</div></td>

<td><div id="NodeDistanceAB">AB</div></td><td><div id="NodeDistanceAC">AC</div></td>

</tr>

<tr>

<td><div id="NodeCoordinatesB">B klikni podruhe</div></td><td><div id="NodeDistanceBA">BA</div></td>

<td><div id="NodeAngleBAC">BAC</div></td><td><div id="NodeDistanceBC">BC</div></td>

</tr>

<tr>

<td><div id="NodeCoordinatesC">C klikni potreti</div></td><td><div id="NodeDistanceCA">CA</div></td>

<td><div id="NodeDistanceCB">CB</div></td><td><div id="NodeAngleCBA">BAC</div></td>

</tr>

<tr>

<td></td><td><div id="NodeDistanceBAC">B-A-C</div></td>

<td><div id="NodeDistanceABC">A-B-C</div></td><td><div id="NodeDistanceBCA">B-C-A</div></td>

</tr>

</table>

</td>

</td> </td>

</tr> </tr>

<tr> <tr>

<td colspan=2> <td colspan=2>

-Rev 8
+Rev 9
 Line 49...
       }
     </style>
     <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key='.$GMapKey.'"
             type="text/javascript"></script>
     <script src="http://www.google.com/uds/api?file=uds.js&amp;v=1.0" type="text/javascript"></script>
     <script src="http://www.google.com/uds/solutions/localsearch/gmlocalsearch.js" type="text/javascript"></script>
     <script type="text/javascript">
+    //<![CDATA[
     //### Globalni promenne #################################
     var CurrentDatabase = "czfmutf";
     var NodeLimit = "200";
     var NodeOrder = "ASC";
     var NodeSortBy = "name";
     var Where = "";
     var LoadedNodes = new Array();
+    var LoadedLinks = new Array();
     var map;
     var NodeIcon = new Array();
     var DatabaseNodeTables = new Array();
     var AutoFetchMode = true;
     var AutoClearMode = true;
-Line 75...
+Line 78...
     var PtA = new Array();
     var PtB = new Array();
     var PtC = new Array();
     var PtPt = 1;
     var PtNum = 0;
+    var MapSizeX = 800;
+    var MapSizeY = 600;
+    var MapCenterLat = 50.123567;
+    var MapCenterLon = 14.496258;
+    var MapZoom = 15;
+    var MapName = "Mapa";
+    var saved=[];
     var LinkColType = new Array();
     LinkColType["00000001"] = "#00aa00";
     LinkColType["00000001"] = "#00FF00";
     var LinkColTypeWifiBackbone = "#fafa00";
-Line 108...
+Line 119...
       }
     }
     //### Uvodni funkce #################################
     function load() {
+        MapLoad();
+        LoadSettings();
+    }
+    function MapLoad() {
       if (GBrowserIsCompatible()) {
         map = new GMap2(document.getElementById("map"),{draggableCursor: \'crosshair\', draggingCursor: \'pointer\'});
         map.addControl(new GLargeMapControl());
         map.addControl(new GMapTypeControl());
-        map.addControl(new GOverviewMapControl());
+        var MapCenter = new GLatLng(MapCenterLat, MapCenterLon);
-        map.setCenter(new GLatLng(50.123567, 14.496258), 15);
+        map.setCenter(MapCenter, MapZoom);
         map.enableScrollWheelZoom();
         map.addControl(new GScaleControl());
+        map.addControl(new MDControl());
+        // Selecting map type
+            var MapTypes = map.getMapTypes();
+            for(var i = 0; i < MapTypes.length; i++) {
+            if (MapName == MapTypes[i].getName()) map.setMapType(MapTypes[i]);
+         }
+        map.addControl(new GOverviewMapControl());
         map.addControl(new google.maps.LocalSearch(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,20)));
         //tohle zajisti znovunacteni nodu po presunu
         GEvent.addListener(map, "moveend", HandleMapMoveEnd);
         //ziskani souradnic po kliknuti
         GEvent.addListener(map, \'click\', function(overlay, point) { if(point) { HandleNextPoint(point) }} );
         //tohle zajisti vypis pri startu
         var center = map.getCenter();
-        document.getElementById("souradnice").innerHTML = CurrentDatabase + "<br>Souradnice stredu:" + center.toString() + "<br>Rozsah: " + map.getBounds()+"<br>Zvetseni: " + map.getZoom();
+        document.getElementById("SouradniceStredu").innerHTML = CurrentDatabase + "<br>Souradnice stredu:" + center.toString() + "<br>Rozsah: " + map.getBounds()+"<br>Zvetseni: " + map.getZoom();
         //tohle zajisti prubezny vypis
         GEvent.addListener(map, "moveend", function() {
           var center = map.getCenter();
-          document.getElementById("souradnice").innerHTML = CurrentDatabase + " " + map.getBounds().getSouthWest().lat() + "<br>Souradnice stredu: " + center.toString() + "<br>Rozsah: " + map.getBounds()+"<br>Zvetseni: " + map.getZoom();
+          document.getElementById("SouradniceStredu").innerHTML = CurrentDatabase + " " + map.getBounds().getSouthWest().lat() + "<br>Souradnice stredu: " + center.toString() + "<br>Rozsah: " + map.getBounds()+"<br>Zvetseni: " + map.getZoom();
         });
-        document.getElementById("AutoFetchModeCheckButton").checked = true;
-        document.getElementById("AutoClearModeCheckButton").checked = true;
-        document.getElementById("NodeLimitSelectBox").value = NodeLimit;
-        document.getElementById("databaze").innerHTML = CurrentDatabase;
-        //prvotni zobrazeni
-          ClearOverlayAndData();
-          NodeLayer();
-        var pts = new Array();
-//      pts.push (new GLatLng(50.120771, 14.486246));
-        pts.push (new GLatLng(50.118212, 14.484079));
-        pts.push (new GLatLng(50.118707, 14.491160));
       }
     }
     //### Ostatni funkce ###########################
-Line 213...
+Line 224...
                     LinkColOpacity = 0.2;
                     LinkColBg = "#0000FF";
                     LinkStyle = "dash";
                 }
 //              DebugPrint(":"+ inplanning + ":");
-                var Linepts = new Array();
-                Linepts = [LoadedNodes[id1],LoadedNodes[id2]];
-                LineLength = Math.round(GetLineLength(Linepts[0].lat(), Linepts[0].lng(), Linepts[1].lat(), Linepts[1].lng()));
                 var polyOptions = {geodesic:false};
                 var polyline = new GPolyline([LoadedNodes[id1],LoadedNodes[id2]], LinkColBg, 3 + LinkSize, LinkColBgOpacity, polyOptions);
                 map.addOverlay(polyline);
-Line 249...
+Line 256...
         });
     }
     //##############################
     function HandleNextPoint(point) {
-        var Distance = 0;
         document.getElementById("NodeCoordinates").innerHTML = (point.y.toFixed(6)+\'x\'+point.x.toFixed(6));
         if ( PtPt == 1 ) {
             document.getElementById("NodeCoordinatesA").innerHTML = (\'A \'+point.y.toFixed(6)+\'x\'+point.x.toFixed(6));
-Line 271...
+Line 277...
         PtPt = PtPt + 1;
         if ( PtPt > 3 ) { PtPt = 1; }
         PtNum = PtNum + 1;
-//          document.getElementById("NodeDistanceBC").innerHTML = (\'C \'+point.y.toFixed(6)+\'x\'+point.x.toFixed(6));
-//          document.getElementById("NodeDistanceABC").innerHTML = (\'ss\');
         if ( PtNum > 1 ) {
-            Distance = Math.round(GetLineLength(PtA.lat(), PtA.lng(), PtB.lat(), PtB.lng()));
+            var DistanceAB = Math.round(GetLineLength(PtA, PtB));
-            document.getElementById("NodeDistanceAB").innerHTML = Distance;
+            document.getElementById("NodeDistanceAB").innerHTML = DistanceAB+\'m\';
-            document.getElementById("NodeDistanceBA").innerHTML = Distance;
+            document.getElementById("NodeDistanceBA").innerHTML = DistanceAB+\'m\';
         }
         if ( PtNum > 2 ) {
-            Distance = Math.round(GetLineLength(PtC.lat(), PtC.lng(), PtB.lat(), PtB.lng()));
+            var DistanceBC = Math.round(GetLineLength(PtC, PtB));
-            document.getElementById("NodeDistanceBC").innerHTML = Distance;
+            document.getElementById("NodeDistanceBC").innerHTML = DistanceBC+\'m\';
-            document.getElementById("NodeDistanceCB").innerHTML = Distance;
+            document.getElementById("NodeDistanceCB").innerHTML = DistanceBC+\'m\';
-            document.getElementById("NodeDistanceABC").innerHTML = 1 * Distance + 1 * document.getElementById("NodeDistanceBA").innerHTML;
+            var DistanceAC = Math.round(GetLineLength(PtC, PtA));
-            Distance = Math.round(GetLineLength(PtC.lat(), PtC.lng(), PtA.lat(), PtA.lng()));
+            document.getElementById("NodeDistanceAC").innerHTML = DistanceAC+\'m\';
-            document.getElementById("NodeDistanceAC").innerHTML = Distance;
+            document.getElementById("NodeDistanceCA").innerHTML = DistanceAC+\'m\';
-            document.getElementById("NodeDistanceCA").innerHTML = Distance;
+            document.getElementById("NodeAngleACB").innerHTML = Math.round(GetAngle(PtA, PtC, PtB))+\'st\';
+            document.getElementById("NodeAngleBAC").innerHTML = Math.round(GetAngle(PtB, PtC, PtA))+\'st\';
+            document.getElementById("NodeAngleCBA").innerHTML = Math.round(GetAngle(PtC, PtA, PtB))+\'st\';
+            document.getElementById("NodeDistanceBAC").innerHTML = ( DistanceAB + DistanceAC ) +\'m\';
+            document.getElementById("NodeDistanceABC").innerHTML = ( DistanceAB + DistanceBC ) +\'m\';
+            document.getElementById("NodeDistanceBCA").innerHTML = ( DistanceBC + DistanceAC ) +\'m\';
         }
+    }
-        document.getElementById("NodeAngleACB").innerHTML = (point.y.toFixed(6)+\'x\'+point.x.toFixed(6));
+    //##############################
-        document.getElementById("NodeAngleBAC").innerHTML = (point.y.toFixed(6)+\'x\'+point.x.toFixed(6));
+    function GetAngle(PA, PB, PC) {
-        document.getElementById("NodeAngleCBA").innerHTML = (point.y.toFixed(6)+\'x\'+point.x.toFixed(6));
+        var a = GetLineLength(PC, PB);
+        var b = GetLineLength(PC, PA);
+        var c = GetLineLength(PA, PB);
+        var s = ( a + b + c ) / 2;
+        var alfa = (360/Math.PI)*Math.asin(Math.sqrt((s-b)*(s-c)/(b*c)));
+      return alfa;
     }
     //##############################
-    function GetLineLength(Lat1, Lon1, Lat2, Lon2) {
+    function GetLineLength(PA, PB) {
+        var Lat1 = PA.lat();
+        var Lon1 = PA.lng();
+        var Lat2 = PB.lat();
+        var Lon2 = PB.lng();
         var R = 6371; // km
         var dLat = (Lat2-Lat1) * Math.PI / 180;
         var dLon = (Lon2-Lon1) * Math.PI / 180;
         var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
                 Math.cos(Lat1 * Math.PI / 180) * Math.cos(Lat2 * Math.PI / 180) *
-Line 334...
+Line 352...
     }
     //##############################
     function SwitchDatabase(NewDatabase) {
         CurrentDatabase = NewDatabase;
-        document.getElementById("souradnice").innerHTML = CurrentDatabase;
+        document.getElementById("SouradniceStredu").innerHTML = CurrentDatabase;
         ClearOverlayAndData();
         FetchOverlayAndData();
         document.getElementById("status").innerHTML = "Databaze zmenena na "+CurrentDatabase;
         document.getElementById("databaze").innerHTML = CurrentDatabase;
     }
-Line 346...
+Line 364...
     //##############################
     function ChangeNodeLimit(NewNodeLimit) {
         NodeLimit = NewNodeLimit;
         FetchOverlayAndData();
         document.getElementById("status").innerHTML = "Limit zmenen na "+NewNodeLimit;
+        document.getElementById("NodeLimitSelectBox").value = NodeLimit;
+    }
+    //##############################
+    function ChangeMapSizeX(NewMapSizeX) {
+        MapSizeX = NewMapSizeX;
+        FetchOverlayAndData();
+        document.getElementById("status").innerHTML = "Rozmer X zmenen na "+MapSizeX;
+        document.getElementById("map").style.width = MapSizeX+"px";
+        ClearOverlayAndData();
+        MapLoad();
+        FetchOverlayAndData();
+    }
+    //##############################
+    function ChangeMapSizeY(NewMapSizeY) {
+        MapSizeY = NewMapSizeY;
+        FetchOverlayAndData();
+        document.getElementById("status").innerHTML = "Rozmer Y zmenen na "+MapSizeY;
+        document.getElementById("map").style.height = MapSizeY+"px";
+        ClearOverlayAndData();
+        MapLoad();
+        FetchOverlayAndData();
     }
     //##############################
     function DebugPrint(Text) {
         document.getElementById("debug").innerHTML = document.getElementById("debug").innerHTML + Text;
-Line 369...
+Line 412...
     }
     //##############################
     function ClearOverlayAndData() {
         if (AutoClearMode) {
-            Clear();
+            ForceClear();
         };
     }
     //##############################
-    function Clear() {
+    function ForceClear() {
         document.getElementById("status").innerHTML = "Smazano " + NumAddedNodes + " nodu";
         map.clearOverlays();
         LoadedNodes=Array();
         LoadedLinks=Array();
         NumAddedNodes=0;
         document.getElementById("NumNodes").innerHTML = "Nacteno " + NumAddedNodes + " nodu";
-        LoadedLinks=Array();
         NumAddedLinks=0;
         NumVisibleLinks=0;
         NumInVisibleLinks=0;
         document.getElementById("NumLinks").innerHTML = "Nacteno " + NumAddedLinks + " linku";
     }
-Line 397...
+Line 439...
           document.getElementById("status").innerHTML = "Automaticke nacitani zapnuto.";
         }
         else {
           document.getElementById("status").innerHTML = "Automaticke nacitani vypnuto.";
         }
+        document.getElementById("AutoFetchModeCheckButton").checked = AutoFetchMode;
     }
     //##############################
     function ToggleAutoClearMode(NewAutoClearMode) {
         AutoClearMode = NewAutoClearMode;
         if (AutoClearMode) {
           document.getElementById("status").innerHTML = "Automaticke mazani zapnuto.";
         }
         else {
           document.getElementById("status").innerHTML = "Automaticke mazani vypnuto.";
         }
+        document.getElementById("AutoClearModeCheckButton").checked = AutoClearMode;
     }
-  </script>
+    //##############################
+    function SetCookie(Name, Data, Validity) {
+        var Day = 24 * 3600 * 1000;
+        var Expiration = new Date();
+        Expiration.setTime(Expiration.getTime() + Validity * Day);
+        document.cookie = Name + "=" + escape(Data) + "; expires=" + Expiration.toGMTString() + "; path=/";
+    }
+    //##############################
+    function GetCookie(Name) {
+        var Prefix = Name + "=";
+        var Begin = document.cookie.indexOf(Prefix);
+        if ( Begin == -1 )
+        return "";
+        Begin += Prefix.length;
+        if ( Begin >= document.cookie.length )
+            return "";
+        var End = document.cookie.indexOf(";", Begin);
+        if ( End == -1 )
+            End = document.cookie.length;
+        return unescape(document.cookie.substring(Begin, End));
+    }
+    //##############################
+    function SaveSettingsCookieText() {
+        var Text = "db=" + CurrentDatabase
+                    + "&map=" + map.getCurrentMapType().getName()
+                    + "&sizex=" + MapSizeX
+                    + "&sizey=" + MapSizeY
+                    + "&lat=" + map.getCenter().lat()
+                    + "&lon=" + map.getCenter().lng()
+                    + "&zoom=" + map.getZoom()
+                    + "&autofetch=" + AutoFetchMode
+                    + "&autoclear=" + AutoClearMode
+                    + "&nodelimit=" + NodeLimit
+                    + "&";
+      return Text;
+    }
+    //##############################
+    function LoadSettings() {
+        var Text = GetCookie("default");
+        var Begin = 0;
+        var End = 0;
+        End = Text.indexOf("&",Begin);
+        while (End > -1) {
+            var Parameter = Text.substring(Begin,End);
+            var EqualPosition = Parameter.indexOf("=");
+            if ((EqualPosition > -1) && (EqualPosition < Parameter.length)) {
+                var ParameterName = Parameter.substring(0,EqualPosition);
+                var ParameterValue = Parameter.substring(EqualPosition+1,Parameter.length);
+                if (ParameterName == "db") CurrentDatabase = ParameterValue;
+                if (ParameterName == "map") MapName = ParameterValue;
+                if (ParameterName == "sizex") MapSizeX = 1*ParameterValue;
+                if (ParameterName == "sizey") MapSizeY = 1*ParameterValue;
+                if (ParameterName == "lat") MapCenterLat = 1*ParameterValue;
+                if (ParameterName == "lon") MapCenterLon = 1*ParameterValue;
+                if (ParameterName == "zoom") MapZoom = 1*ParameterValue;
+                if ((ParameterName == "autofetch") && ParameterValue == "true" ) ToggleAutoFetchMode(true);
+                if ((ParameterName == "autofetch") && ParameterValue == "false" ) ToggleAutoFetchMode(false);
+                if ((ParameterName == "autoclear") && ParameterValue == "true" ) ToggleAutoClearMode(true);
+                if ((ParameterName == "autoclear") && ParameterValue == "false" ) ToggleAutoClearMode(false);
+                if (ParameterName == "nodelimit") ChangeNodeLimit(ParameterValue);
+            }
+            Begin = End + 1;
+            End = Text.indexOf("&",Begin);
+        }
+        document.getElementById("AutoFetchModeCheckButton").checked = AutoFetchMode;
+        document.getElementById("AutoClearModeCheckButton").checked = AutoClearMode;
+        document.getElementById("NodeLimitSelectBox").value = NodeLimit;
+        document.getElementById("databaze").innerHTML = CurrentDatabase;
+        document.getElementById("MapSizeXSelectBox").value = MapSizeX;
+        document.getElementById("MapSizeYSelectBox").value = MapSizeY;
+        document.getElementById("map").style.width = MapSizeX+"px";
+        document.getElementById("map").style.height = MapSizeY+"px";
+        ForceClear();
+        MapLoad();
+        FetchOverlayAndData();
+    }
+    //##############################
+function MDControl() { }
+ MDControl.prototype = new GControl();
+ MDControl.prototype.initialize = function(map) {
+  var container = document.createElement("div");
+ var savepos= document.createElement("div");
+ savepos.title= "Save actual position and zoomlevel";
+ savepos.className= "MDbuttons";
+ container.appendChild(savepos);
+ savepos.appendChild(document.createTextNode("Save Position"));
+  GEvent.addDomListener(savepos, "click", function() {
+   var center = map.getCenter(); var zoom = map.getZoom();
+   saved.splice(0,2,center,zoom);
+//   alert("Saved Position: "+center.toUrlValue()+"\nZoomlevel: "+zoom);
+  });
+ var tosaved=document.createElement("div");
+ tosaved.title= "Back to saved position";
+ tosaved.className= "MDbuttons";
+ container.appendChild(tosaved);
+ tosaved.appendChild(document.createTextNode("To Saved"));
+  GEvent.addDomListener(tosaved, "click", function() {
+   if(saved.length > 0) { map.setZoom(saved[1]); map.panTo(saved[0]); }
+  });
+ map.getContainer().appendChild(container);
+ return container;
+}
+MDControl.prototype.getDefaultPosition = function() {
+ return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7,31));
+}
+    //]]>
+    </script>
   </head>
   <body onload="load()" onunload="GUnload()">
     <table>
     <tr>
     <td>
-      <div id="map" style="width: 800px; height: 600px"></div>
+      <div id="map" class="gmaparea"></div>
     </td>
-    <td valign="top">
+    <td valign="top" class="controlarea">
     <div id="UserInfo">';
     echo "Prihlasen jako:<br>";
     echo $bbuserinfo['username']."&nbsp;";
     echo $bbuserinfo['userid']."&nbsp;";
-Line 439...
+Line 600...
     <input type="button" value="gendb" onClick="SwitchDatabase(\'gendb\');"/>
     <br>
     <div id="NumNodes">0</div>
     <div id="NumLinks">0</div>
     <input type="button" value="Nacist ted" onClick="Fetch();"/>
-    <input type="button" value="Smazat ted" onClick="Clear();"/>
+    <input type="button" value="Smazat ted" onClick="ForceClear();"/>
     <br>
     Automaticke nacitani:
     <input id="AutoFetchModeCheckButton" type="checkBox" onclick="ToggleAutoFetchMode(this.checked)">
     <br>
     Automaticke mazani:
-Line 456...
+Line 617...
         <option value="60">60</option>
         <option value="200">200</option>
         <option value="500">500</option>
         <option value="1000">1000</option>
     </select>
-    <table border="1">
-    <tr>
+    <input type="button" value=\'Save settings\' onclick=\'SetCookie("default", SaveSettingsCookieText() , 365);\'>
-    <td>
+    <input type="button" value=\'Load settings\' onclick=\'LoadSettings();\'>
-    <div id="NodeDistanceABC">ABC</div>
+    <div>
-    </td>
+    <select id="MapSizeXSelectBox" onchange="ChangeMapSizeX(this.value)">
-    <td>
+        <option value="800" selected="selected">800</option>
-    A
+        <option value="900">900</option>
-    </td>
+        <option value="1000">1000</option>
-    <td>
+        <option value="1100">1100</option>
-    B
+        <option value="1200">1200</option>
-    </td>
+        <option value="1300">1300</option>
-    <td>
+        <option value="1400">1400</option>
-    C
+    </select>
-    </td>
+    X
-    </tr>
+    <select id="MapSizeYSelectBox" onchange="ChangeMapSizeY(this.value)">
-    <tr>
+        <option value="600" selected="selected">600</option>
-    <td>
+        <option value="700">700</option>
-    <div id="NodeCoordinatesA">A</div>
+        <option value="800">800</option>
-    </td>
+        <option value="900">900</option>
-    <td>
+        <option value="1000">1000</option>
-    <div id="NodeAngleACB">ACB</div>
+    </select>
-    </td>
+    </div>
-    <td>
-    <div id="NodeDistanceAB">AB</div>
-    </td>
-    <td>
-    <div id="NodeDistanceAC">AC</div>
-    </td>
-    </tr>
-    <tr>
-    <td>
-    <div id="NodeCoordinatesB">B</div>
-    </td>
-    <td>
-    <div id="NodeDistanceBA">BA</div>
-    </td>
-    <td>
-    <div id="NodeAngleBAC">BAC</div>
-    </td>
-    <td>
-    <div id="NodeDistanceBC">BC</div>
-    </td>
-    </tr>
-    <tr>
-    <td>
-    <div id="NodeCoordinatesC">C</div>
-    </td>
-    <td>
-    <div id="NodeDistanceCA">CA</div>
-    </td>
-    <td>
-    <div id="NodeDistanceCB">CB</div>
-    </td>
-    <td>
-    <div id="NodeAngleCBA">BAC</div>
-    </td>
-    </tr>
-    </table>
     </td>
     </tr>
     <tr>
-    <td colspan=2>
+    <td class="statusarea" >
     <div id="debug"></div>
     <div id="status">Hotovo!</div>
     <div id="data"></div>
     <div id="NodeCoordinates">aaa</div>
-    <div id="souradnice">Souradnice stredu:<br>Rozsah:<br>Zvetseni:</div>
+    <div id="SouradniceStredu">Souradnice stredu:<br>Rozsah:<br>Zvetseni:</div>
     <a href="http://code.google.com/apis/maps/documentation/examples/">http://code.google.com/apis/maps/documentation/examples/</a>
     <br>
     <a href="http://code.google.com/apis/kml/documentation/kml_tut.html">http://code.google.com/apis/kml/documentation/kml_tut.html</a>
     <br>
     <a href="http://mapki.com/wiki/Knowledge_Base">http://mapki.com/wiki/Knowledge_Base</a>
     <br>
     <a href="http://www.bdcc.co.uk/Gmaps/BdccGmapBits.htm">http://www.bdcc.co.uk/Gmaps/BdccGmapBits.htm</a>
     <br>
     http://www.czfree.net/forum/showthread.php?postid=197732#post197732
+    <td>
+    <table border="1">
+    <tr>
+    <td>Mereni vzdalenosti a uhlu</td><td>A</td><td>B</td><td>C</td>
+    </tr>
+    <tr>
+    <td><div id="NodeCoordinatesA">A klikni na mapu</div></td><td><div id="NodeAngleACB">ACB</div></td>
+    <td><div id="NodeDistanceAB">AB</div></td><td><div id="NodeDistanceAC">AC</div></td>
+    </tr>
+    <tr>
+    <td><div id="NodeCoordinatesB">B klikni podruhe</div></td><td><div id="NodeDistanceBA">BA</div></td>
+    <td><div id="NodeAngleBAC">BAC</div></td><td><div id="NodeDistanceBC">BC</div></td>
+    </tr>
+    <tr>
+    <td><div id="NodeCoordinatesC">C klikni potreti</div></td><td><div id="NodeDistanceCA">CA</div></td>
+    <td><div id="NodeDistanceCB">CB</div></td><td><div id="NodeAngleCBA">BAC</div></td>
+    </tr>
+    <tr>
+    <td></td><td><div id="NodeDistanceBAC">B-A-C</div></td>
+    <td><div id="NodeDistanceABC">A-B-C</div></td><td><div id="NodeDistanceBCA">B-C-A</div></td>
+    </tr>
+    </table>
+    </td>
     </td>
     </tr>
     <tr>
     <td colspan=2>