From: maxious <maxious@lambdacomplex.org>
Date: Fri, 15 Jul 2011 00:14:05 +0000
Subject: Adaptive layout upgrade
X-Git-Url: https://maxious.lambdacomplex.org/git/?p=busui.git&a=commitdiff&h=6bc059876de3526ef7995b1bef02f5fbfcde6eaa
---
Adaptive layout upgrade
---


--- a/include/common-template.inc.php
+++ b/include/common-template.inc.php
@@ -138,21 +138,7 @@
     -moz-border-radius: 15px;
 border-radius: 15px;
     }
- 
-/*#leftcolumn { 
-	float: none;
-}			
-.min-width-768px #leftcolumn {
-	float: left;
-	width: 30%;
-}
-#rightcolumn { 
-	float: none;
-}			
-.min-width-768px #rightcolumn {
-	float: right;
-	width: 68%;
-}*/	
+
 
 #footer {
 clear:both;
@@ -175,6 +161,134 @@
 width:auto; 
 height:auto; 
 }
+
+
+// adaptive layout from jQuery Mobile docs site
+.type-interior .content-secondary {
+	border-right: 0;
+	border-left: 0;
+	margin: 10px -15px 0;
+	background: #fff;
+	border-top: 1px solid #ccc;
+}
+.type-home .ui-content {
+	margin-top: 5px;
+}
+.type-interior .ui-content {
+	padding-bottom: 0;
+}
+.content-secondary .ui-collapsible-contain {
+	padding: 10px 15px;
+
+}
+.content-secondary .ui-collapsible-heading {
+	margin: 0 0 30px;
+}
+.content-secondary .ui-collapsible-heading-collapsed,
+.content-secondary .ui-collapsible-content {
+	padding:0;
+	margin: 0;
+}
+@media all and (min-width: 650px){
+.content-secondary {
+		text-align: left;
+		float: left;
+		width: 45%;
+		background: none;
+		border-top: 0;
+	}
+	.content-secondary,
+	.type-interior .content-secondary {
+		margin: 30px 0 20px 2%;
+		padding: 20px 4% 0 0;
+			background: none;
+	}
+	.type-index .content-secondary {
+		padding: 0;
+	}
+	.type-index .content-secondary .ui-listview {
+		margin: 0;
+	}
+	.content-primary {
+		width: 45%;
+		float: right;
+		margin-top: 30px;
+		margin-right: 1%;
+		padding-right: 1%;
+	}
+	.content-primary ul:first-child {
+		margin-top: 0;
+	}
+
+	.type-interior .content-primary {
+		padding: 1.5em 6% 3em 0;
+		margin: 0;
+	}
+	/* fix up the collapsibles - expanded on desktop */
+	.content-secondary .ui-collapsible-heading {
+		display: none;
+	}
+	.content-secondary .ui-collapsible-contain {
+		margin:0;
+	}
+	.content-secondary .ui-collapsible-content {
+		display: block;
+		margin: 0;
+		padding: 0;
+	}
+		.type-interior  .content-secondary .ui-li-divider {
+		padding-top: 1em;
+		padding-bottom: 1em;
+	}
+	.type-interior .content-secondary {
+		margin: 0;
+		padding: 0;
+	}
+	
+}
+@media all and (min-width: 750px){
+	.type-home .ui-content,
+	.type-interior .ui-content {
+		background-position: 39%;
+	}
+	.content-secondary {
+		width: 34%;
+	}
+	.content-primary {
+		width: 56%;
+		padding-right: 1%;
+	}	
+	.type-interior .ui-content {
+		background-position: 34%;
+	}
+}
+
+@media all and (min-width: 1200px){
+	.type-home .ui-content{
+		background-position: 38.5%;
+	}
+	.type-interior .ui-content {
+		background-position: 30%;
+	}
+	.content-secondary {
+		width: 30%;
+		padding-right:6%;
+		margin: 30px 0 20px 5%;
+	}
+	.type-interior .content-secondary {
+		margin: 0;
+		padding: 0;
+	}
+	.content-primary {
+		width: 50%;
+		margin-right: 5%;
+		padding-right: 3%;
+	}
+	.type-interior .content-primary {
+		width: 60%;
+	}
+}
+
 </style>';
 	if (strstr($_SERVER['HTTP_USER_AGENT'], 'iPhone') || strstr($_SERVER['HTTP_USER_AGENT'], 'iPod') || strstr($_SERVER['HTTP_USER_AGENT'], 'iPad')) {
 		echo '<meta name="apple-mobile-web-app-capable" content="yes" />

--- a/stop.php
+++ b/stop.php
@@ -60,7 +60,7 @@
 	}
 }
 include_header($stop['stop_name'], "stop");
-echo '<span id="leftcolumn">';
+echo '<span class="content-secondary">';
 timePlaceSettings();
 echo $stopLinks;
 if (sizeof($stops) > 0) {
@@ -76,7 +76,7 @@
 		)
 	)) ;
 }
-echo '</span><span id="rightcolumn">';
+echo '</span><span class="content-primary">';
 echo '  <ul data-role="listview"  data-inset="true">';
 if (sizeof($allStopsTrips) > 0) {
     sktimesort($allStopsTrips,"arrival_time", true);

--- a/trip.php
+++ b/trip.php
@@ -1,40 +1,42 @@
 <?php
 include ('include/common.inc.php');
-
 $routetrips = Array();
-
 if (isset($routeid) && !isset($tripid)) {
-    $trip = getRouteNextTrip($routeid);
-    $tripid = $trip['trip_id'];
-} else {
-    $trip = getTrip($tripid);
-    $routeid = $trip["route_id"];
+	$trip = getRouteNextTrip($routeid);
+	$tripid = $trip['trip_id'];
 }
-
+else {
+	$trip = getTrip($tripid);
+	$routeid = $trip["route_id"];
+}
 $routetrips = getRouteTrips($routeid);
-    
 include_header("Stops on " . $trip['route_short_name'] . ' ' . $trip['route_long_name'], "trip");
-trackEvent("Route/Trip View","View Route",  $trip['route_short_name'] . ' ' . $trip['route_long_name'], $routeid);
-
-echo '<span id="leftcolumn">';
-echo '<a href="'.$trip['route_url'].'">View Original Timetable/Map</a>';
+trackEvent("Route/Trip View", "View Route", $trip['route_short_name'] . ' ' . $trip['route_long_name'], $routeid);
+echo '<span class="content-secondary">';
+echo '<a href="' . $trip['route_url'] . '">View Original Timetable/Map</a>';
 echo '<h2>Via:</h2> <small>' . viaPointNames($tripid) . '</small>';
 echo '<h2>Other Trips:</h2> ';
 foreach (getRouteTrips($routeid) as $othertrip) {
-	echo '<a href="trip.php?tripid=' . $othertrip['trip_id'] . "&amp;routeid=" . $routeid . '">' . str_replace("  ",":00",str_replace(":00"," ",$othertrip['arrival_time'])). '</a> ';
+	echo '<a href="trip.php?tripid=' . $othertrip['trip_id'] . "&amp;routeid=" . $routeid . '">' . str_replace("  ", ":00", str_replace(":00", " ", $othertrip['arrival_time'])) . '</a> ';
 }
-flush(); @ob_flush();
+flush();
+@ob_flush();
 echo '<h2>Other directions/timing periods:</h2> ';
+$otherDir = 0;
 foreach (getRoutesByNumber($trip['route_short_name']) as $row) {
-	if ($row['route_id'] != $routeid) echo '<a href="trip.php?routeid=' . $row['route_id'] . '">' . $row['route_long_name'] . ' (' . ucwords($row['service_id']) . ')</a> ';
+	if ($row['route_id'] != $routeid) {
+		echo '<a href="trip.php?routeid=' . $row['route_id'] . '">' . $row['route_long_name'] . ' (' . ucwords($row['service_id']) . ')</a> ';
+		$otherDir++;
+	}
 }
-echo '</span><span id="rightcolumn">';
-flush(); @ob_flush();
+if ($otherDir == 0) echo "None";
+echo '</span><span class="content-primary">';
+flush();
+@ob_flush();
 echo '  <ul data-role="listview"  data-inset="true">';
 $stopsGrouped = Array();
 $tripStopTimes = getTimeInterpolatedTrip($tripid);
-echo '<li data-role="list-divider">' . $tripStopTimes[0]['arrival_time'] . ' to ' . $tripStopTimes[sizeof($tripStopTimes) - 1]['arrival_time'] . ' ' . $trip['route_long_name'] . ' (' . ucwords($tripStopTimes[0]['service_id']).')</li>';
-
+echo '<li data-role="list-divider">' . $tripStopTimes[0]['arrival_time'] . ' to ' . $tripStopTimes[sizeof($tripStopTimes) - 1]['arrival_time'] . ' ' . $trip['route_long_name'] . ' (' . ucwords($tripStopTimes[0]['service_id']) . ')</li>';
 foreach ($tripStopTimes as $key => $tripStopTime) {
 	if (($tripStopTimes[$key]["stop_name"] != $tripStopTimes[$key + 1]["stop_name"]) || $key + 1 >= sizeof($tripStopTimes)) {
 		echo '<li>';
@@ -46,27 +48,28 @@
 			$stopsGrouped["endTime"] = $tripStopTime['arrival_time'];
 			echo '<a href="stop.php?stopids=' . implode(",", $stopsGrouped['stop_ids']) . '">';
 			echo '<p class="ui-li-aside">' . $stopsGrouped['startTime'] . ' to ' . $stopsGrouped['endTime'];
-                        
-                        if (isset($_SESSION['lat']) && isset($_SESSION['lon'])) {
-						echo '<br>' . distance($tripStopTime['stop_lat'],$tripStopTime['stop_lon'], $_SESSION['lat'], $_SESSION['lon'], true) . 'm away';
-					}
-                                        echo '</p>';
+			if (isset($_SESSION['lat']) && isset($_SESSION['lon'])) {
+				echo '<br>' . distance($tripStopTime['stop_lat'], $tripStopTime['stop_lon'], $_SESSION['lat'], $_SESSION['lon'], true) . 'm away';
+			}
+			echo '</p>';
 			echo bracketsMeanNewLine($tripStopTime["stop_name"]);
 			echo '</a></li>';
-                        flush(); @ob_flush();
+			flush();
+			@ob_flush();
 			$stopsGrouped = Array();
 		}
 		else {
 			// just a normal stop
 			echo '<a href="stop.php?stopid=' . $tripStopTime['stop_id'] . (startsWith($tripStopTime['stop_code'], "Wj") ? '&amp;stopcode=' . $tripStopTime['stop_code'] : "") . '">';
-			echo '<p class="ui-li-aside">' . $tripStopTime['arrival_time']; 
+			echo '<p class="ui-li-aside">' . $tripStopTime['arrival_time'];
 			if (isset($_SESSION['lat']) && isset($_SESSION['lon'])) {
-						echo '<br>' . distance($tripStopTime['stop_lat'],$tripStopTime['stop_lon'], $_SESSION['lat'], $_SESSION['lon'], true) . 'm away';
-					}
-                                        echo '</p>';
-                                        echo bracketsMeanNewLine($tripStopTime['stop_name']);
+				echo '<br>' . distance($tripStopTime['stop_lat'], $tripStopTime['stop_lon'], $_SESSION['lat'], $_SESSION['lon'], true) . 'm away';
+			}
+			echo '</p>';
+			echo bracketsMeanNewLine($tripStopTime['stop_name']);
 			echo '</a></li>';
-                        flush(); @ob_flush();
+			flush();
+			@ob_flush();
 		}
 	}
 	else {
@@ -89,7 +92,6 @@
 	}
 }
 echo '</ul>';
-
 echo '</span>';
 include_footer();
 ?>