<!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" />
	</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>

		<!-- field upper left, alt: text if mouseover picture  -->
		<div class="signet"><img class="siegel" src="./images/siegel.png" alt="Siegel Los Angeles" /></div>
		<!-- field upper right: panorama-->
		<div class="picture"><img src="./images/blick.jpg" alt="Panorama Los Angeles"/></div>
		<div class="data">
			<p class='title'>Google Maps</p>
			<img class="startbild" src="./images/flagge.png" alt="flagge"/>
		</div>
		<!--field lower left: navigation-->
		<div class="navi">
			<p><a href ='./index.html'>Startseite</a></p>
			<p><a href='./poi.html'>Touristeninformation</a></p>
			<p><a href='./ml.html'>Metro</a></p>
			<p>Google Maps</p>
				<ol>
					
					<li><a href='./query19.php'>Wo befinden sich beliebte Bars/Restaurants bzw. Points of Interest?</a></li>
					<li><a href='./query20.php'>Wo befindet sich welche Linie?</a></li>
					<li><a href='./query21.php'>Wo befindet sich eine bestimmte Haltestelle?</a></li>
					<li><a href='./query18.php'>Haltestellenextrema</a></li>
				</ol>
			<p><a href='./sonstiges.html'>Sonstiges</a></p>
			<p><a href='./impressum.html'>Impressum</a></p>
			
			<p>
				<a href="http://validator.w3.org/check?uri=referer">
					<img src="./images/valid-xhtml10-blue.png" alt="Valid XHTML 1.0 Strict" height="31" width="88" />
				</a>
				<a href="http://jigsaw.w3.org/css-validator/check/referer">
					<img style="border:0;width:88px;height:31px"
					src="./images/valid-css-blue.gif"
					alt="CSS ist valide!" />
				</a>
			</p>

		</div>
		<div class="data"><p class="menue">Wo befindet sich welche Linie?</p>
<?php

		//Connect with database
		require_once("db_connection.php");
	
		//If value is submitted, show choosen line on map
		if (array_key_exists('routes',$_GET)) {
		   $line = $_GET['routes'];
		   echo "<p class='data'>Sie haben die Linie ".$line." ausgewählt.</p>\n";                            
		} else { 
			$line = ""; 
		}
		echo "<p>Bitte wählen Sie eine Linie!</p>\n";
		echo "<form action='' method='get'><p>\n";
		echo "<select name='routes' size='1'>\n";
		echo '<option value="_">Bitte wählen...</option>';
		$sql = "SELECT DISTINCT rid FROM stopsonroutes ORDER BY rid ";
		$result1 = mysql_query($sql) OR die("Mist! ". mysql_error());
		if ($result1) {
			$rows = mysql_num_rows($result1);
			$cols = mysql_num_fields($result1);
			for($r=0; $r< $rows; $r++) {
				for($c=0; $c<$cols; $c++) { 
					echo "<option value='".mysql_result($result1, $r, $c)."'>".mysql_result($result1, $r, $c)."</option>\n";
				}
			}
		} else {
			echo "Fehler result1\n";
		}
		echo "</select>\n";
		echo "<input type='submit' value='Auswählen' />\n";
		echo "<input type='hidden' name='page' id='page' value='querys/query16' />";
		echo "<input type='hidden' name='nav' id='nav' value='subpages/Kartenabfragen' />";
		echo "</p></form>\n";
		$zoom = "10";
		echo '<script type="text/javascript">';
		echo '//<![CDATA[
		   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 GLargeMapControl());
					map.addControl(new GMapTypeControl());
					map.addControl(new GScaleControl());
					map.addControl(new GOverviewMapControl());
					map.setCenter(new GLatLng(34.024908,-118.392846), '.$zoom.');
		';
		//SQL query
	if ($line != "") {
		$sql ="SELECT stops.lat , stops.lon, routes.hexcolor , routes.id
			FROM stops , stopsonroutes, routes 
			WHERE stops.id=stopsonroutes.sid 
			AND '".$line."'=stopsonroutes.rid
			AND '".$line."'=routes.id
			ORDER BY stopsonroutes.succession";
		$result = mysql_query($sql) OR die("Mist! ". mysql_error());
		$rows = mysql_num_rows($result);
		$cols = mysql_num_fields($result);
		if ($rows != 0) {
			for($r=0; $r< $rows; $r++) {
				$xobj[$r] = mysql_result($result, $r, 0);
				$yobj[$r] = mysql_result($result, $r, 1);
				$hexcolor[$r]= mysql_result($result, $r, 2);
			}
			echo '
			var lineData = new Array();
			';
		
			for ($r=0; $r<$rows; $r++) {
				echo '
				 lineData.push(new GLatLng('.$xobj[$r].','.$yobj[$r].'));
			';
			}
			echo'
				 map.addOverlay(new GPolyline(lineData, "#000000", 0, .75));  
				 map.addOverlay(new GPolyline(lineData,"'.$hexcolor[2].'", "4", 1)); 
			';
		}
	}
		echo '
				}
			}
			//]]></script>
		';
		//If no Line is choosen, show all lines
?> 
		
			<div id="map" style="width: 850px; height: 550px;"></div>
		</div>
	</body>
</html>