diff options
| -rw-r--r-- | perllib/FixMyStreet/App/Controller/Report.pm | 11 | ||||
| -rw-r--r-- | templates/web/base/report/_main.html | 115 | ||||
| -rw-r--r-- | templates/web/oxfordshire/report/_main.html | 123 | ||||
| -rw-r--r-- | web/cobrands/sass/_base.scss | 12 | ||||
| -rw-r--r-- | web/js/moderate.js | 13 |
5 files changed, 156 insertions, 118 deletions
diff --git a/perllib/FixMyStreet/App/Controller/Report.pm b/perllib/FixMyStreet/App/Controller/Report.pm index 475a29fb5..b3e546c2c 100644 --- a/perllib/FixMyStreet/App/Controller/Report.pm +++ b/perllib/FixMyStreet/App/Controller/Report.pm @@ -130,6 +130,17 @@ sub load_problem_or_display_error : Private { } $c->stash->{problem} = $problem; + if ( $c->user_exists && $c->user->has_permission_to(moderate => $problem->bodies_str) ) { + $c->stash->{problem_original} = $problem->find_or_new_related( + moderation_original_data => { + title => $problem->title, + detail => $problem->detail, + photo => $problem->photo, + anonymous => $problem->anonymous, + } + ); + } + return 1; } diff --git a/templates/web/base/report/_main.html b/templates/web/base/report/_main.html index 7260e619a..efff314f8 100644 --- a/templates/web/base/report/_main.html +++ b/templates/web/base/report/_main.html @@ -1,61 +1,40 @@ [% moderating = c.user && c.user.has_permission_to('moderate', problem.bodies_str) %] -[% IF moderating %] -[%# TODO: extract stylesheet! %] -<style> - .moderate-edit label { - display: inline-block; - height: 1em; - margin-top: 0; - } - - .moderate-edit input { - display: inline-block; - } - - .moderate-edit { display: none } - .moderate-edit :disabled { - background: #ddd; - } - br { - line-height: 0.5em; - } -</style> -[% END %] - <div class="problem-header cf" problem-id="[% problem.id %]"> + [% IF moderating %] - [% original = problem.moderation_original_data %] + [% original = problem_original %] <form method="post" action="/moderate/report/[% problem.id %]"> - <input type="button" class="btn moderate moderate-display" value="moderate"> - <div class="moderate-edit"> - <input type="checkbox" class="hide-document" name="problem_hide"> - <label for="problem_hide">Hide report completely?</label> - <br /> - <input type="checkbox" name="problem_show_name" [% problem.anonymous ? '' : 'checked' %]> - <label for="problem_show_name">Show name publicly?</label> - [% IF problem.photo or original.photo %] - <br /> - <input type="checkbox" name="problem_show_photo" [% problem.photo ? 'checked' : '' %]> - <label for="problem_show_photo">Show Photo?</label> - [% END %] - </div> + <p class="moderate-display"> + <input type="button" class="btn moderate" value="moderate"> + </p> [% END %] + <h1 class="moderate-display">[% problem.title | html %]</h1> - [% IF moderating %] + + [% IF moderating %] <div class="moderate-edit"> - [% IF problem.title != original.title %] - <input type="checkbox" name="problem_revert_title" class="revert-title"> - <label for="problem_revert_title">Revert to original title</label> - [% END %] - <h1><input type="text" name="problem_title" value="[% problem.title | html %]"></h1> + [% IF problem.title != original.title %] + <label> + <input type="checkbox" name="problem_revert_title" class="revert-title"> + Revert to original title + </label> + [% END %] + <h1><input type="text" name="problem_title" value="[% problem.title | html %]" data-original-value="[% original.title | html %]"></h1> </div> - [% END %] + [% END %] + <div class="moderate-edit"> + <label> + <input type="checkbox" name="problem_show_name" [% problem.anonymous ? 'checked' : '' %]> + Hide reporter’s name + </label> + </div> <p class="report_meta_info"> [% problem.meta_line(c) | html %] [%- IF !problem.used_map %]; <strong>([% loc('there is no pin shown as the user did not use the map') %])</strong>[% END %] </p> + [% IF problem.bodies_str %] [% INCLUDE 'report/_council_sent_info.html' %] [% ELSE %] @@ -67,26 +46,50 @@ [% INCLUDE 'report/_support.html' %] + [% IF moderating %] + [% IF problem.photo or original.photo %] + <p class="moderate-edit"> + <label> + <input type="checkbox" name="problem_show_photo" [% problem.photo ? 'checked' : '' %]> + Show photo + </label> + </p> + [% END %] + [% END %] + [% INCLUDE 'report/photo.html' object=problem %] <div class="moderate-display"> [% add_links( problem.detail ) | html_para %] </div> - [% IF moderating %] - <div class="moderate-edit"> - [% IF problem.detail != original.detail %] - <input type="checkbox" name="problem_revert_detail" class="revert-textarea"> - <label for="problem_revert_detail">Revert to original text</label> - [% END %] - <textarea name="problem_detail">[% add_links( problem.detail ) %]</textarea> - </div> + [% IF moderating %] + <p class="moderate-edit"> + [% IF problem.detail != original.detail %] + <label> + <input type="checkbox" name="problem_revert_detail" class="revert-textarea"> + Revert to original text + </label> + [% END %] + <textarea name="problem_detail" data-original-value="[% original.detail | html %]">[% problem.detail | html %]</textarea> + </p> - <div class="moderate-edit"> + <div class="moderate-edit"> + <p> + <label> + <input type="checkbox" class="hide-document" name="problem_hide" [% problem.hidden ? 'checked' : '' %]> + Hide entire report + </label> + </p> + <p> <label for="moderation_reason">Moderation reason:</label> <input type="text" name="moderation_reason" placeholder="Describe why you are moderating this"> - <input type="submit" class="red-btn" value="Moderate it"> - <input type="button" class="btn cancel" value="cancel"> - </div> + </p> + <p> + <input type="submit" class="green-btn" value="Save changes"> + <input type="button" class="btn cancel" value="Discard changes"> + </p> + </div> + </form> [% END %] </div> diff --git a/templates/web/oxfordshire/report/_main.html b/templates/web/oxfordshire/report/_main.html index a4cb3e20b..2ff193075 100644 --- a/templates/web/oxfordshire/report/_main.html +++ b/templates/web/oxfordshire/report/_main.html @@ -1,61 +1,40 @@ [% moderating = c.user && c.user.has_permission_to('moderate', problem.bodies_str) %] -[% IF moderating %] -[%# TODO: extract stylesheet! %] -<style> - .moderate-edit label { - display: inline-block; - height: 1em; - margin-top: 0; - } - - .moderate-edit input { - display: inline-block; - } - - .moderate-edit { display: none } - .moderate-edit :disabled { - background: #ddd; - } - br { - line-height: 0.5em; - } -</style> -[% END %] - <div class="problem-header cf" problem-id="[% problem.id %]"> + [% IF moderating %] - [% original = problem.moderation_original_data %] + [% original = problem_original %] <form method="post" action="/moderate/report/[% problem.id %]"> - <input type="button" class="btn moderate moderate-display" value="moderate"> - <div class="moderate-edit"> - <input type="checkbox" class="hide-document" name="problem_hide"> - <label for="problem_hide">Hide report completely?</label> - <br /> - <input type="checkbox" name="problem_show_name" [% problem.anonymous ? '' : 'checked' %]> - <label for="problem_show_name">Show name publicly?</label> - [% IF problem.photo or original.photo %] - <br /> - <input type="checkbox" name="problem_show_photo" [% problem.photo ? 'checked' : '' %]> - <label for="problem_show_photo">Show Photo?</label> - [% END %] - </div> + <p class="moderate-display"> + <input type="button" class="btn moderate" value="moderate"> + </p> [% END %] + <h1 class="moderate-display">[% problem.title | html %]</h1> - [% IF moderating %] + + [% IF moderating %] <div class="moderate-edit"> - [% IF problem.title != original.title %] - <input type="checkbox" name="problem_revert_title" class="revert-title"> - <label for="problem_revert_title">Revert to original title</label> - [% END %] - <h1><input type="text" name="problem_title" value="[% problem.title | html %]"></h1> + [% IF problem.title != original.title %] + <label> + <input type="checkbox" name="problem_revert_title" class="revert-title"> + Revert to original title + </label> + [% END %] + <h1><input type="text" name="problem_title" value="[% problem.title | html %]" data-original-value="[% original.title | html %]"></h1> </div> - [% END %] + [% END %] + <div class="moderate-edit"> + <label> + <input type="checkbox" name="problem_show_name" [% problem.anonymous ? 'checked' : '' %]> + Hide reporter’s name + </label> + </div> <p class="report_meta_info"> [% problem.meta_line(c) | html %] [%- IF !problem.used_map %]; <strong>([% loc('there is no pin shown as the user did not use the map') %])</strong>[% END %] </p> + [% IF problem.whensent %] <p class="council_sent_info">[% problem.duration_string(c) %]</p> [% END %] @@ -65,34 +44,58 @@ [% INCLUDE 'report/_support.html' %] + [% IF moderating %] + [% IF problem.photo or original.photo %] + <p class="moderate-edit"> + <label> + <input type="checkbox" name="problem_show_photo" [% problem.photo ? 'checked' : '' %]> + Show photo + </label> + </p> + [% END %] + [% END %] + [% INCLUDE 'report/photo.html' object=problem %] <div class="moderate-display"> [% add_links( problem.detail ) | html_para %] </div> - [% IF moderating %] - <div class="moderate-edit"> - [% IF problem.detail != original.detail %] - <input type="checkbox" name="problem_revert_detail" class="revert-textarea"> - <label for="problem_revert_detail">Revert to original text</label> - [% END %] - <textarea name="problem_detail">[% add_links( problem.detail ) %]</textarea> - </div> + [% IF moderating %] + <p class="moderate-edit"> + [% IF problem.detail != original.detail %] + <label> + <input type="checkbox" name="problem_revert_detail" class="revert-textarea"> + Revert to original text + </label> + [% END %] + <textarea name="problem_detail" data-original-value="[% original.detail | html %]">[% problem.detail | html %]</textarea> + </p> - <div class="moderate-edit"> + <div class="moderate-edit"> + <p> + <label> + <input type="checkbox" class="hide-document" name="problem_hide" [% problem.hidden ? 'checked' : '' %]> + Hide entire report + </label> + </p> + <p> <label for="moderation_reason">Moderation reason:</label> <input type="text" name="moderation_reason" placeholder="Describe why you are moderating this"> - <input type="submit" class="red-btn" value="Moderate it"> - <input type="button" class="btn cancel" value="cancel"> - </div> + </p> + <p> + <input type="submit" class="green-btn" value="Save changes"> + <input type="button" class="btn cancel" value="Discard changes"> + </p> + </div> + </form> [% END %] [% IF problem.bodies_str %] - [% INCLUDE 'report/_council_sent_info.html' %] + [% INCLUDE 'report/_council_sent_info.html' %] [% ELSE %] - <div class="council_info_box"> - <p>[% loc('Not reported to council') %]</p> - </div> + <div class="council_info_box"> + <p>[% loc('Not reported to council') %]</p> + </div> [% END %] </div> diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss index 6af6d88ff..a8f6e7a96 100644 --- a/web/cobrands/sass/_base.scss +++ b/web/cobrands/sass/_base.scss @@ -1048,6 +1048,18 @@ input.final-submit { } } +.moderate-edit { + display: none; // gets shown by javascript + + :disabled { + background: #ddd; + } + + h1 input { + border-width: (0.125em/2); // compensate for 2em font-size on h1s + } +} + // map stuff #map_box{ @extend .full-width; diff --git a/web/js/moderate.js b/web/js/moderate.js index 0be3cca8d..53277d9d9 100644 --- a/web/js/moderate.js +++ b/web/js/moderate.js @@ -1,3 +1,11 @@ +function toggle_original ($input, revert) { + $input.prop('disabled', revert); + if (revert) { + $input.data('currentValue', $input.val()); + } + $input.val($input.data(revert ? 'originalValue' : 'currentValue')); +} + function setup_moderation (elem, word) { elem.each( function () { @@ -8,10 +16,11 @@ function setup_moderation (elem, word) { }); $elem.find('.revert-title').change( function () { - $elem.find('input[name=problem_title]').prop('disabled', $(this).prop('checked')); + toggle_original($elem.find('input[name=problem_title]'), $(this).prop('checked')); }); + $elem.find('.revert-textarea').change( function () { - $elem.find('textarea').prop('disabled', $(this).prop('checked')); + toggle_original($elem.find('textarea'), $(this).prop('checked')); }); var hide_document = $elem.find('.hide-document'); |