Remove separate “Public update” form section

Inspectors can now tick the optional “Save with a public update”
checkbox, to reveal the “Public update” textarea. This means there is
no longer a need for two separate submit buttons.

5 files changed, 46 insertions, 27 deletions

diff --git a/perllib/FixMyStreet/App/Controller/Report.pm b/perllib/FixMyStreet/App/Controller/Report.pm
index cca2568f2..e68b7fda0 100644
--- a/perllib/FixMyStreet/App/Controller/Report.pm
+++ b/perllib/FixMyStreet/App/Controller/Report.pm
@@ -310,7 +310,7 @@ sub inspect : Private {
 
     $c->stash->{categories} = $c->forward('/admin/categories_for_point');
 
-    if ( $c->get_param('save') || $c->get_param('save_inspected') ) {
+    if ( $c->get_param('save') ) {
         $c->forward('/auth/check_csrf_token');
 
         my $valid = 1;
diff --git a/t/app/controller/report_inspect.t b/t/app/controller/report_inspect.t
index 690a01ca1..4caeef501 100644
--- a/t/app/controller/report_inspect.t
+++ b/t/app/controller/report_inspect.t
@@ -56,7 +56,7 @@ FixMyStreet::override_config {
         $report->unset_extra_metadata('inspected');
         $report->update;
         $mech->get_ok("/report/$report_id/inspect");
-        $mech->submit_form_ok({ button => 'save_inspected', with_fields => { public_update => "This is a public update." } });
+        $mech->submit_form_ok({ button => 'save', with_fields => { public_update => "This is a public update.", save_inspected => "1" } });
         $report->discard_changes;
         is $report->comments->first->text, "This is a public update.", 'Update was created';
         is $report->get_extra_metadata('inspected'), 1, 'report marked as inspected';
@@ -67,7 +67,7 @@ FixMyStreet::override_config {
         $report->update;
         $report->comments->delete_all;
         $mech->get_ok("/report/$report_id/inspect");
-        $mech->submit_form_ok({ button => 'save_inspected', with_fields => { public_update => undef } });
+        $mech->submit_form_ok({ button => 'save', with_fields => { public_update => undef, save_inspected => "1" } });
         is_deeply $mech->page_errors, [ "Please provide a public update for this report." ], 'errors match';
         $report->discard_changes;
         is $report->comments->count, 0, "Update wasn't created";
diff --git a/templates/web/base/report/_inspect.html b/templates/web/base/report/_inspect.html
index 1296a9243..89ab77432 100644
--- a/templates/web/base/report/_inspect.html
+++ b/templates/web/base/report/_inspect.html
@@ -63,11 +63,12 @@
           </select>
         </p>
         [% END %]
+
       </div>
     [% END %]
 
+    [% IF permissions.report_edit_priority OR permissions.report_inspect %]
       <div class="inspect-section">
-        [% IF permissions.report_edit_priority OR permissions.report_inspect %]
         <p>
           <label for="problem_priority">[% loc('Priority') %]</label>
           <select name="priority" id="problem_priority" class="form-control">
@@ -77,7 +78,6 @@
             [% END %]
           </select>
         </p>
-        [% END %]
 
         [% IF permissions.report_inspect %]
         <p>
@@ -91,36 +91,26 @@
         </p>
         <p>
           <label for="detailed_information">[% loc('Extra details') %]</label>
-          <textarea rows="2" name="detailed_information" class="form-control">[% problem.get_extra_metadata('detailed_information') | html %]</textarea>
+          <textarea rows="2" name="detailed_information" id="detailed_information" class="form-control">[% problem.get_extra_metadata('detailed_information') | html %]</textarea>
         </p>
         [% END %]
 
-        <p>
-          <input type="hidden" name="token" value="[% csrf_token %]">
-          <a class="btn" href="[% c.uri_for( '/report', problem.id ) %]">[% loc('Cancel') %]</a>
-          <input class="btn" type="submit" value="[% loc('Save changes') %]" name="save" />
-        </p>
       </div>
+    [% END %]
 
-    [% IF permissions.report_inspect %]
       <div class="inspect-section">
-        [% UNLESS problem.get_extra_metadata('inspected') %]
-          [%# TODO: Integrate this textarea into the main form, for simpler UX %]
-          <p>
-            <label for="public_update">[% loc('Public update:') %]</label>
-            [% INCLUDE 'admin/response_templates_select.html' for='public_update' %]
-            <textarea rows="2" name="public_update" id="public_update" class="form-control" required>[% public_update | html %]</textarea>
-          </p>
+
+        [% IF permissions.report_inspect %]
           <p>
-            <input class="btn" type="submit" value="[% loc('Save changes + send') %]" name="save_inspected" />
+            <label class="label-containing-checkbox">
+              <input type="checkbox" name="save_inspected" value="1" class="js-toggle-public-update" [% 'checked' IF save_inspected %]>
+              [% loc('Save with a public update') %]
+            </label>
           </p>
-        [% ELSE %]
           <p>
-            [% IF problem.whensent %]
-              [% loc("<strong>Note:</strong> This report has been sent onwards for action. Any changes made won't be passed on.") %]
-            [% ELSE %]
-              [% loc("<strong>Note:</strong> This report hasn't yet been sent onwards for action. Any changes made may not be passed on.") %]
-            [% END %]
+            <label for="public_update">[% loc('Public update:') %]</label>
+            [% INCLUDE 'admin/response_templates_select.html' for='public_update' %]
+            <textarea rows="2" name="public_update" id="public_update" class="form-control">[% public_update | html %]</textarea>
           </p>
         [% END %]
 
@@ -138,7 +128,6 @@
           <input class="btn btn-primary" type="submit" value="[% loc('Save changes') %]" name="save" />
         </p>
       </div>
-    [% END %]
 
     </form>
   </div>
diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js
index 8d45e4017..2443b333d 100644
--- a/web/cobrands/fixmystreet/fixmystreet.js
+++ b/web/cobrands/fixmystreet/fixmystreet.js
@@ -426,6 +426,25 @@ $.extend(fixmystreet.set_up, {
     $('.js-contribute-as').change();
   },
 
+  inspect_with_public_update: function() {
+    $('.js-toggle-public-update').each(function() {
+        var $checkbox = $(this);
+        var toggle_public_update = function() {
+            if ($checkbox.prop('checked')) {
+                $('#public_update').parents('p').show();
+            } else {
+                $('#public_update').parents('p').hide();
+            }
+        };
+
+        $checkbox.on('change', function() {
+            toggle_public_update();
+        });
+
+        toggle_public_update();
+    });
+  },
+
   on_resize: function() {
     var last_type;
     $(window).on('resize', function() {
diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss
index 98f578fa2..08384f7c2 100644
--- a/web/cobrands/sass/_base.scss
+++ b/web/cobrands/sass/_base.scss
@@ -398,6 +398,17 @@ select.form-control {
   margin:1em 0;
 }
 
+.label-containing-checkbox {
+  padding-#{$left}: 24px;
+  position: relative;
+
+  input {
+    position: absolute;
+    #{$left}: 0;
+    top: 0.2em;
+  }
+}
+
 
 // form errors
 div.form-error,