Mirror/betaflight-configurator
1
0
Fork 0
mirror of https://github.com/betaflight/betaflight-configurator.git synced 2025-07-19 14:25:14 +03:00
Code Issues Wiki Activity

placing a sandboxed googlemap

Browse source
This commit is contained in:
skaman82 2015-11-17 03:27:44 +01:00
parent 644c8da1cf
commit 03252dd8c4
4 changed files with 85 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

5
manifest.json
View file

@ -18,6 +18,11 @@
} }
}, },
"sandbox": {
"pages": [
"tabs/map.html"]
},
"permissions": [ "permissions": [
"https://www.google-analytics.com/", "https://www.google-analytics.com/",
"https://*.github.com/", "https://*.github.com/",

15
tabs/gps.css
View file

@ -18,13 +18,24 @@
.tab-gps a { .tab-gps a {
font-weight: bold; font-weight: bold;
te }
#map-canvas {
height: 100%;
background: #ccc;
width: 100%;
float: left;
} }
#map { #map {
display:none; height: 100%;
width: 100%;
} }
.tab-gps iframe {
height: 100%;
width: 100%;
}
progress[value]::-webkit-progress-bar { progress[value]::-webkit-progress-bar {

6
tabs/gps.html
View file

@ -146,13 +146,15 @@
</div> </div>
</div> </div>
<div class="cf_column half"> <div class="cf_column half">
<div class="gui_box grey"> <div class="gui_box grey" style="height: 444px;">
<div id="connect" style="display:none; text-align:center;"> <div id="connect" style="display:none; text-align:center;">
please check your internet connection please check your internet connection
<div class="default_btn" style="width:50px; margin-left:auto; margin-right:auto; float:none;"><a id="check">retry</a></div> <div class="default_btn" style="width:50px; margin-left:auto; margin-right:auto; float:none;"><a id="check">retry</a></div>
</div> </div>
<div id="map" style="margin-top:10px;" style="display:none;"> <div id="map" style="margin-top:0px; display:none;">
Online check success! Map can be loaded here! Online check success! Map can be loaded here!
<iframe src="tabs/map.html"></iframe>
</div> </div>
</div> </div>

62
tabs/map.html Normal file
View file

@ -0,0 +1,62 @@
<!DOCTYPE html>
<html>
<head>
<title>Asynchronous Loading</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<script>
function loadMapScript() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true&callback=initialize';
document.head.appendChild(script);
}
window.onload = loadMapScript;
var map;
function initialize() {
var mapOptions = {
zoom: 17,
streetViewControl: false,
// mapTypeId: google.maps.MapTypeId.SATELLITE,
center: {lat: 53.570645, lng: 10.001362}
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
var marker = new google.maps.Marker({
// The below line is equivalent to writing:
// position: new google.maps.LatLng(-34.397, 150.644)
position: {lat: 53.570645, lng: 10.001362},
map: map
});
// You can use a LatLng literal in place of a google.maps.LatLng object when
// creating the Marker object. Once the Marker object is instantiated, its
// position will be available as a google.maps.LatLng object. In this case,
// we retrieve the marker's position using the
// google.maps.LatLng.getPosition() method.
var infowindow = new google.maps.InfoWindow({
content: '<p>Marker Location:' + marker.getPosition() + '</p>'
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map, marker);
});
}
// sandbox docs1: https://github.com/GoogleChrome/chrome-app-samples/tree/master/samples/sandbox
// sandbox docs1: https://github.com/GoogleChrome/chrome-app-samples/tree/master/samples/sandboxed-content
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>