diff options
author | Mark Wells <mark@freeside.biz> | 2016-10-10 11:59:41 -0700 |
---|---|---|
committer | Mark Wells <mark@freeside.biz> | 2016-10-10 11:59:41 -0700 |
commit | 49d9ea969069430ef3fe23e5b1ac3599e929bb04 (patch) | |
tree | 24a3feb13b0a8db68f7a634de239b97d106a5efe /httemplate/search/elements/gmap.html | |
parent | 53a8c81b4f3a414803a52fc8114b26a71055d012 (diff) |
new tower/sector UI, mapping features, and network monitoring, #37802
Diffstat (limited to 'httemplate/search/elements/gmap.html')
-rw-r--r-- | httemplate/search/elements/gmap.html | 63 |
1 files changed, 43 insertions, 20 deletions
diff --git a/httemplate/search/elements/gmap.html b/httemplate/search/elements/gmap.html index b7d135dd6..69fdc5a09 100644 --- a/httemplate/search/elements/gmap.html +++ b/httemplate/search/elements/gmap.html @@ -37,6 +37,9 @@ Generic Google Maps front end. </%doc> <%init> + +my $apikey = FS::Conf->new->config('google_maps_api_key'); + foreach (@features) { $_->{type} = 'Feature'; # any other per-feature massaging can go here @@ -57,7 +60,7 @@ body { height: 100%; margin: 0px; padding: 0px } #map_canvas { height: 100%; } </style> -<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3"> +<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3&key=<% $apikey %>"> </script> <script type="text/javascript"> @@ -86,7 +89,42 @@ var featureStyle = function(feature) { var map; var overlays = []; -function initMap() { +var infoWindow; // shared among all users + +var clickHandler = function(ev) { + var feature = ev.feature; + if ( feature.getGeometry().getType() == 'Point' ) { + // then pop up an info box with the feature content + infoWindow.close(); + infoWindow.setPosition(feature.getGeometry().get()); + + if ( feature.getProperty('content') ) { + infoWindow.setContent(feature.getProperty('content')); + } else { + infoWindow.setContent(''); + } + + if ( feature.getProperty('url') ) { + $.ajax({ + url: feature.getProperty('url'), + success: function(data) { + infoWindow.setContent(data); + } + }); + infoWindow.open(map); + } else { + infoWindow.open(map); + } + } + + // snap to feature ROI if it has one + if ( feature.getProperty('bounds') ) { + map.fitBounds( feature.getProperty('bounds') ); + } + +}; + +var initMap = function() { var canvas = $('#map_canvas'); map = new google.maps.Map(canvas[0], { zoom: 6 }); try { @@ -110,24 +148,9 @@ function initMap() { map.fitBounds(bounds); map.data.setStyle(featureStyle); - var info = new google.maps.InfoWindow; - map.data.addListener('click', function(ev) { - var feature = ev.feature; - if ( feature.getGeometry().getType() == 'Point' ) { - // then pop up an info box with the feature content - info.close(); - info.setPosition(feature.getGeometry().get()); - info.setContent(feature.getProperty('content')); - info.open(map); - } - - // snap to feature ROI if it has one - if ( feature.getProperty('bounds') ) { - map.fitBounds( feature.getProperty('bounds') ); - } - - }); // addListener() - + infoWindow = new google.maps.InfoWindow; + map.data.addListener('click', clickHandler); + // xxx remove this later data_overlays.forEach(function(x) { var url = x.url; delete x.url; |