Merge branch 'js-you-only-load-once'

9 files changed, 63 insertions, 98 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 291799e46..50d2ca9e0 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -14,6 +14,7 @@
         - Extra fields on contacts can be edited. #1743
     - Bugfixes:
         - Set up action scheduled field when report loaded. #1789
+        - Fix sidebar hover behaviour being lost. #1808
         - Stop errors from JS validator due to form in form.
         - Stop update form toggle causing report submission.
         - Update map size if an extra column has appeared.
diff --git a/perllib/FixMyStreet/App/Controller/Around.pm b/perllib/FixMyStreet/App/Controller/Around.pm
index a8782eba2..b872084ff 100644
--- a/perllib/FixMyStreet/App/Controller/Around.pm
+++ b/perllib/FixMyStreet/App/Controller/Around.pm
@@ -163,52 +163,20 @@ sub display_location : Private {
 
     $c->forward('/auth/get_csrf_token');
 
-    # get the lat,lng
-    my $latitude  = $c->stash->{latitude};
-    my $longitude = $c->stash->{longitude};
-
-    # Deal with pin hiding/age
-    my $all_pins = $c->get_param('all_pins') ? 1 : undef;
-    $c->stash->{all_pins} = $all_pins;
-    my $interval = $all_pins ? undef : $c->cobrand->on_map_default_max_pin_age;
-
-    $c->forward( '/reports/stash_report_filter_status' );
-
     # Check the category to filter by, if any, is valid
     $c->forward('check_and_stash_category');
-    $c->forward( '/reports/stash_report_sort', [ 'created-desc' ]);
 
-    # get the map features
-    my ( $on_map_all, $on_map, $nearby, $distance ) =
-      FixMyStreet::Map::map_features( $c,
-        latitude => $latitude, longitude => $longitude,
-        interval => $interval, categories => [ keys %{$c->stash->{filter_category}} ],
-        states => $c->stash->{filter_problem_states},
-        order => $c->stash->{sort_order},
-      );
+    my $latitude  = $c->stash->{latitude};
+    my $longitude = $c->stash->{longitude};
 
-    # copy the found reports to the stash
-    $c->stash->{on_map}     = $on_map;
-    $c->stash->{around_map} = $nearby;
-    $c->stash->{distance}   = $distance;
+    $c->forward('map_features', [ { latitude => $latitude, longitude => $longitude } ] );
 
-    # create a list of all the pins
-    my @pins;
-    unless ($c->get_param('no_pins')) {
-        @pins = map {
-            # Here we might have a DB::Problem or a DB::Result::Nearby, we always want the problem.
-            my $p = (ref $_ eq 'FixMyStreet::DB::Result::Nearby') ? $_->problem : $_;
-            $p->pin_data($c, 'around');
-        } @$on_map_all, @$nearby;
-    }
-
-    $c->stash->{page} = 'around'; # So the map knows to make clickable pins, update on pan
     FixMyStreet::Map::display_map(
         $c,
         latitude  => $latitude,
         longitude => $longitude,
         clickable => 1,
-        pins      => \@pins,
+        pins      => $c->stash->{pins},
         area      => $c->cobrand->areas_on_around,
     );
 
@@ -268,6 +236,44 @@ sub check_and_stash_category : Private {
     $c->stash->{filter_category} = \%valid_categories;
 }
 
+sub map_features : Private {
+    my ($self, $c, $extra) = @_;
+
+    $c->stash->{page} = 'around'; # Needed by _item.html / so the map knows to make clickable pins, update on pan
+
+    $c->forward( '/reports/stash_report_filter_status' );
+    $c->forward( '/reports/stash_report_sort', [ 'created-desc' ]);
+
+    # Deal with pin hiding/age
+    my $all_pins = $c->get_param('all_pins') ? 1 : undef;
+    $c->stash->{all_pins} = $all_pins;
+    my $interval = $all_pins ? undef : $c->cobrand->on_map_default_max_pin_age;
+
+    return if $c->get_param('js'); # JS will request the same (or more) data client side
+
+    my ( $on_map_all, $on_map_list, $nearby, $distance ) =
+      FixMyStreet::Map::map_features(
+        $c, interval => $interval, %$extra,
+        categories => [ keys %{$c->stash->{filter_category}} ],
+        states => $c->stash->{filter_problem_states},
+        order => $c->stash->{sort_order},
+      );
+
+    my @pins;
+    unless ($c->get_param('no_pins')) {
+        @pins = map {
+            # Here we might have a DB::Problem or a DB::Result::Nearby, we always want the problem.
+            my $p = (ref $_ eq 'FixMyStreet::DB::Result::Nearby') ? $_->problem : $_;
+            $p->pin_data($c, 'around');
+        } @$on_map_all, @$nearby;
+    }
+
+    $c->stash->{pins} = \@pins;
+    $c->stash->{on_map} = $on_map_list;
+    $c->stash->{around_map} = $nearby;
+    $c->stash->{distance} = $distance;
+}
+
 =head2 /ajax
 
 Handle the ajax calls that the map makes when it is dragged. The info returned
@@ -279,8 +285,6 @@ the map.
 sub ajax : Path('/ajax') {
     my ( $self, $c ) = @_;
 
-    $c->res->content_type('application/json; charset=utf-8');
-
     my $bbox = $c->get_param('bbox');
     unless ($bbox) {
         $c->res->status(404);
@@ -288,53 +292,13 @@ sub ajax : Path('/ajax') {
         return;
     }
 
-    # assume this is not cacheable - may need to be more fine-grained later
-    $c->res->header( 'Cache_Control' => 'max-age=0' );
-
-    $c->stash->{page} = 'around'; # Needed by _item.html
-
-    # how far back should we go?
-    my $all_pins = $c->get_param('all_pins') ? 1 : undef;
-    my $interval = $all_pins ? undef : $c->cobrand->on_map_default_max_pin_age;
-
-    $c->forward( '/reports/stash_report_filter_status' );
-    $c->forward( '/reports/stash_report_sort', [ 'created-desc' ]);
-
-    # extract the data from the map
-    my ( $on_map_all, $on_map_list, $nearby, $dist ) =
-      FixMyStreet::Map::map_features($c,
-          bbox => $bbox, interval => $interval,
-          categories => [ $c->get_param_list('filter_category', 1) ],
-          states => $c->stash->{filter_problem_states},
-          order => $c->stash->{sort_order},
-      );
-
-    # create a list of all the pins
-    my @pins = map {
-        # Here we might have a DB::Problem or a DB::Result::Nearby, we always want the problem.
-        my $p = (ref $_ eq 'FixMyStreet::DB::Result::Nearby') ? $_->problem : $_;
-        my $colour = $c->cobrand->pin_colour( $p, 'around' );
-        my $title = $c->cobrand->call_hook(pin_hover_title => $p, $p->title_safe) || $p->title_safe;
-        [ $p->latitude, $p->longitude,
-          $colour,
-          $p->id, $title
-        ]
-    } @$on_map_all, @$nearby;
-
-    # render templates to get the html
-    my $on_map_list_html = $c->render_fragment(
-        'around/on_map_list_items.html',
-        { on_map => $on_map_list, around_map => $nearby }
-    );
+    my %valid_categories = map { $_ => 1 } $c->get_param_list('filter_category', 1);
+    $c->stash->{filter_category} = \%valid_categories;
 
-    # JSON encode the response
-    my $json = { pins => \@pins };
-    $json->{current} = $on_map_list_html if $on_map_list_html;
-    my $body = encode_json($json);
-    $c->res->body($body);
+    $c->forward('map_features', [ { bbox => $bbox } ]);
+    $c->forward('/reports/ajax', [ 'around/on_map_list_items.html' ]);
 }
 
-
 sub location_autocomplete : Path('/ajax/geocode') {
     my ( $self, $c ) = @_;
     $c->res->content_type('application/json; charset=utf-8');
diff --git a/perllib/FixMyStreet/App/Controller/Report.pm b/perllib/FixMyStreet/App/Controller/Report.pm
index 7bde226ef..48cf53eb3 100644
--- a/perllib/FixMyStreet/App/Controller/Report.pm
+++ b/perllib/FixMyStreet/App/Controller/Report.pm
@@ -505,7 +505,7 @@ sub nearby_json : Private {
     );
 
     my $json = { pins => \@pins };
-    $json->{current} = $on_map_list_html if $on_map_list_html;
+    $json->{reports_list} = $on_map_list_html if $on_map_list_html;
     my $body = encode_json($json);
     $c->res->content_type('application/json; charset=utf-8');
     $c->res->body($body);
diff --git a/templates/web/base/around/tabbed_lists.html b/templates/web/base/around/tabbed_lists.html
index b0d46444d..5418ef914 100755
--- a/templates/web/base/around/tabbed_lists.html
+++ b/templates/web/base/around/tabbed_lists.html
@@ -1,5 +1,5 @@
 [% INCLUDE "reports/_list-filters.html" %]
 
-<ul id="current" class="item-list item-list--reports">
+<ul id="js-reports-list" class="item-list item-list--reports">
     [% INCLUDE "around/on_map_list_items.html" %]
 </ul>
diff --git a/templates/web/base/front/recent.html b/templates/web/base/front/recent.html
index cb83c51b8..1fe6ad2be 100644
--- a/templates/web/base/front/recent.html
+++ b/templates/web/base/front/recent.html
@@ -13,7 +13,7 @@
     </h2>
 
     <section class="full-width">
-        <ul class="item-list item-list--reports item-list--front-page">
+        <ul id="js-reports-list" class="item-list item-list--reports item-list--front-page">
           [% FOREACH problem IN recent_photos %]
             [% INCLUDE 'front/_list-entry.html' %]
           [% END %]
diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js
index 291455aa7..49f14f0de 100644
--- a/web/cobrands/fixmystreet/fixmystreet.js
+++ b/web/cobrands/fixmystreet/fixmystreet.js
@@ -256,6 +256,13 @@ $.extend(fixmystreet.set_up, {
         document.createElement('img').src = '/i/pin-green.png';
     }
 
+    $('a[href*="around"]').each(function() {
+        this.href = this.href + (this.href.indexOf('?') > -1 ? '&js=1' : '?js=1');
+    });
+    $('form[action*="around"]').each(function() {
+        $('<input type="hidden" name="js" value="1">').prependTo(this);
+    });
+
     // Focus on postcode box on front page
     $('#pc').focus();
 
diff --git a/web/cobrands/fixmystreet/staff.js b/web/cobrands/fixmystreet/staff.js
index 95fbad81a..07a2729e2 100644
--- a/web/cobrands/fixmystreet/staff.js
+++ b/web/cobrands/fixmystreet/staff.js
@@ -13,7 +13,7 @@ $.extend(fixmystreet.set_up, {
           var nearby_url = '/report/'+report_id+'/nearby.json';
           $.getJSON(nearby_url, args, function(data) {
               var duplicate_of = $("#report_inspect_form [name=duplicate_of]").val();
-              var $reports = $(data.current)
+              var $reports = $(data.reports_list)
                               .filter("li")
                               .not("[data-report-id="+report_id+"]")
                               .slice(0, 5);
@@ -93,7 +93,7 @@ $.extend(fixmystreet.set_up, {
   },
 
   list_item_actions: function() {
-    $('.item-list--reports').on('click', ':submit', function(e) {
+    $('#js-reports-list').on('click', ':submit', function(e) {
       e.preventDefault();
 
       var $submitButton = $(this);
diff --git a/web/js/map-OpenLayers.js b/web/js/map-OpenLayers.js
index e7702e764..6a0d938fc 100644
--- a/web/js/map-OpenLayers.js
+++ b/web/js/map-OpenLayers.js
@@ -674,7 +674,7 @@ var fixmystreet = fixmystreet || {};
 
         (function() {
             var timeout;
-            $('.item-list--reports').on('mouseenter', '.item-list--reports__item', function(){
+            $('#js-reports-list').on('mouseenter', '.item-list--reports__item', function(){
                 var href = $('a', this).attr('href');
                 var id = parseInt(href.replace(/^.*[\/]([0-9]+)$/, '$1'),10);
                 clearTimeout(timeout);
@@ -861,10 +861,6 @@ OpenLayers.Format.FixMyStreet = OpenLayers.Class(OpenLayers.Format.JSON, {
         } else {
             obj = json;
         }
-        var current;
-        if (typeof(obj.current) != 'undefined' && (current = document.getElementById('current'))) {
-            current.innerHTML = obj.current;
-        }
         var reports_list;
         if (typeof(obj.reports_list) != 'undefined' && (reports_list = document.getElementById('js-reports-list'))) {
             reports_list.innerHTML = obj.reports_list;
diff --git a/web/js/map-google.js b/web/js/map-google.js
index 8819697eb..596e4f8ee 100644
--- a/web/js/map-google.js
+++ b/web/js/map-google.js
@@ -114,12 +114,9 @@ fixmystreet.maps = {};
 
     /* Pan data handler */
     function read_pin_json(obj) {
-        var current, current_near;
-        if (typeof(obj.current) != 'undefined' && (current = document.getElementById('current'))) {
-            current.innerHTML = obj.current;
-        }
-        if (typeof(obj.current_near) != 'undefined' && (current_near = document.getElementById('current_near'))) {
-            current_near.innerHTML = obj.current_near;
+        var reports_list;
+        if (typeof(obj.reports_list) != 'undefined' && (reports_list = document.getElementById('js-reports-list'))) {
+            reports_list.innerHTML = obj.reports_list;
         }
         fixmystreet.markers = markers_list( obj.pins, false );
     }