1 <& /elements/header.html, '' &>
3 <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3&libraries=places&key=<% $apikey %>"></script>
7 #map_canvas { margin: 0 auto; height: 100%; }
8 span.is_up { font-weight: bold; color: green }
9 span.is_down { font-weight: bold; color: red }
10 #search_location { width: 300px }
12 .sector_list li { list-style: none }
13 .sector_list li a { width: 150px }
16 <div id="map_canvas"></div>
17 <input type="text" id="search_location" style="width: 180px">
20 <script type="text/javascript">
22 var baseMarkerStyle = {
25 path: google.maps.SymbolPath.CIRCLE,
34 var baseCoverageStyle = {
39 var coverageStyle = function(feature) {
40 var s = $.extend(true, {}, baseCoverageStyle, feature.getProperty('style'));
41 if ( feature.getProperty('low') ) {
43 } else if ( feature.getProperty('high') ) {
49 var markerStyle = function(feature) {
50 return $.extend(true, {}, baseMarkerStyle, feature.getProperty('style'));
54 var infoWindow = new google.maps.InfoWindow; // shared among all users
56 var clickHandler = function(ev) {
57 var feature = ev.feature;
58 if ( feature.getGeometry().getType() == 'Point' ) {
59 // then pop up an info box with the feature content
61 infoWindow.setPosition(feature.getGeometry().get());
63 if ( feature.getProperty('content') ) {
64 infoWindow.setContent(feature.getProperty('content'));
66 infoWindow.setContent('');
69 if ( feature.getProperty('url') ) {
71 url: feature.getProperty('url'),
72 success: function(data) {
73 infoWindow.setContent(data);
83 var dblclickHandler = function(ev) {
84 // do everything as for single click
86 // plus zoom to the feature
87 var feature = ev.feature;
88 if (feature.getGeometry().getType() == 'Point') {
89 map.setCenter(feature.getGeometry().get());
94 var zoomLayer = function(layer) {
95 // takes a google.maps.Data object
96 var bounds = new google.maps.LatLngBounds;
97 layer.forEach(function(feature) {
98 var g = feature.getGeometry();
99 if (g.getType() == 'Point') {
100 bounds.extend(g.get());
101 } else if (g.getArray) {
102 g.getArray().forEach(function(point) { bounds.extend(point); });
106 map.fitBounds(bounds);
109 // set up the main layer
110 var tower_data = new google.maps.Data;
111 tower_data.addGeoJson(<% encode_json($tower_data) %>);
112 tower_data.setStyle(markerStyle);
113 tower_data.addListener('click', clickHandler);
114 tower_data.addListener('dblclick', dblclickHandler);
116 var towernums = <% encode_json(\@towernums) %>;
117 var tower_svc_data = {};
118 var tower_coverage_data = {};
120 var revertLayerStyles = function() {
121 // mostly, just to re-hide all connecting lines when something is hidden
122 for (var t in tower_svc_data) {
123 tower_svc_data[t].revertStyle();
127 towernums.forEach(function(towernum) {
128 var layer = new google.maps.Data;
129 tower_svc_data[towernum] = layer;
131 '<% $fsurl %>search/svc_broadband-json.cgi?towernum=' + towernum
133 layer.setStyle(markerStyle);
134 layer.addListener('click', clickHandler);
135 layer.addListener('click', function(ev) { // show connecting line
136 var id = ev.feature.getId();
137 var f_line = layer.getFeatureById(id + '/line');
138 layer.overrideStyle(f_line, { visible: true});
141 layer = new google.maps.Data;
143 '<% $fsurl %>misc/sector_coverage-json.cgi?towernum=' + towernum
145 layer.setStyle(coverageStyle);
146 tower_coverage_data[towernum] = layer;
149 function show_svc_data(towernum, show) {
151 tower_svc_data[towernum].setMap(window.map);
153 tower_svc_data[towernum].setMap(null);
157 function show_coverage_data(towernum, show) {
159 tower_coverage_data[towernum].setMap(window.map);
161 tower_coverage_data[towernum].setMap(null);
165 // toggle visibility of the services
166 infoWindow.addListener('domready', function(ev) {
167 var show_services_box = $('input[name=show_services]');
168 var towernum = show_services_box.val();
169 var is_shown = tower_svc_data[towernum].getMap() == map;
170 show_services_box.prop('checked', is_shown);
171 show_services_box.on('click', function(clickev) {
172 show_svc_data(towernum, this.checked);
175 var show_coverage_box = $('input[name=show_coverage]');
176 var towernum = show_coverage_box.val();
177 var is_shown = tower_coverage_data[towernum].getMap() == map;
178 show_coverage_box.prop('checked', is_shown);
179 show_coverage_box.on('click', function(clickev) {
180 show_coverage_data(towernum, this.checked);
184 infoWindow.addListener('closeclick', revertLayerStyles);
185 infoWindow.addListener('position_changed', revertLayerStyles);
187 var initMap = function() {
188 var canvas = $('#map_canvas');
190 // set window height correctly
191 canvas.css('height', window.innerHeight - (canvas.offset().top) - 30);
192 canvas.css('width', window.innerWidth - 30);
194 map = new google.maps.Map(canvas[0], { zoom: 6 });
197 var searchbox_input = $('#search_location')[0];
198 var searchbox = new google.maps.places.SearchBox(searchbox_input);
199 map.controls[google.maps.ControlPosition.TOP_RIGHT].push(searchbox_input);
201 map.addListener('bounds_changed', function() {
202 searchbox.setBounds(map.getBounds());
205 searchbox.addListener('places_changed', function() {
206 var places = searchbox.getPlaces();
207 // xxx fancy mode: find the nearest tower and estimate signal strength
209 if (places[0].geometry.viewport) {
210 map.fitBounds(places[0].geometry.viewport);
212 map.setCenter(places[0].geometry.location);
218 // put tower locations on map
219 tower_data.setMap(map);
220 zoomLayer(tower_data);
227 <& /elements/footer.html &>
230 die "access denied" unless
231 $FS::CurrentUser::CurrentUser->access_right('List services');
233 my $conf = new FS::Conf;
235 my $apikey = $conf->config('google_maps_api_key');
237 my @features; # geoJSON structure
239 my @towers = qsearch('tower', {
240 'latitude' => { op=>'!=', value=>''},
241 'longitude' => { op=>'!=', value=>''},
243 my %sectors; # towernum => arrayref
246 foreach my $tower (@towers) {
247 my $towernum = $tower->towernum;
248 push @towernums, $towernum;
250 $tower->longitude + 0,
251 $tower->latitude + 0,
256 id => 'tower/'.$towernum,
259 coordinates => \@coord,
265 url => $fsurl.'images/antenna-square-21x51.png',
266 anchor => { x => 10, y => 4 },
267 strokeColor => ($tower->color || 'black'),
270 content => include('.tower', $tower),
274 $sectors{$towernum} = [ $tower->tower_sector ];
279 type => 'FeatureCollection',
280 features => \@features
286 % my $can_edit = $FS::CurrentUser::CurrentUser->access_right('Configuration');
289 <a target="_blank" href="<% $fsurl %>edit/tower.html?<% $tower->towernum %>">
291 Tower #<% $tower->towernum %> | <% $tower->towername %>
296 % my $count_query = 'SELECT COUNT(*) FROM svc_broadband LEFT JOIN addr_status using (ip_addr) JOIN tower_sector USING (sectornum) WHERE tower_sector.towernum = '.$tower->towernum;
297 % my $num_down = FS::Record->scalar_sql("$count_query AND addr_status.up IS NULL AND addr_status._date IS NOT NULL");
298 % my $num_up = FS::Record->scalar_sql("$count_query AND addr_status.up IS NOT NULL");
299 <input type="checkbox" name="show_services" value="<% $tower->towernum %>">
300 <% emt('Show services') %>
301 ( <% $num_up %> <SPAN CLASS="is_up"><% emt('UP') %></SPAN>
302 <% $num_down %> <SPAN CLASS="is_down"><% emt('DOWN') %></SPAN> )
304 <input type="checkbox" name="show_coverage" value="<% $tower->towernum %>">
305 <% emt('Show coverage') %>
306 <ul class="sector_list">
307 % foreach my $sector ($tower->tower_sector) {
308 % # could be more descriptive here
309 <li><% emt($sector->sectorname) %>
311 % foreach my $export ($sector->part_export) {
312 % $export->export_links($sector, \@links_array); # already HTML, do not escape
314 <% join(' ', @links_array) %>