diff options
26 files changed, 706 insertions, 260 deletions
diff --git a/perllib/FixMyStreet/Cobrand/Default.pm b/perllib/FixMyStreet/Cobrand/Default.pm index 9f44ca758..c3185ea05 100644 --- a/perllib/FixMyStreet/Cobrand/Default.pm +++ b/perllib/FixMyStreet/Cobrand/Default.pm @@ -922,4 +922,3 @@ sub jurisdiction_id_example { } 1; - diff --git a/perllib/FixMyStreet/Cobrand/Oxfordshire.pm b/perllib/FixMyStreet/Cobrand/Oxfordshire.pm index 44b3a0fa9..b9d48a95c 100644 --- a/perllib/FixMyStreet/Cobrand/Oxfordshire.pm +++ b/perllib/FixMyStreet/Cobrand/Oxfordshire.pm @@ -47,5 +47,60 @@ sub users_can_hide { return 1; } sub default_show_name { 0 } -1; +=head2 problem_response_days + +Returns the number of working days that are expected to elapse +between the problem being reported and it being responded to by +the council/body. + +=cut + +sub problem_response_days { + my $self = shift; + my $p = shift; + + return 10 if $p->category eq 'Bridges'; + return 10 if $p->category eq 'Carriageway Defect'; # phone if urgent + return 10 if $p->category eq 'Debris/Spillage'; + return 10 if $p->category eq 'Drainage'; + return 10 if $p->category eq 'Fences'; + return 10 if $p->category eq 'Flyposting'; + return 10 if $p->category eq 'Footpaths/ Rights of way (usually not tarmac)'; + return 10 if $p->category eq 'Gully and Catchpits'; + return 10 if $p->category eq 'Ice/Snow'; # phone if urgent + return 10 if $p->category eq 'Manhole'; + return 10 if $p->category eq 'Mud and Debris'; # phone if urgent + return 10 if $p->category eq 'Oil Spillage'; # phone if urgent + return 10 if $p->category eq 'Pavements'; + return 10 if $p->category eq 'Pothole'; # phone if urgent + return 10 if $p->category eq 'Property Damage'; + return 10 if $p->category eq 'Public rights of way'; + return 10 if $p->category eq 'Road Marking'; + return 10 if $p->category eq 'Road traffic signs'; + return 10 if $p->category eq 'Roads/highways'; + return 10 if $p->category eq 'Skips and scaffolding'; + return 10 if $p->category eq 'Street lighting'; + return 10 if $p->category eq 'Traffic lights'; # phone if urgent + return 10 if $p->category eq 'Traffic'; + return 10 if $p->category eq 'Trees'; + return 10 if $p->category eq 'Utilities'; + return 10 if $p->category eq 'Vegetation'; + + return undef; +} +sub reports_ordering { + return { -desc => 'confirmed' }; +} + +sub pin_colour { + my ( $self, $p, $context ) = @_; + return 'grey' if $p->state eq 'not responsible'; + return 'green' if $p->is_fixed || $p->is_closed; + return 'red' if $p->state eq 'confirmed'; + return 'yellow'; +} + +sub on_map_default_status { return 'open'; } + +1; diff --git a/t/cobrand/oxfordshire.t b/t/cobrand/oxfordshire.t new file mode 100644 index 000000000..d9f880d07 --- /dev/null +++ b/t/cobrand/oxfordshire.t @@ -0,0 +1,50 @@ +use strict; +use warnings; +use Test::More; + +use FixMyStreet::TestMech; +my $mech = FixMyStreet::TestMech->new; + +subtest 'check /ajax defaults to open reports only' => sub { + my $categories = [ 'Bridges', 'Fences', 'Manhole' ]; + my $params = { + postcode => 'OX28 4DS', + latitude => 51.7847208192, + longitude => -1.49445264029, + }; + my $bbox = ($params->{longitude} - 0.01) . ',' . ($params->{latitude} - 0.01) + . ',' . ($params->{longitude} + 0.01) . ',' . ($params->{latitude} + 0.01); + + # Create one open and one fixed report in each category + foreach my $category ( @$categories ) { + foreach my $state ( 'confirmed', 'fixed' ) { + my %report_params = ( + %$params, + category => $category, + state => $state, + ); + $mech->create_problems_for_body( 1, 2237, 'Around page', \%report_params ); + } + } + + FixMyStreet::override_config { + ALLOWED_COBRANDS => [ { 'oxfordshire' => '.' } ], + MAPIT_URL => 'http://mapit.mysociety.org/', + }, sub { + my $json = $mech->get_ok_json( '/ajax?status=all&bbox=' . $bbox ); + my $pins = $json->{pins}; + is scalar @$pins, 6, 'correct number of reports created'; + + $json = $mech->get_ok_json( '/ajax?bbox=' . $bbox ); + $pins = $json->{pins}; + is scalar @$pins, 3, 'correct number of reports returned with no filters'; + + $json = $mech->get_ok_json( '/ajax?filter_category=Fences&bbox=' . $bbox ); + $pins = $json->{pins}; + is scalar @$pins, 1, 'only one Fences report by default'; + } +}; + +# Clean up +$mech->delete_problems_for_body( 2237 ); +done_testing(); diff --git a/templates/web/fixmystreet/my/my.html b/templates/web/fixmystreet/my/my.html index 9c857aab9..16779e503 100644 --- a/templates/web/fixmystreet/my/my.html +++ b/templates/web/fixmystreet/my/my.html @@ -58,9 +58,3 @@ </div> [% INCLUDE 'footer.html' %] - -[% BLOCK problem %] - [% "<ul class='issue-list-a full-width'>" IF loop.first %] - [% INCLUDE 'report/_item.html', problem = p, no_fixed =1 %] - [% "</ul>" IF loop.last %] -[% END %] diff --git a/templates/web/oxfordshire/around/_report_banner.html b/templates/web/oxfordshire/around/_report_banner.html new file mode 100644 index 000000000..52a869262 --- /dev/null +++ b/templates/web/oxfordshire/around/_report_banner.html @@ -0,0 +1,10 @@ +<h1 class="big-green-banner"> + [% loc( 'Click map to report a problem' ) %] +</h1> +<div class="click-the-map"> + <h2>[% loc( 'Have you found a problem here?' ) %]</h2> + <p>Click on the map to report it</p> +</div> +<a id="skip-this-step" href="[% url_skip %]" rel="nofollow"> + [% loc("Can't see the map? <em>Skip this step</em>") %] +</a> diff --git a/templates/web/oxfordshire/around/around_map_list_items.html b/templates/web/oxfordshire/around/around_map_list_items.html new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/templates/web/oxfordshire/around/around_map_list_items.html diff --git a/templates/web/oxfordshire/around/extra_text.html b/templates/web/oxfordshire/around/extra_text.html index 439bf00a2..107d3324f 100644 --- a/templates/web/oxfordshire/around/extra_text.html +++ b/templates/web/oxfordshire/around/extra_text.html @@ -1,5 +1,3 @@ <div class="extra-text"> <p>Please do not use this form for reporting <a href="/faq#pothole" target="_blank">emergencies and urgent problems</a>.</p> - - <p><img src="/i/pin-yellow.png" class="extra-text__image" width="48" height="64" /> - <b>these are problems that have already been reported</b>.<br>Click them to see more details.</p> </div> diff --git a/templates/web/oxfordshire/around/on_map_list_items.html b/templates/web/oxfordshire/around/on_map_list_items.html new file mode 100644 index 000000000..893f5c698 --- /dev/null +++ b/templates/web/oxfordshire/around/on_map_list_items.html @@ -0,0 +1,11 @@ +[% all_reports = on_map.merge(around_map) %] +[% IF all_reports.size %] + [% FOREACH problem IN all_reports %] + [% UNLESS problem.title; problem = problem.problem; END %] + [% INCLUDE "reports/_list-entry.html" %] + [% END %] +[% ELSE %] + <li class="empty"> + <p>[% loc('There are no reports to show.') %]</p> + </li> +[% END %] diff --git a/templates/web/oxfordshire/around/tabbed_lists.html b/templates/web/oxfordshire/around/tabbed_lists.html new file mode 100644 index 000000000..0d7dfddfc --- /dev/null +++ b/templates/web/oxfordshire/around/tabbed_lists.html @@ -0,0 +1,5 @@ +[% INCLUDE "reports/_list-filters.html" %] + +<ul class="report-list" id="current"> + [% INCLUDE "around/on_map_list_items.html" %] +</ul> diff --git a/templates/web/oxfordshire/header.html b/templates/web/oxfordshire/header.html index 19bb23374..0bbdaf353 100644 --- a/templates/web/oxfordshire/header.html +++ b/templates/web/oxfordshire/header.html @@ -24,73 +24,59 @@ <script src="[% start %][% version('/cobrands/oxfordshire/position_map.js') %]" charset="utf-8"></script> [% INCLUDE 'common_header_tags.html', js_override = '/cobrands/fixmystreet/fixmystreet.js' %] [% extra_js %] - + [% INCLUDE 'tracking_code.html' %] </head> <body class="[% bodyclass | html IF bodyclass %]"> <div id="oxford-wrapper"> - <div id="oxford-header" class="desk-only oxford-left"> - <a href="http://www.oxfordshire.gov.uk/" title="Home" class="logo">Oxfordshire County Council<span></span></a> - <span id="oxford-links"> - <a href="http://www.oxfordshire.gov.uk/" title="">Oxfordshire County Council home</a> - </span> - <div style="clear:both"></div> - <span class="header"><a href="/">Report a road or street problem</a></span> - <div class="oxford-user"> - <p> - [% IF c.user_exists %] - [% tprintf(loc('Hi %s'), c.user.name || c.user.email) %] - <a href="/auth/sign_out">[% loc('sign out') %]</a> - [% END %] - </p> - </div> - - - <div id="navigation"> - <div class="menubar"> - <div class="menu-inner"> - <ul class="menu"> - <li> - <[% IF c.req.uri.path == '/' %]span[% ELSE %]a href="/"[% END %]>[% "Report" %]</[% c.req.uri.path == '/' ? 'span' : 'a' %]> - </li> - <li> - <[% IF c.req.uri.path == '/my' OR ( c.req.uri.path == '/auth' AND c.req.params.r == 'my' ) %]span[% ELSE %]a href="/my"[% END - %]>[% loc("Your reports") %]</[% ( c.req.uri.path == '/my' OR ( c.req.uri.path == '/auth' AND c.req.params.r == 'my' ) ) ? 'span' : 'a' %]> - </li> - <li> - <[% IF c.req.uri.path == '/reports/Oxfordshire' %]span[% ELSE %]a href="/reports/Oxfordshire"[% END - %]>[% loc("All reports") %]</[% c.req.uri.path == '/reports' ? 'span' : 'a' %]> - </li> - <li> - <[% IF c.req.uri.path == '/alert' %]span[% ELSE %]a href="/alert[% pc ? '/list?pc=' : '' %][% pc | uri %]"[% END - %]>[% loc("Local alerts") %]</[% c.req.uri.path == '/alert' ? 'span' : 'a' %]> - </li> - <li> - <[% IF c.req.uri.path == '/faq' %]span[% ELSE %]a href="/faq"[% END - %]>[% loc("Help") %]</[% c.req.uri.path == '/faq' ? 'span' : 'a' %]> - </li> - </ul> - </div> + <div id="oxford-header" class="desk-only oxford-left"> + <a href="http://www.oxfordshire.gov.uk/" title="Home" class="logo">Oxfordshire County Council<span></span></a> + <span id="oxford-links"> + <a href="http://www.oxfordshire.gov.uk/" title="">Oxfordshire County Council home</a> + </span> + <div style="clear:both"></div> + <span class="header"><a href="/">Report a road or street problem</a></span> + + [% IF c.user_exists %] + <div class="oxford-user"> + <p> + [% tprintf(loc('Hi %s'), c.user.name || c.user.email) %] + <a href="/auth/sign_out">[% loc('Sign out') %]</a> + </p> + </div> + [% END %] + + <div id="navigation"> + <div class="menubar"> + <div class="menu-inner"> + <ul class="menu"> + <li> + <[% IF c.req.uri.path == '/' %]span[% ELSE %]a href="/"[% END %]>[% "Report" %]</[% c.req.uri.path == '/' ? 'span' : 'a' %]> + </li> + <li> + <[% IF c.req.uri.path == '/my' OR ( c.req.uri.path == '/auth' AND c.req.params.r == 'my' ) %]span[% ELSE %]a href="/my"[% END + %]>[% loc("Your reports") %]</[% ( c.req.uri.path == '/my' OR ( c.req.uri.path == '/auth' AND c.req.params.r == 'my' ) ) ? 'span' : 'a' %]> + </li> + <li> + <[% IF c.req.uri.path == '/reports/Oxfordshire' %]span[% ELSE %]a href="/reports/Oxfordshire"[% END + %]>[% loc("All reports") %]</[% c.req.uri.path == '/reports' ? 'span' : 'a' %]> + </li> + <li> + <[% IF c.req.uri.path == '/alert' %]span[% ELSE %]a href="/alert[% pc ? '/list?pc=' : '' %][% pc | uri %]"[% END + %]>[% loc("Local alerts") %]</[% c.req.uri.path == '/alert' ? 'span' : 'a' %]> + </li> + <li> + <[% IF c.req.uri.path == '/faq' %]span[% ELSE %]a href="/faq"[% END + %]>[% loc("Help") %]</[% c.req.uri.path == '/faq' ? 'span' : 'a' %]> + </li> + </ul> + </div> </div> </div> - - - - - </div> <!-- end of oxford header --> -<!-- - <div id="oxford-main-menu" class="desk-only"> - <ul class="tabs"> - <li class="home first"></li>[% - %]<li></li>[% - %]<li></li>[% - %]<li></li>[% - %]<li class="last"></li> - </ul> - </div> ---> - + + </div> <!-- end of oxford header --> + <div class="wrapper"> <div class="table-cell"> @@ -104,7 +90,7 @@ [% IF c.user_exists %] <div id="user-meta"> <p> - [% tprintf(loc('Hi %s'), c.user.name || c.user.email) %] + [% tprintf(loc('Hi %s'), c.user.name || c.user.email) %] <a href="/auth/sign_out">[% loc('sign out') %]</a> </p> </div> diff --git a/templates/web/oxfordshire/js/translation_strings.html b/templates/web/oxfordshire/js/translation_strings.html deleted file mode 100644 index e326da0a8..000000000 --- a/templates/web/oxfordshire/js/translation_strings.html +++ /dev/null @@ -1,40 +0,0 @@ - translation_strings = { - update: '[% loc('Please enter a message') | replace("'", "\\'") %]', - title: '[% loc('Please enter a subject') | replace("'", "\\'") %]', - detail: '[% loc('Please enter some details') | replace("'", "\\'") %]', - name: { - required: '[% loc('Please enter your name') | replace("'", "\\'") %]', - validName: '[% loc('Please enter your full name, councils need this information – if you do not wish your name to be shown on the site, untick the box below') | replace("'", "\\'") %]' - }, - category: '[% loc('Please choose a category') | replace("'", "\\'") %]', - rznvy: { - required: '[% loc('Please enter your email') | replace("'", "\\'") %]', - email: '[% loc('Please enter a valid email') | replace("'", "\\'") %]' - }, - email: { - required: '[% loc('Please enter your email') | replace("'", "\\'") %]', - email: '[% loc('Please enter a valid email') | replace("'", "\\'") %]' - }, - fms_extra_title: '[% loc('Please enter your title') | replace("'", "\\'") %]', - first_name: '[% loc('Please enter your first name') | replace("'", "\\'") %]', - last_name: '[% loc('Please enter your second name') | replace("'", "\\'") %]', - geolocate: '[% loc('or locate me automatically') | replace("'", "\\'") %]', - right_place: '[% loc('Right place?') | replace("'", "\\'") %]', - try_again: '[% loc('Try again') | replace("'", "\\'") %]', - place_pin_on_map: '[% loc('Place pin on map') | replace("'", "\\'") %]', - home: '[% loc('Home') | replace("'", "\\'") %]', - back: '[% loc('Back') | replace("'", "\\'") %]', - how_to_send: '[% loc('How to send successful reports') | replace("'", "\\'") %]', - more_details: '[% loc('Details') | replace("'", "\\'") %]', - - geolocation_declined: '[% loc('You declined; please fill in the box above') | replace("'", "\\'") %]', - geolocation_no_position: '[% loc('Could not look up location') | replace("'", "\\'") %]', - geolocation_no_result: '[% loc('No result returned') | replace("'", "\\'") %]', - geolocation_unknown: '[% loc('Unknown error') | replace("'", "\\'") %]', - - reporting_a_problem: '[% loc('Reporting a problem') | replace("'", "\\'") %]', - ok: '[% loc('OK') | replace("'", "\\'") %]', - map: '[% loc('MAP') | replace("'", "\\'") %]', - - report_problem_heading: '[% loc('Click on the map to report a problem') | replace("'", "\\'") %]' - }; diff --git a/templates/web/oxfordshire/my/_problem-list.html b/templates/web/oxfordshire/my/_problem-list.html new file mode 100644 index 000000000..1ff69f9fb --- /dev/null +++ b/templates/web/oxfordshire/my/_problem-list.html @@ -0,0 +1,25 @@ +<ul class='issue-list-a full-width'> + [% IF problems.all %] + [% FOREACH p = problems.all %] + [% INCLUDE 'reports/_list-entry.html', problem = p, no_fixed =1 %] + [% END %] + [% ELSE %] + <li class="empty"> + <p>[% loc('There are no reports to show.') %]</p> + </li> + [% END %] +</ul> + +[% IF ! problems.size %] +<!-- Preserve behaviour of map filters despite map not being shown --> +<script type="text/javascript"> + (function($) { + $(function() { + $(".report-list-filters [type=submit]").hide(); + $(".report-list-filters select").change(function() { + $(this).closest("form").submit(); + }); + }) + })(window.jQuery); +</script> +[% END %] diff --git a/templates/web/oxfordshire/report/_council_sent_info.html b/templates/web/oxfordshire/report/_council_sent_info.html index 464c10256..499fd4637 100644 --- a/templates/web/oxfordshire/report/_council_sent_info.html +++ b/templates/web/oxfordshire/report/_council_sent_info.html @@ -1,16 +1,24 @@ [% IF problem.whensent || problem.can_display_external_id %] - <small class="council_sent_info"><br> - [% IF problem.whensent %] - [% problem.duration_string(c) %]<br> - [% END %] - <strong> - [% IF problem.can_display_external_id %] - [% IF problem.whensent %] - Council ref: [% problem.external_id %] - [% ELSE %] - [% problem.external_body %] ref: [% problem.external_id %] - [% END %] - [% END %] - </strong> - </small> + <div class="council_info_box"> + [% IF problem.can_display_external_id %] + <h3> + [% IF problem.whensent %] + Council ref: [% problem.external_id %] + [% ELSE %] + [% problem.external_body %] ref: [% problem.external_id %] + [% END %] + </h3> + [% END %] + + [% IF c.cobrand.problem_response_days(problem) > 0 %] + <p> + Problems in the + [% problem.category %] + category are generally responded to within + [% c.cobrand.problem_response_days(problem) %] + working days. + </p> + [% END %] + + </div> [% END %] diff --git a/templates/web/oxfordshire/report/_main.html b/templates/web/oxfordshire/report/_main.html new file mode 100644 index 000000000..3bb786141 --- /dev/null +++ b/templates/web/oxfordshire/report/_main.html @@ -0,0 +1,98 @@ +[% 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 %] + <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> + [% END %] + <h1 class="moderate-display">[% problem.title | html %]</h1> + [% 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> + </div> + [% END %] + + <p class="report_meta_info"> + [% problem.meta_line(c) | html %] + [%- IF !problem.used_map AND c.cobrand.moniker != 'emptyhomes' %]; <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 %] + [% mlog = problem.latest_moderation_log_entry(); IF mlog %] + <p>Moderated by [% mlog.user.from_body.name %] at [% prettify_dt(mlog.whenedited) %]</p> + [% END %] + + [% INCLUDE 'report/_support.html' %] + + [% 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> + + <div class="moderate-edit"> + <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> + </form> + [% END %] + + [% IF problem.bodies_str %] + [% INCLUDE 'report/_council_sent_info.html' %] + [% ELSE %] + <div class="council_info_box"> + <p>[% loc('Not reported to council') %]</p> + </div> + [% END %] +</div> diff --git a/templates/web/oxfordshire/reports/_list-entry.html b/templates/web/oxfordshire/reports/_list-entry.html new file mode 100644 index 000000000..cd70410d3 --- /dev/null +++ b/templates/web/oxfordshire/reports/_list-entry.html @@ -0,0 +1,6 @@ +<li class="[% c.cobrand.pin_colour(problem) %]"> + <a href="[% c.uri_for('/report', problem.id ) %]" class="[% problem.category %]"> + <h3>[% problem.title | html %]</h3> + <p>Reported [%- prettify_dt( problem.confirmed, 1 ) %]</p> + </a> +</li> diff --git a/templates/web/oxfordshire/reports/_list-filters.html b/templates/web/oxfordshire/reports/_list-filters.html new file mode 100644 index 000000000..5d610261b --- /dev/null +++ b/templates/web/oxfordshire/reports/_list-filters.html @@ -0,0 +1,32 @@ +[% IF use_section_wrapper %] +<section class="full-width"> + <form method="get" action=""> +[% END %] + + <p class="report-list-filters"> + <label> + Show + <select name="status" id="statuses"> + <option value="all"[% ' selected' IF filter_status == 'all' %]>all reports</option> + <option value="open"[% ' selected' IF filter_status == 'open' %]>unfixed reports</option> + <option value="fixed"[% ' selected' IF filter_status == 'fixed' %]>fixed reports</option> + </select> + </label> + <label> + about + <select name="filter_category" id="filter_categories"> + <option value="">Everything</option> + [% FOR category IN filter_categories %] + <option value="[% category | html %]"[% ' selected' IF filter_category == category %]> + [% category | html %] + </option> + [% END %] + </select> + </label> + <input type=submit value="Go" /> + </p> + +[% IF use_section_wrapper %] + </form> +</section> +[% END %] diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js index fdecee9db..31925e977 100644 --- a/web/cobrands/fixmystreet/fixmystreet.js +++ b/web/cobrands/fixmystreet/fixmystreet.js @@ -463,7 +463,8 @@ $.fn.drawer = function(id, ajax) { offset = -110; } if (cobrand == 'oxfordshire') { - offset = -13 * 16; + // Oxfordshire uses box-sizing:border-box and padding to work out height + offset = 0; } heightFix(window, '.content', offset, 1); // in case we have a map that isn't full screen diff --git a/web/cobrands/oxfordshire/_colours.scss b/web/cobrands/oxfordshire/_colours.scss index 900f96d3d..ed494674a 100644 --- a/web/cobrands/oxfordshire/_colours.scss +++ b/web/cobrands/oxfordshire/_colours.scss @@ -2,6 +2,8 @@ $oxfordshire_dk_green: #114500; $oxfordshire_lt_green: #339E00; +$oxfordshire_very_light_green: #f6fcf0; +$oxfordshire_mid_grey_green: #e0e5da; $primary: $oxfordshire_lt_green; $primary_b: $oxfordshire_dk_green; @@ -10,6 +12,9 @@ $primary_text: #fff; $base_bg: #fff; $base_fg: #000; +// Taken from the OCC website +$oxfordshire_link_colour: #0c62ba; + /* Unused here */ $map_nav_bg: #222; $nav_fg: #fff; @@ -19,7 +24,7 @@ $col_click_map: $oxfordshire_lt_green; $col_click_map_dark: $primary_text; $col_fixed_label: $oxfordshire_lt_green; -$col_fixed_label_dark: $primary_text; +$col_fixed_label_dark: mix(#000, $oxfordshire_lt_green, 50%); // Oxfordshire have toasty orange buttons diff --git a/web/cobrands/oxfordshire/base.scss b/web/cobrands/oxfordshire/base.scss index c3242dbec..2f297582c 100644 --- a/web/cobrands/oxfordshire/base.scss +++ b/web/cobrands/oxfordshire/base.scss @@ -45,3 +45,29 @@ dd, p { line-height: 1.4em; } +// TODO: Should this be applied to the base base stylesheet, to prevent possible similar issues in other cobrands? +#sub_map_links { + line-height: 1em; +} + +.council_info_box { + border-top: 1px solid #ccc; + padding: 1em; + margin: 0 -1em -1em -1em; // counteract 1em padding on sidebar without using .full-width which sets an explicit width + + h3 { + font-weight: bold; + font-size: 1em; + margin: 0 0 0.5em 0; + } + + p { + color: #666; + margin: 0 0 0.5em 0; + font-size: 0.9em; + } + + & > :last-child { + margin-bottom: 0; + } +} diff --git a/web/cobrands/oxfordshire/images/click-map-chevron-small.gif b/web/cobrands/oxfordshire/images/click-map-chevron-small.gif Binary files differnew file mode 100644 index 000000000..fdc871c41 --- /dev/null +++ b/web/cobrands/oxfordshire/images/click-map-chevron-small.gif diff --git a/web/cobrands/oxfordshire/images/logo-light-green.gif b/web/cobrands/oxfordshire/images/logo-light-green.gif Binary files differnew file mode 100644 index 000000000..6bf7b6940 --- /dev/null +++ b/web/cobrands/oxfordshire/images/logo-light-green.gif diff --git a/web/cobrands/oxfordshire/layout.scss b/web/cobrands/oxfordshire/layout.scss index 9b6308e09..195c5342f 100644 --- a/web/cobrands/oxfordshire/layout.scss +++ b/web/cobrands/oxfordshire/layout.scss @@ -1,8 +1,9 @@ @import "_colours"; @import "../sass/layout"; +@import "../sass/report_list"; body, body a { - font-family:"Trebuchet MS",Arial, Helvetica, sans-serif; + font-family:"Trebuchet MS",Arial, Helvetica, sans-serif; } #front-main { @@ -65,23 +66,6 @@ body.twothirdswidthpage { } } -//------------------------------------------------- -// following declarations concern the map display: -//------------------------------------------------- -// So that map appears underneath the header -.wrapper { - position: relative; - .table-cell { - padding-left: 13px; // added 13px to match Oxfordshire's normal look - padding-right: 13px; - } -} -.ie6, .ie7 { - .wrapper { - padding-top: 1em; - } -} - // To prevent font size larger interfering with the fixed Oxfordshire layout .container { width: auto; } .full-width { width: 464px; } @@ -110,59 +94,233 @@ body.twothirdswidthpage .content { } body.mappage { - .content { - width: 345px; - padding: 1em; - position: relative; - z-index: 1; + $mappage-header-height: 60px; + + #oxford-wrapper { + width: auto; + padding: 0; + background: transparent; + } + + #oxford-header { + position: fixed; + top: 0; + left: 0; + right: 0; + z-index: 2; // 1 more than `body.mappage .content` + width: auto; + min-height: $mappage-header-height; + padding: 0; + background-color: #069b01; // picked from header.jpg + background-position: 100% 40%; + overflow: auto; + box-shadow: 0 0 5px rgba(0,0,0,0.3); + + & > * { + display: none; + } + + a.logo { + display: block; + float: left; + height: $mappage-header-height; + width: 200px; + margin: 0; + background: transparent url("/cobrands/oxfordshire/images/logo-light-green.gif") no-repeat 50% 50%; + text-indent: -999px; + + * { + display: none; + } + } + + #navigation { + display: block; + position: static; + float: right; + } + + .menubar { + display: block; + width: auto; + border-top: none; + padding: 0; + + // override super-specific "#navigation .menubar .menu-inner .menu>li>a" + // selector from OCC header styles in oxfordshire.scss + .menu-inner .menu { + li { + margin-bottom: 0; + } + + a, span { + line-height: 20px; + padding-top: ($mappage-header-height - 20px) / 2; + padding-bottom: ($mappage-header-height - 20px) / 2; + } + } + } + + .oxford-user { + display: block; + font-size: 13px; + margin: 0; + color: mix(#ddd, #069b01, 80%); + + p { + margin: 0; + padding-top: ($mappage-header-height - 20px) / 2; + padding-bottom: ($mappage-header-height - 20px) / 2; + line-height: 20px; + } + + a { + padding: 0 10px; + text-decoration: none; + } + } + } + + .wrapper .table-cell { + padding-left: 0; + padding-right: 0; + } + + .container { + width: auto; + } + + .content { + padding: 1em; + padding-top: $mappage-header-height + 10px; + position: relative; + z-index: 1; + box-shadow: 0 0 5px rgba(0,0,0,0.3); + background-color: $oxfordshire_very_light_green; + + // fixmystreet.js gives this element a min-height equal to the window height. + // Set border-box sizing, so that our padding doesn't get added onto height. + box-sizing: border-box; + + .extra-text { + padding: 1em; + margin: 0 -1em; + border-bottom: 1px solid $oxfordshire_mid_grey_green; + + p:last-child { + margin-bottom: 0; + } + } + + .full-width { + width: auto; + margin: 0 -1em; } - .container { - width: auto; - min-height: 635px; - z-index: auto; + input[type="file"] { + background-color: transparent; } - .full-width { width: 377px; } - .shadow-wrap { width: 377px; } + } + + // Space between green header and sidebar content + #report-a-problem-main, + .problem-header { + padding-top: 1em; + } + + // The "Fixed" / "Unknown" tabs on Oxford report pages are "folded" + // round right edge of the sidebar, rather than over the top of it. + .banner { + margin: 0 -1em; // line tab up with right edge of 1em padded sidebar + + // Float the tab, rather than absolute positioning, to benefit + // from text wrapping and stop content being hidden behind it. + p { + position: relative; // still required for :before positioning + top: auto; + right: auto; + float: right; + margin: 1em -0.75em 0.5em 1em; - #report-a-problem-sidebar { - top: 1em; - left: 23.5em; + // Swap "fold" triangle to bottom right corner of box, rather than top left. + &:before { + left: auto; + right: 0; + top: auto; + bottom: -0.75em; + border-left: none; + border-bottom: none !important; // override default id selectors + border-top: 0.75em solid #888; + border-right: 0.75em solid transparent; + } + + &#fixed:before { + border-top-color: #1D4D05; // dark green + border-top-color: $col_fixed_label_dark; + } } + } + + #oxford-footer { + display: none; + } } -.ie6, .ie7 { - body.mappage .container { - width: 464px; - margin-left: 0; +.report-list, .issue-list-a { + li:after { + background-color: $oxfordshire_mid_grey_green; + } + + h3 { + color: $oxfordshire_link_colour; } } -// As map can scroll and isn't at the top, give it an edge -#map_box { - border: solid 1px #999; - top: 1em; - right: 0; - left: 0; - margin: 0 1em; +h4.static-with-rule { + margin-top: 1em; // down from default 2em, avoid extra space between heading and .council_info_box + margin-bottom: 0; // no space between this and the .issue-list items + background: transparent; // rather than light grey + padding: 0.75em 1em * (1/0.875); // compensate for 0.875 font-size +} + +.issue-list li { + background: transparent; + margin-top: 0; // no space between list items + + // Replicate .report-list styling, a bit + border-top: 1px solid $oxfordshire_mid_grey_green; + padding: 1em 1em 1em 0; + margin-left: 1em; + + .update-wrap .update-text > :last-child { + margin-bottom: 0; + } + + .meta-2 { + font-style: normal; + } } -// Perhaps fix map location (should be in central?) -.ie6 #map_box, .ie7 #map_box { - right: -480px; +.form-box { + background-color: darken($oxfordshire_very_light_green, 5%); } -// So as not to interfere with the Oxfordshire footer, make the fixed nav ("get updates" etc) static. .shadow-wrap { - position: static; - padding-top: 0; - margin-bottom: 1em; + width: 432px; + ul#key-tools { - border-top: none; - border-bottom: 1px solid $primary; + -webkit-box-shadow: 0em 0px 1em 1em $oxfordshire_very_light_green; + -moz-box-shadow: 0em 0px 1em 1em $oxfordshire_very_light_green; + box-shadow: 0em 0px 1em 1em $oxfordshire_very_light_green; + border-top-width: 2px; } } +// Stop bottom of update form disappearing behind the #key-tools shadow +#update_form { + padding-bottom: 4em; +} + #oxford-wrapper #front-main #postcodeForm div { border: 1px solid #fff; // because orange "Go" button (see below) abuts this border, looks a tiny bit better if it's not dark green @@ -195,21 +353,48 @@ input.green-btn{ cursor: pointer; } -.big-green-banner { - text-align: left; - text-transform: inherit; - font-family: inherit; - font-size: 1.5em; - padding: 0.5em 2em 0.5em 0.5em; - line-height: 1.3; - background: #339e00 url("/cobrands/fixmystreet/images/sprite.png") right -2177px no-repeat; +.click-the-map { + border-bottom-color: $oxfordshire_mid_grey_green; - .ie6 &, .ie7 & { - zoom: 1; - position: relative; + p { + color: $oxfordshire_lt_green; + background-image: url(/cobrands/oxfordshire/images/click-map-chevron-small.gif); } } +#skip-this-step { + display: block; + color: inherit; + margin: 0 -15px; + padding: 16px; + font-size: 18px; + line-height: 20px; + border-bottom: 1px solid #E7E1C0; + background: #FDF4C5; + + em { + font-style: normal; + text-decoration: underline; + color: $primary; + } + + &:hover { + text-decoration: none; + } + + html.js & { + // If javascript is enabled, hide the skip link off-screen, + // but keep it visible for screen readers. + position: absolute; + top: -999px; + + &:focus { + // And show it again if it receives focus (eg: via tab key) + position: static; + } + } +} + .extra-text__image { float: left; margin-right: 1em; diff --git a/web/cobrands/oxfordshire/oxfordshire.scss b/web/cobrands/oxfordshire/oxfordshire.scss index d6b31586c..46de1f22b 100644 --- a/web/cobrands/oxfordshire/oxfordshire.scss +++ b/web/cobrands/oxfordshire/oxfordshire.scss @@ -7,9 +7,9 @@ body { - font-family:"Trebuchet MS",Arial, Helvetica, sans-serif; - line-height:18px; - a {text-decoration:none; color:#0c62ba} + font-family:"Trebuchet MS",Arial, Helvetica, sans-serif; + line-height:18px; + a, a:visited {text-decoration:none; color:$oxfordshire_link_colour} a { font-size: 1em; } // mySociety a:hover {text-decoration:underline} margin:0; @@ -27,15 +27,15 @@ body { } #oxford-header { - padding:0 16px 7px 16px; - clear:both; - overflow:hidden; - position:relative; + padding:0 16px 7px 16px; + clear:both; + overflow:hidden; + position:relative; width:958px; /* note================= */ height: 133px; - height:auto !important; + height:auto !important; min-height:133px; /* note================= */ @@ -47,7 +47,7 @@ body { a.logo, a.logo span {width:173px; height:38px; background: url("/cobrands/oxfordshire/images/logo.jpg") no-repeat 0 0;} h1 { - float:left; padding:8px 0 0 10px; margin:0; font-size:1.25em; line-height:normal; + float:left; padding:8px 0 0 10px; margin:0; font-size:1.25em; line-height:normal; font-weight:bold; color:#ffffff; white-space:nowrap;font-family:"Trebuchet MS",Tahoma,Arial,sans-serif; } span.header { @@ -76,73 +76,71 @@ body { } } - - #oxford-main-menu { clear: both; margin: 0; padding: 0; font-size: 1em; position: relative; - ul { + ul { margin: 0 0 0 330px; position: relative; li { margin: 0; - list-style-type: none; - float:left; + list-style-type: none; + float:left; width:126px; text-align:center; background: #e0e0e0; padding: 8px 0; - margin: 0 0 0 2px; + margin: 0 0 0 2px; } } // from occ.css (client site): #main .view-features-for-homepage ul.tabs ul.tabs { - float:left; - position:relative; - padding:0; + float:left; + position:relative; + padding:0; margin:0.5em 0 0 0; - z-index:10; + z-index:10; width: 990px; - //width:635px; - min-height:32px; - overflow:hidden; - clear:both; + //width:635px; + min-height:32px; + overflow:hidden; + clear:both; background: #939393 url("/cobrands/oxfordshire/images/tabs-featured.png") repeat 0 0; li { - float:left; - padding:0 0 0px 1px; - margin:0; - font:0.813em/27px "Trebuchet MS"; - color:#ffffff; - height:32px; + float:left; + padding:0 0 0px 1px; + margin:0; + font:0.813em/27px "Trebuchet MS"; + color:#ffffff; + height:32px; background: #666 url("/cobrands/oxfordshire/images/divider1x32.png") no-repeat 0 0; } li.first {padding:0; background:none} span, // mySociety a { - display:block; - position:relative; - padding:8px 0 0 0; - font:bold 1em "Trebuchet MS"; - height:24px; - color:#ffffff; - text-align:center; - background: #939393 url("/cobrands/oxfordshire/images/tabs-featured.png") repeat-x 0 0; + display:block; + position:relative; + padding:8px 0 0 0; + font:bold 1em "Trebuchet MS"; + height:24px; + color:#ffffff; + text-align:center; + background: #939393 url("/cobrands/oxfordshire/images/tabs-featured.png") repeat-x 0 0; white-space:nowrap; } a:hover, a:focus { - background: none #EA6C18; - background:-moz-linear-gradient(100% 100% 90deg, #ff4401, #EA6C18); - background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#EA6C18), to(#ff4401)); + background: none #EA6C18; + background:-moz-linear-gradient(100% 100% 90deg, #ff4401, #EA6C18); + background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#EA6C18), to(#ff4401)); color: #ffffff; } li span, // mySociety li.active a { - text-decoration:none; + text-decoration:none; background: #4c4c4c url("/cobrands/oxfordshire/images/tabs-featured-on.png") repeat-x 0 0; } li.active a:hover, @@ -154,13 +152,13 @@ body { } #oxford-footer { - float:left; - display:inline; - margin:0 -8px 0 -8px; - padding:10px 25px 30px 21px; - clear:both; - overflow:hidden; - width:960px; + float:left; + display:inline; + margin:0 -8px 0 -8px; + padding:10px 25px 30px 21px; + clear:both; + overflow:hidden; + width:960px; background:#000000 url(/cobrands/oxfordshire/images/footer.jpg) no-repeat bottom left; address {float:left; padding:11px 0 0 0; margin:0; color:#989898; font:0.813em arial} a {font:1em arial; color:#ffffff; margin:0px 5px 0px 5px} @@ -190,7 +188,7 @@ body { } /* --------------------------------------------------------------------------------- - oxfordshire nav menubar from e.g., + oxfordshire nav menubar from e.g., http://fisd.oxfordshire.gov.uk/kb5/oxfordshire/fsd/includes/css/wireframe/navbar.css ---------------------------------------------------------------------------------*/ diff --git a/web/cobrands/oxfordshire/position_map.js b/web/cobrands/oxfordshire/position_map.js index 9e299ea72..bcd0e0c12 100644 --- a/web/cobrands/oxfordshire/position_map.js +++ b/web/cobrands/oxfordshire/position_map.js @@ -1,28 +1,22 @@ -/** - * Position the map box correctly on window resize. - * - * Called from fixmystreet.js when the window 'resize' event is fired - * and the page is transitioning to a desktop version. - */ function position_map_box() { var $html = $('html'); - var oxfordshire_right; - if ($html.hasClass('ie6') || $html.hasClass('ie7')) { - oxfordshire_right = '-480px'; + if ($html.hasClass('ie6')) { + $('#map_box').prependTo('body').css({ + zIndex: 0, position: 'absolute', + top: 0, left: 0, right: 0, bottom: 0, + width: '100%', height: $(window).height(), + margin: 0 + }); } else { - oxfordshire_right = '0em'; + $('#map_box').prependTo('body').css({ + zIndex: 0, position: 'fixed', + top: 0, left: 0, right: 0, bottom: 0, + width: '100%', height: '100%', + margin: 0 + }); } - - var map_box_width = "956px"; - var map_box_height = "600px"; - // Do the same as CSS (in case resized from mobile). - $('#map_box').prependTo('.wrapper').css({ - zIndex: 1, position: 'absolute', - top: '1em', left: '', right: oxfordshire_right, bottom: '', - width: map_box_width, height: map_box_height, - margin: "0 1em" - }); } function map_fix() {} -var slide_wards_down = 1; +var slide_wards_down = 0; + diff --git a/web/i/pin-grey-big.png b/web/i/pin-grey-big.png Binary files differnew file mode 100644 index 000000000..02117aa5e --- /dev/null +++ b/web/i/pin-grey-big.png diff --git a/web/i/pin-grey.png b/web/i/pin-grey.png Binary files differnew file mode 100644 index 000000000..866e6ebe7 --- /dev/null +++ b/web/i/pin-grey.png |
