More between points work + mobile UI work:
[bus.git] / busui / index.php
blob:a/busui/index.php -> blob:b/busui/index.php
  <?php
  include('common.inc.php');
  ?>
<!doctype html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<title>jQTouch &beta;</title> <title>bus.lambdacomplex.org</title>
<style type="text/css" media="screen">@import "jqtouch/jqtouch.min.css";</style> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />
<style type="text/css" media="screen">@import "themes/jqt/theme.min.css";</style> <script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
<script src="jqtouch/jquery.1.3.2.min.js" type="text/javascript" charset="utf-8"></script> <script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>
<script src="jqtouch/jqtouch.min.js" type="application/x-javascript" charset="utf-8"></script> <!-- <script src="jqtouch/extensions/jqt.location.js" type="application/x-javascript" charset="utf-8"></script> -->
<script src="extensions/jqt.location.js" type="application/x-javascript" charset="utf-8"></script>  
<script type="text/javascript" charset="utf-8"> <!-- <script type="text/javascript" charset="utf-8">
var jQT = new $.jQTouch({  
icon: 'jqtouch.png',  
addGlossToIcon: false,  
startupScreen: 'jqt_startup.png',  
statusBar: 'black',  
preloadImages: [  
'themes/jqt/img/back_button.png',  
'themes/jqt/img/back_button_clicked.png',  
'themes/jqt/img/button_clicked.png',  
'themes/jqt/img/grayButton.png',  
'themes/jqt/img/whiteButton.png',  
'themes/jqt/img/loading.gif'  
]  
});  
$(function(){ $(function(){
function setDisplay(text) { function setDisplay(text) {
$('.info').empty().append(text) $('.latlng').empty().append(text)
} }
// We pass "updateLocation" a callback function, // We pass "updateLocation" a callback function,
// to run once we have the coordinates. // to run once we have the coordinates.
// We also set it to a variable, so we can know // We also set it to a variable, so we can know
// right away if it's working or not // right away if it's working or not
var lookup = jQT.updateLocation(function(coords){ var lookup = jQT.updateLocation(function(coords){
if (coords) { if (coords) {
setDisplay('Latitude: ' + coords.latitude + '<br />Longitude: ' + coords.longitude); setDisplay('Latitude: ' + coords.latitude + '<br />Longitude: ' + coords.longitude);
$('.nearby').empty().append('<a href="list.php?lat=' + coords.latitude + '&lng=' + coords.longitude + '">Nearby List</a>'); $('.nearby').empty().append('<a href="list.php?lat=' + coords.latitude + '&lng=' + coords.longitude + '">Nearby List</a>');
} else { } else {
setDisplay('Device not capable of geo-location.'); setDisplay('Device not capable of geo-location.');
} }
}); });
if (lookup) { if (lookup) {
setDisplay('Looking up location&hellip;'); setDisplay('Looking up location&hellip;');
} }
}); });
// Some sample Javascript functions: </script> -->
$(function(){  
$('a[target="_blank"]').click(function() {  
if (confirm('This link opens in a new window.')) {  
return true;  
} else {  
$(this).removeClass('active');  
return false;  
}  
});  
// Page animation callback events  
$('#pageevents').  
bind('pageAnimationStart', function(e, info){  
$(this).find('.info').append('Started animating ' + info.direction + '&hellip; ');  
}).  
bind('pageAnimationEnd', function(e, info){  
$(this).find('.info').append(' finished animating ' + info.direction + '.<br /><br />');  
});  
// Page animations end with AJAX callback event, example 1 (load remote HTML only first time)  
$('#callback').bind('pageAnimationEnd', function(e, info){  
if (!$(this).data('loaded')) { // Make sure the data hasn't already been loaded (we'll set 'loaded' to true a couple lines further down)  
$(this).append($('<div>Loading</div>'). // Append a placeholder in case the remote HTML takes its sweet time making it back  
load('ajax.html .info', function() { // Overwrite the "Loading" placeholder text with the remote HTML  
$(this).parent().data('loaded', true); // Set the 'loaded' var to true so we know not to re-load the HTML next time the #callback div animation ends  
}));  
}  
});  
// Orientation callback event  
$('body').bind('turn', function(e, data){  
$('#orient').html('Orientation: ' + data.orientation);  
});  
});  
</script>  
</head> </head>
<body> <body>
<div id="home" class="current"> <div data-role="page" data-theme="b" id="jqm-home">
<div class="toolbar"> <div id="jqm-homeheader">
<h1>jQTouch</h1> <p>bus.lambdacomplex.org</p>
<a class="button slideup" id="infoButton" href="#about">About</a> </div>
</div> <div data-role="content">
<ul class="rounded"> <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b">
<li class="arrow"><a href="#ui">User Interface</a> <small class="counter">4</small></li> <li data-role="list-divider">Stops</li>
<li class="arrow"><a href="list.php">All stops List</a></li> <li><a href="stopList.php">All stops List</a></li>
<li class="arrow nearby">Nearby List</li> <li class="nearby"><a href="">Nearby List</a></li>
<li class="arrow"><a href="list.php">Favourites List</a></li> <li><a href="stopList.php">Favourites List</a></li>
  </ul>
  <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b">
  <li data-role="list-divider">Routes</li>
  <li><a href="routeList.php">All Routes List</a></li>
  <li class="nearby"><a href="">Nearby List</a></li>
  <li><a href="routeList.php">Favourites List</a></li>
</ul> </ul>
<div class="info"> <div class="info">
<p>Add this page to your home screen to view the custom icon, startup screen, and full screen mode.</p> <p class="latlng"></p>
  Time: <?php echo date("H:m"); ?> <br>
  Service Period: <?php echo ucwords(service_period()); ?>
</div> </div>
</div> </div>
</body> </div>
  </body>
</html> </html>