<!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">

	<head>
	
		<title>Los Angeles Stadt der Engel</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<link rel='stylesheet' media='all' type="text/css" href="stylesheet.css" />
		<style type="text/css"></style>
	</head>
    
    <body onload="load()" onunload="GUnload()">
		<script
			src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAzosMcEBJXrsEQFGBQAWclRQgU1QyBe_kcGDWdfFXsq08_1MSqxREpHLDVDDm5p9ub3kwCQeYethC1w"
			type="text/javascript">
		</script>
		
		<?php
			require_once("db_connection.php");
			
			$lat = "34.024908";
			$long = "-118.392846";
			$zoom = "10";

			$query1 = "SELECT lat, lon, name FROM stops 
						WHERE lat = (SELECT MAX(lat) FROM stops)
						OR lat = (SELECT MIN(lat) FROM stops)
						OR lon = (SELECT MAX(lon) FROM stops)
						OR lon = (SELECT MIN(lon) FROM stops)";
			$result1 = mysql_query($query1) OR die("Fehler: ". mysql_error());
				
			if ($result1) {
				$rows = mysql_num_rows($result1);
				$cols = mysql_num_fields($result1);
				for($r=0; $r< $rows; $r++) {
					$xobj[$r] = mysql_result($result1, $r, 0);
					$yobj[$r] = mysql_result($result1, $r, 1);
					$nobj[$r] = mysql_result($result1, $r, 2);
				}
			}

			//create map
			echo '<script type="text/javascript">//<![CDATA[';
			echo '/*'.$rows.' '.$cols.' '.$xobj[0].' '.$xobj[1].'*/';
			echo  '
				function load() {
					function createListener (marker, text) {
						GEvent.addListener(marker, "click", function() {
							marker.openInfoWindowHtml(text);
						});
					}
					if (GBrowserIsCompatible()) {
						var map = new GMap2(document.getElementById("map"));
						map.addControl(new GSmallMapControl());
						map.addControl(new GMapTypeControl());
						map.addControl(new GScaleControl());
						map.addControl(new GOverviewMapControl());
			'; 
			
			//create marker
			echo '
					map.setCenter(new GLatLng('.$lat.', '.$long.'), '.$zoom.');
					var icon = new GIcon();
					icon.image = "./images/Metrologo.png";
					icon.iconSize = new GSize(20, 20);
					icon.iconAnchor = new GPoint(10, 10);
					icon.infoWindowAnchor = new GPoint(10, 10);
					var point = new Array();
					var text = new Array();
			'; 

			for ($r=0; $r<$rows; $r++) {
				echo '
					point['.$r.'] = new GLatLng('.$xobj[$r].','.$yobj[$r].');
					text['.$r.'] = "<b>'.$nobj[$r].'</b>";
				';
			}
			
			echo'
					var marker = new Array();
					for (i=0; i< point.length; i++) {
						marker[i] = new GMarker(point[i],icon);
						map.addOverlay(marker[i]);
						createListener (marker[i], text[i]);
					}
			';
			
			echo '
					}
				}
				//]]></script>
			';
			
			mysql_free_result($result1);
			mysql_close($db);
		?> 
			
	
		

		<?php require_once("map.txt"); ?>
		<div class="data"><p class="menue">Haltestellenextrema</p>
		<div id="map" style="width: 850px; height: 550px;"></div>
		<?php
			echo "<br />\n";
			echo "<table>\n";
			echo "\t<tr><th></th><th>Haltestelle</th><th>Geographische Breite</th><th>Geographische Länge</th></tr>\n";
			$i=1;
			for($r=0; $r< $rows; $r++){
				echo "\t<tr><th>Punkt ".$i."</th><td>".$nobj[$r]."</td><td>".$xobj[$r]."</td><td>".$yobj[$r]."</td></tr>\n"; 
				$i++;
			}
			echo "</table>";
		?>
		</div>
	</body>
</html>