Merge branch 'issues/commercial/1870-aerial-maps'

13 files changed, 131 insertions, 62 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index c237355d3..7a500d688 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,6 +9,7 @@
         - Add lazy image loading on list items.
         - Improve Bing geocoder results.
         - Add option of checking passwords against Have I Been Pwned.
+        - Add aerial maps option to Bing maps.
     - Changes:
         - Mark user as active when sent an email alert.
     - Bugfixes:
diff --git a/perllib/FixMyStreet/Map/Bing.pm b/perllib/FixMyStreet/Map/Bing.pm
index 97a0d229f..4463b4ed2 100644
--- a/perllib/FixMyStreet/Map/Bing.pm
+++ b/perllib/FixMyStreet/Map/Bing.pm
@@ -8,6 +8,8 @@ use strict;
 
 sub map_type { '' }
 
+sub map_template { 'bing' }
+
 sub map_javascript { [
     '/vendor/OpenLayers/OpenLayers.fixmystreet.js',
     '/js/map-OpenLayers.js',
@@ -29,14 +31,21 @@ sub get_quadkey {
     return $key;
 }
 
-sub map_tile_base {
-    '', "//ecn.%s.tiles.virtualearth.net/tiles/r%s.png?g=6570";
+sub display_map {
+    my ($self, $c, %params) = @_;
+
+    $params{aerial} = $c->get_param("aerial") ? 1 : 0;
+
+    $self->SUPER::display_map($c, %params);
 }
 
+my $road_base = '//t%s.ssl.ak.dynamic.tiles.virtualearth.net/comp/ch/%s?mkt=en-US&it=G,L&src=t&shading=hill&og=969&n=z';
+my $aerial_base = '//t%s.ssl.ak.dynamic.tiles.virtualearth.net/comp/ch/%s?mkt=en-US&it=A,G,L&src=t&og=969&n=z';
+
 sub map_tiles {
     my ( $self, %params ) = @_;
     my ( $x, $y, $z ) = ( $params{x_tile}, $params{y_tile}, $params{zoom_act} );
-    my ($tile_sep, $tile_base) = $self->map_tile_base;
+    my $tile_base = $params{aerial} ? $aerial_base : $road_base;
     return [
         sprintf($tile_base, 't0', $self->get_quadkey($x-1, $y-1, $z)),
         sprintf($tile_base, 't1', $self->get_quadkey($x,   $y-1, $z)),
diff --git a/perllib/FixMyStreet/Map/Bromley.pm b/perllib/FixMyStreet/Map/Bromley.pm
index 518382fc0..29063778e 100644
--- a/perllib/FixMyStreet/Map/Bromley.pm
+++ b/perllib/FixMyStreet/Map/Bromley.pm
@@ -9,8 +9,6 @@ use base 'FixMyStreet::Map::FMS';
 
 use strict;
 
-sub map_tile_base {
-    '-', "//%stilma.mysociety.org/bromley/%d/%d/%d.png";
-}
+sub map_tile_base { "bromley" }
 
 1;
diff --git a/perllib/FixMyStreet/Map/FMS.pm b/perllib/FixMyStreet/Map/FMS.pm
index 126fc34bf..246d04bc0 100644
--- a/perllib/FixMyStreet/Map/FMS.pm
+++ b/perllib/FixMyStreet/Map/FMS.pm
@@ -18,32 +18,31 @@ sub map_javascript { [
     '/js/map-fms.js',
 ] }
 
-sub map_tile_base {
-    '-', "//%stilma.mysociety.org/oml/%d/%d/%d.png";
-}
+sub map_tile_base { "oml" }
 
 sub map_tiles {
     my ( $self, %params ) = @_;
     my ( $x, $y, $z ) = ( $params{x_tile}, $params{y_tile}, $params{zoom_act} );
     my $ni = in_northern_ireland_box( $params{latitude}, $params{longitude} );
     if (!$ni && $z >= 16) {
-        my ($tile_sep, $tile_base) = $self->map_tile_base;
+        my $tile_base = '//%stilma.mysociety.org/' . $self->map_tile_base . '/%d/%d/%d.png';
         return [
-            sprintf($tile_base, 'a' . $tile_sep, $z, $x-1, $y-1),
-            sprintf($tile_base, 'b' . $tile_sep, $z, $x, $y-1),
-            sprintf($tile_base, 'c' . $tile_sep, $z, $x-1, $y),
+            sprintf($tile_base, 'a-', $z, $x-1, $y-1),
+            sprintf($tile_base, 'b-', $z, $x, $y-1),
+            sprintf($tile_base, 'c-', $z, $x-1, $y),
             sprintf($tile_base, '', $z, $x, $y),
         ];
-    } else {
+    } elsif (!$ni && $z > 11) {
         my $key = FixMyStreet->config('BING_MAPS_API_KEY');
-        my $url = "g=6570";
-        $url .= "&productSet=mmOS&key=$key" if $z > 11 && !$ni;
+        my $base = "//ecn.%s.tiles.virtualearth.net/tiles/r%s?g=8702&lbl=l1&productSet=mmOS&key=$key";
         return [
-            "//ecn.t0.tiles.virtualearth.net/tiles/r" . $self->get_quadkey($x-1, $y-1, $z) . ".png?$url",
-            "//ecn.t1.tiles.virtualearth.net/tiles/r" . $self->get_quadkey($x,   $y-1, $z) . ".png?$url",
-            "//ecn.t2.tiles.virtualearth.net/tiles/r" . $self->get_quadkey($x-1, $y,   $z) . ".png?$url",
-            "//ecn.t3.tiles.virtualearth.net/tiles/r" . $self->get_quadkey($x,   $y,   $z) . ".png?$url",
+            sprintf($base, "t0", $self->get_quadkey($x-1, $y-1, $z)),
+            sprintf($base, "t1", $self->get_quadkey($x,   $y-1, $z)),
+            sprintf($base, "t2", $self->get_quadkey($x-1, $y,   $z)),
+            sprintf($base, "t3", $self->get_quadkey($x,   $y,   $z)),
         ];
+    } else {
+        return $self->SUPER::map_tiles(%params);
     }
 }
 
diff --git a/templates/web/base/maps/_sub_links.html b/templates/web/base/maps/_sub_links.html
new file mode 100644
index 000000000..d58ecf97c
--- /dev/null
+++ b/templates/web/base/maps/_sub_links.html
@@ -0,0 +1,6 @@
+[% INCLUDE maps/openlayers.html %]
+[% UNLESS around_page %]
+<p class="sub-map-links" id="sub_map_links">
+     [% map_sub_links | safe %]
+</p>
+[% END %]
diff --git a/templates/web/base/maps/bing.html b/templates/web/base/maps/bing.html
new file mode 100644
index 000000000..7d2c379c4
--- /dev/null
+++ b/templates/web/base/maps/bing.html
@@ -0,0 +1,9 @@
+[% map_sub_links = BLOCK %]
+    [% IF c.req.params.aerial %]
+        <a id="map_layer_toggle" href="[% c.uri_with( { aerial => 0 } ) %]">[% loc('Roads') %]</a>
+    [% ELSE %]
+        <a id="map_layer_toggle" href="[% c.uri_with( { aerial => 1 } ) %]">[% loc('Aerial') %]</a>
+    [% END %]
+[% END %]
+
+[% map_html = INCLUDE maps/_sub_links.html %]
diff --git a/templates/web/base/maps/fms.html b/templates/web/base/maps/fms.html
index 286ecc8ff..739c00b4e 100644
--- a/templates/web/base/maps/fms.html
+++ b/templates/web/base/maps/fms.html
@@ -1,3 +1,9 @@
-[%
-map_html = INCLUDE maps/openlayers.html include_key = 1
-%]
+[% map_sub_links = BLOCK %]
+    [% IF c.req.params.aerial %]
+        <a id="map_layer_toggle" href="[% c.uri_with( { aerial => 0 } ) %]">[% loc('Roads') %]</a>
+    [% ELSE %]
+        <a id="map_layer_toggle" href="[% c.uri_with( { aerial => 1 } ) %]">[% loc('Aerial') %]</a>
+    [% END %]
+[% END %]
+
+[% map_html = INCLUDE maps/_sub_links.html include_key = 1 %]
diff --git a/templates/web/base/maps/google-ol.html b/templates/web/base/maps/google-ol.html
index 47c940129..eb68ae804 100644
--- a/templates/web/base/maps/google-ol.html
+++ b/templates/web/base/maps/google-ol.html
@@ -2,11 +2,4 @@
 <a class="hidden-nojs" id="map_layer_toggle" href="">[% loc('Satellite') %]</a>
 [% END %]
 
-[% map_html = BLOCK %]
-[% INCLUDE maps/openlayers.html %]
-[% UNLESS around_page %]
-<p class="sub-map-links" id="sub_map_links">
-     [% map_sub_links | safe %]
-</p>
-[% END %]
-[% END %]
+[% map_html = INCLUDE maps/_sub_links.html %]
diff --git a/web/cobrands/bromley/map.js b/web/cobrands/bromley/map.js
index 0753907cc..056dee0b9 100644
--- a/web/cobrands/bromley/map.js
+++ b/web/cobrands/bromley/map.js
@@ -1 +1 @@
-fixmystreet.maps.tile_base = [ [ "", "a-" ], "https://{S}fix.bromley.gov.uk/tilma" ];
+fixmystreet.maps.tile_base = '//{S}tilma.mysociety.org/bromley';
diff --git a/web/js/map-OpenLayers.js b/web/js/map-OpenLayers.js
index d5fd36e97..3db59f218 100644
--- a/web/js/map-OpenLayers.js
+++ b/web/js/map-OpenLayers.js
@@ -958,6 +958,8 @@ $.extend(fixmystreet.utils, {
                 );
             } else if (layer_options.matrixIds) {
                 layer = new fixmystreet.map_type(layer_options);
+            } else if (fixmystreet.layer_options[i].map_type) {
+                layer = new fixmystreet.layer_options[i].map_type(fixmystreet.layer_name, layer_options);
             } else {
                 layer = new fixmystreet.map_type(fixmystreet.layer_name, layer_options);
             }
diff --git a/web/js/map-bing-ol.js b/web/js/map-bing-ol.js
index 4e01ff58b..bbaf22940 100644
--- a/web/js/map-bing-ol.js
+++ b/web/js/map-bing-ol.js
@@ -10,10 +10,23 @@ fixmystreet.maps.config = function() {
     if ( fixmystreet.page == 'report' ) {
         fixmystreet.controls.push( new OpenLayers.Control.PermalinkFMS('key-tool-problems-nearby', '/around') );
     }
-    fixmystreet.map_type = OpenLayers.Layer.Bing;
 };
 
+(function() {
+    $(function(){
+        $('#map_layer_toggle').toggle(function(){
+            $(this).text('Roads');
+            fixmystreet.map.setBaseLayer(fixmystreet.map.layers[1]);
+        }, function(){
+            $(this).text('Aerial');
+            fixmystreet.map.setBaseLayer(fixmystreet.map.layers[0]);
+        });
+    });
+
+})();
+
 OpenLayers.Layer.Bing = OpenLayers.Class(OpenLayers.Layer.XYZ, {
+    tile_base: '//t{S}.ssl.ak.dynamic.tiles.virtualearth.net/comp/ch/${id}?mkt=en-US&it=G,L&src=t&shading=hill&og=969&n=z',
     attributionTemplate: '${logo}${copyrights}',
 
     setMap: function() {
@@ -35,7 +48,8 @@ OpenLayers.Layer.Bing = OpenLayers.Class(OpenLayers.Layer.XYZ, {
     },
 
     updateAttribution: function() {
-        var copyrights = '&copy; 2011 <a href="https://www.bing.com/maps/">Microsoft</a>. &copy; AND, Navteq';
+        var year = (new Date()).getFullYear();
+        var copyrights = '&copy; ' + year + ' <a href="https://www.bing.com/maps/">Microsoft</a>, HERE';
         var logo = '<a href="https://www.bing.com/maps/"><img border=0 src="//dev.virtualearth.net/Branding/logo_powered_by.png"></a>';
         this._updateAttribution(copyrights, logo);
     },
@@ -89,13 +103,41 @@ OpenLayers.Layer.Bing = OpenLayers.Class(OpenLayers.Layer.XYZ, {
     },
 
     get_urls: function(bounds, z) {
-        return [
-            "//ecn.t0.tiles.virtualearth.net/tiles/r${id}.png?g=6570",
-            "//ecn.t1.tiles.virtualearth.net/tiles/r${id}.png?g=6570",
-            "//ecn.t2.tiles.virtualearth.net/tiles/r${id}.png?g=6570",
-            "//ecn.t3.tiles.virtualearth.net/tiles/r${id}.png?g=6570"
-        ];
+        var urls = [];
+        for (var i=0; i<4; i++) {
+            urls.push(this.tile_base.replace('{S}', i));
+        }
+        return urls;
     },
 
     CLASS_NAME: "OpenLayers.Layer.Bing"
 });
+
+OpenLayers.Layer.BingAerial = OpenLayers.Class(OpenLayers.Layer.Bing, {
+    tile_base: '//t{S}.ssl.ak.dynamic.tiles.virtualearth.net/comp/ch/${id}?mkt=en-US&it=A,G,L&src=t&og=969&n=z',
+
+    setMap: function() {
+        OpenLayers.Layer.Bing.prototype.setMap.apply(this, arguments);
+        this.map.events.register("moveend", this, this.updateAttribution);
+    },
+
+    updateAttribution: function() {
+        var z = this.map.getZoom() + this.zoomOffset;
+        var year = (new Date()).getFullYear();
+        var copyrights = '&copy; ' + year + ' <a href="https://www.bing.com/maps/">Microsoft</a>, HERE, ';
+        if (z >= 13) {
+            copyrights += 'Maxar, CNES Distribution Airbus DS';
+        } else {
+            copyrights += 'Earthstar Geographics SIO';
+        }
+        var logo = '<a href="https://www.bing.com/maps/"><img border=0 src="//dev.virtualearth.net/Branding/logo_powered_by.png"></a>';
+        this._updateAttribution(copyrights, logo);
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.BingAerial"
+});
+
+fixmystreet.layer_options = [
+  { map_type: OpenLayers.Layer.Bing },
+  { map_type: OpenLayers.Layer.BingAerial }
+];
diff --git a/web/js/map-fms.js b/web/js/map-fms.js
index 925fe1fa2..bb51467a7 100644
--- a/web/js/map-fms.js
+++ b/web/js/map-fms.js
@@ -1,11 +1,4 @@
-fixmystreet.maps.tile_base = [ [ '', 'a-', 'b-', 'c-' ], '//{S}tilma.mysociety.org/oml' ];
-
-fixmystreet.maps.config = (function(original) {
-    return function(){
-        original();
-        fixmystreet.map_type = OpenLayers.Layer.BingUK;
-    };
-})(fixmystreet.maps.config);
+fixmystreet.maps.tile_base = '//{S}tilma.mysociety.org/oml';
 
 OpenLayers.Layer.BingUK = OpenLayers.Class(OpenLayers.Layer.Bing, {
     uk_bounds: [
@@ -44,36 +37,42 @@ OpenLayers.Layer.BingUK = OpenLayers.Class(OpenLayers.Layer.Bing, {
         } else {
             logo = '<a href="https://www.bing.com/maps/"><img border=0 src="//dev.virtualearth.net/Branding/logo_powered_by.png"></a>';
             if (in_uk) {
-                copyrights = '&copy; ' + year + ' <a href="https://www.bing.com/maps/">Microsoft</a>. &copy; AND, Navteq, Highways England, Ordnance Survey';
+                copyrights = '&copy; ' + year + ' <a href="https://www.bing.com/maps/">Microsoft</a>, HERE, Highways England, Ordnance Survey';
             } else {
-                copyrights = '&copy; ' + year + ' <a href="https://www.bing.com/maps/">Microsoft</a>. &copy; AND, Navteq, Ordnance Survey';
+                copyrights = '&copy; ' + year + ' <a href="https://www.bing.com/maps/">Microsoft</a>, HERE, Ordnance Survey';
             }
         }
         this._updateAttribution(copyrights, logo);
     },
 
+    tile_prefix: [ '', 'a-', 'b-', 'c-' ],
+
     get_urls: function(bounds, z) {
-        var urls;
+        var urls = [], i;
         var in_uk = this.in_uk(bounds.getCenterLonLat());
         if (z >= 16 && in_uk) {
             urls = [];
-            for (var i=0; i< fixmystreet.maps.tile_base[0].length; i++) {
-                urls.push( fixmystreet.maps.tile_base[1].replace('{S}', fixmystreet.maps.tile_base[0][i]) + "/${z}/${x}/${y}.png" );
+            for (i=0; i< this.tile_prefix.length; i++) {
+                urls.push( fixmystreet.maps.tile_base.replace('{S}', this.tile_prefix[i]) + "/${z}/${x}/${y}.png" );
+            }
+        } else if (z > 11 && in_uk) {
+            var type = 'g=8702&lbl=l1&productSet=mmOS&key=' + fixmystreet.key;
+            var tile_base = "//ecn.t{S}.tiles.virtualearth.net/tiles/r${id}?" + type;
+            for (i=0; i<4; i++) {
+                urls.push(tile_base.replace('{S}', i));
             }
         } else {
-            var type = '';
-            if (z > 11 && in_uk) {
-                type = '&productSet=mmOS&key=' + fixmystreet.key;
+            for (i=0; i<4; i++) {
+                urls.push(this.tile_base.replace('{S}', i));
             }
-            urls = [
-                "//ecn.t0.tiles.virtualearth.net/tiles/r${id}.png?g=6570" + type,
-                "//ecn.t1.tiles.virtualearth.net/tiles/r${id}.png?g=6570" + type,
-                "//ecn.t2.tiles.virtualearth.net/tiles/r${id}.png?g=6570" + type,
-                "//ecn.t3.tiles.virtualearth.net/tiles/r${id}.png?g=6570" + type
-            ];
         }
         return urls;
     },
 
     CLASS_NAME: "OpenLayers.Layer.BingUK"
 });
+
+fixmystreet.layer_options = [
+  { map_type: OpenLayers.Layer.BingUK },
+  { map_type: OpenLayers.Layer.BingAerial }
+];
diff --git a/web/js/map-mastermap.js b/web/js/map-mastermap.js
index bb9adf532..663ccbdfb 100644
--- a/web/js/map-mastermap.js
+++ b/web/js/map-mastermap.js
@@ -23,3 +23,8 @@ OpenLayers.Layer.MasterMap = OpenLayers.Class(OpenLayers.Layer.BingUK, {
 
     CLASS_NAME: "OpenLayers.Layer.MasterMap"
 });
+
+fixmystreet.layer_options = [
+  { map_type: OpenLayers.Layer.MasterMap },
+  { map_type: OpenLayers.Layer.BingAerial }
+];