Clicking "Report" header links on homepage focusses #pc input

Works for both the "Report" button shown in the mobile header,
and the "Report a problem" span on the desktop site.

Thanks to Louise for suggesting this in mysociety/collideoscope#42!

2 files changed, 15 insertions, 1 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 390443c8a..109bf1495 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,8 @@
 * Unreleased
     - Front end improvements:
         - Import end point can optionally return a web page #2225
+        - Clicking the "Report" header links on the homepage now focusses
+          the #pc search input #2237
     - Bugfixes:
         - Fix display of area/pins on body page when using Bing or TonerLite map.
         - Do not scan through all problems to show /_dev pages.
diff --git a/web/js/front.js b/web/js/front.js
index db0228597..1efa516fd 100644
--- a/web/js/front.js
+++ b/web/js/front.js
@@ -10,6 +10,7 @@ document.getElementById('pc').focus();
         el.value = 1;
         form.insertBefore(el, form.firstChild);
     }
+
     var around_links = document.querySelectorAll('a[href*="around"]');
     for (i=0; i<around_links.length; i++) {
         var link = around_links[i];
@@ -18,8 +19,19 @@ document.getElementById('pc').focus();
 
     var lk = document.querySelector('span.report-a-problem-btn');
     if (lk && lk.addEventListener) {
-        lk.addEventListener('click', function(){
+        lk.addEventListener('click', function(e){
+            e.preventDefault();
+            scrollTo(0,0);
+            document.getElementById('pc').focus();
+        });
+    }
+
+    var cta = document.getElementById('report-cta');
+    if (cta && cta.addEventListener) {
+        cta.addEventListener('click', function(e) {
+            e.preventDefault();
             scrollTo(0,0);
+            document.getElementById('pc').focus();
         });
     }
 })();