Hopiu/jquery-mobile
1
0
Fork 0
mirror of https://github.com/Hopiu/jquery-mobile.git synced 2026-04-24 08:04:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

removed the google maps experiment

Browse source
This commit is contained in:
scottjehl 2012-01-26 10:49:02 +07:00
parent 9732110552
commit 3c07beffad
4 changed files with 0 additions and 104 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
experiments/google-maps/index.html
View file

@ -1,25 +0,0 @@
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Main Page</title>
<link rel="stylesheet" href="../../css/themes/default/jquery.mobile.css" />
<script src="../../js/jquery.js"></script>
<script src="../../js/"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
</head>
<body>
<div data-role="page">
<div data-role="header"><h1>Google maps view</h1></div>
<div data-role="content">
<p>If you're linking to a map page with jQuery Mobile's Ajax behavior, be sure to load google maps in the first real page's head, since it uses document.write and can not be included in the data-role=page div like normal scripts can. <a href="map.html?">View map</a></p>
</div>
</div>
</body>
</html>

1
experiments/google-maps/map.css
View file

@ -1 +0,0 @@
.page-map, .ui-content, #map-canvas { width: 100%; height: 100%; padding: 0; }

30
experiments/google-maps/map.html
View file

@ -1,30 +0,0 @@
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Main Page</title>
<link rel="stylesheet" href="../../css/themes/default/jquery.mobile.css" />
<script src="../../js/jquery.js"></script>
<script src="../../js/"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
</head>
<body>
<div data-role="page" class="page-map">
<script src="map.js"></script>
<link rel="stylesheet" href="map.css" />
<div data-role="header"><h1>Map View</h1></div>
<div data-role="content">
<div id="map-canvas">
<!-- map loads here... -->
</div>
</div>
</div>
</body>
</html>

48
experiments/google-maps/map.js
View file

@ -1,48 +0,0 @@
//thx @elroyjetson for the code example
// When map page opens get location and display map
$('.page-map').live("pagecreate", function() {
//boston :)
var lat = 42.35843,
lng = -71.059773;
//try to get GPS coords
if( navigator.geolocation ) {
//redirect function for successful location
function gpsSuccess(pos){
if( pos.coords ){
lat = pos.coords.latitude;
lng = pos.coords.longitude;
}
else{
lat = pos.latitude;
lng = pos.longitude;
}
}
function gpsFail(){
//Geo-location is supported, but we failed to get your coordinates. Workaround here perhaps?
}
navigator.geolocation.getCurrentPosition(gpsSuccess, gpsFail, {enableHighAccuracy:true, maximumAge: 300000});
}
/*
if not supported, you might attempt to use google loader for lat,long
$.getScript('http://www.google.com/jsapi?key=YOURAPIKEY',function(){
lat = google.loader.ClientLocation.latitude;
lng = google.loader.ClientLocation.longitude;
});
*/
var latlng = new google.maps.LatLng(lat, lng);
var myOptions = {
zoom: 10,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map-canvas"),myOptions);
});