--- a/busui/index.php +++ b/busui/index.php @@ -1,1 +1,101 @@ +<!doctype html> +<html> + <head> + <meta charset="UTF-8" /> + <title>jQTouch β</title> + <style type="text/css" media="screen">@import "jqtouch/jqtouch.min.css";</style> + <style type="text/css" media="screen">@import "themes/jqt/theme.min.css";</style> + <script src="jqtouch/jquery.1.3.2.min.js" type="text/javascript" charset="utf-8"></script> + <script src="jqtouch/jqtouch.min.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"> + 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 setDisplay(text) { + $('.info').empty().append(text) + } + + // We pass "updateLocation" a callback function, + // to run once we have the coordinates. + // We also set it to a variable, so we can know + // right away if it's working or not + var lookup = jQT.updateLocation(function(coords){ + if (coords) { + setDisplay('Latitude: ' + coords.latitude + '<br />Longitude: ' + coords.longitude); + $('.nearby').empty().append('<a href="list.php?lat=' + coords.latitude + '&lng=' + coords.longitude + '">Nearby List</a>'); + } else { + setDisplay('Device not capable of geo-location.'); + } + }); + + if (lookup) { + setDisplay('Looking up location…'); + } + }); + // Some sample Javascript functions: + $(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 + '… '); + }). + 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> + <body> + <div id="home" class="current"> + <div class="toolbar"> + <h1>jQTouch</h1> + <a class="button slideup" id="infoButton" href="#about">About</a> + </div> + <ul class="rounded"> + <li class="arrow"><a href="#ui">User Interface</a> <small class="counter">4</small></li> + <li class="arrow"><a href="list.php">All stops List</a></li> + <li class="arrow nearby">Nearby List</li> + <li class="arrow"><a href="list.php">Favourites List</a></li> + </ul> + <div class="info"> + <p>Add this page to your home screen to view the custom icon, startup screen, and full screen mode.</p> + </div> + </div> + </body> +</html>