diff --git a/app/assets/images/dashed-border-govuk-blue.svg b/app/assets/images/dashed-border-govuk-blue.svg new file mode 100644 index 000000000..3c9d9f1db --- /dev/null +++ b/app/assets/images/dashed-border-govuk-blue.svg @@ -0,0 +1,13 @@ + + + + + + + + + + diff --git a/app/assets/stylesheets/components/area-list.scss b/app/assets/stylesheets/components/area-list.scss index d347af7fc..66769111b 100644 --- a/app/assets/stylesheets/components/area-list.scss +++ b/app/assets/stylesheets/components/area-list.scss @@ -1,6 +1,6 @@ .area-list { - display: inline-block; + display: inline; &-item { @@ -94,27 +94,37 @@ content: ""; display: block; position: absolute; - top: 0; - left: 0; - width: govuk-spacing(7); - height: govuk-spacing(7); + top: 3px; + left: govuk-spacing(1); + width: govuk-spacing(6); + height: govuk-spacing(6); box-sizing: border-box; margin-right: govuk-spacing(1); + transform: rotate(45deg); } &--certain { &:before { - border: 4px solid rgba($white, 0.1); - background: rgba($govuk-blue, 0.6); - box-shadow: inset 0 0 0 2px $black; + border: 2px solid $black; + background: $light-blue-50; } } &--likely { &:before { padding: 1px; - border: 2px solid $govuk-blue; - background: rgba($govuk-blue, 0.2); + border: 2px dashed $govuk-blue; + border-image: file-url('dashed-border-govuk-blue.svg') 4 round; + background: $light-blue-25; + } + } + + &--phone-estimate { + padding-left: govuk-spacing(1); + margin-right: 0; + float: right; + &:before { + display: none; } } diff --git a/app/models/broadcast_message.py b/app/models/broadcast_message.py index 87b431b37..c5951b152 100644 --- a/app/models/broadcast_message.py +++ b/app/models/broadcast_message.py @@ -128,7 +128,7 @@ class BroadcastMessage(JSONModel): def count_of_phones(self): return round_to_significant_figures( sum(area.count_of_phones for area in self.areas), - 2 + 1 ) @property @@ -136,7 +136,7 @@ class BroadcastMessage(JSONModel): area_estimate = self.simple_polygons.estimated_area bleed_area_estimate = self.simple_polygons.bleed.estimated_area - area_estimate return round_to_significant_figures( - self.count_of_phones * bleed_area_estimate / area_estimate, + self.count_of_phones + (self.count_of_phones * bleed_area_estimate / area_estimate), 1 ) diff --git a/app/templates/views/broadcast/macros/area-map.html b/app/templates/views/broadcast/macros/area-map.html index 53a991dc9..32b0ce8ee 100644 --- a/app/templates/views/broadcast/macros/area-map.html +++ b/app/templates/views/broadcast/macros/area-map.html @@ -7,7 +7,7 @@ Will get - alert ({{ broadcast_message.count_of_phones|format_thousands }} phones) + alert
  • alert - ({{ broadcast_message.count_of_phones_likely|format_thousands }} phones) +
    • +
  • + {% if broadcast_message.count_of_phones == broadcast_message.count_of_phones_likely %} + {{ broadcast_message.count_of_phones|format_thousands }} phones estimated + {% else %} + {{ broadcast_message.count_of_phones|format_thousands }} to {{ broadcast_message.count_of_phones_likely|format_thousands }} phones + {% endif %}
    • {% endmacro %} diff --git a/app/templates/views/broadcast/partials/area-map-javascripts.html b/app/templates/views/broadcast/partials/area-map-javascripts.html index 6111f6be2..b557e9445 100644 --- a/app/templates/views/broadcast/partials/area-map-javascripts.html +++ b/app/templates/views/broadcast/partials/area-map-javascripts.html @@ -5,23 +5,13 @@ {% for polygon in broadcast_message.simple_polygons.bleed.as_coordinate_pairs_lat_long %} polygons.push( L.polygon({{polygon}}, { - opacity: 0.8, - color: '#005ea5', // $light-blue - fillColor: '#005ea5', // $light-blue + opacity: 1, + color: '#005ea5', + fillColor: '#2B8CC4', fillOpacity: 0.15, - weight: 2 - }) - ); - {% endfor %} - - {% for polygon in broadcast_message.simple_polygons.as_coordinate_pairs_lat_long %} - polygons.push( - L.polygon({{polygon}}, { - opacity: 0.3, - color: '#005ea5', // $black - fillColor: '#005ea5', // $light-blue - fillOpacity: 0.3, - weight: 1 + weight: 2, + dashArray: [6, 7], + lineCap: 'butt' }) ); {% endfor %} @@ -29,8 +19,9 @@ {% for polygon in broadcast_message.polygons.as_coordinate_pairs_lat_long %} polygons.push( L.polygon({{polygon}}, { - color: '#0b0b0c', // $black - fillOpacity: 0, + color: '#0b0b0c', + fillColor: '#005ea5', + fillOpacity: 0.3, weight: 2 }) ); diff --git a/tests/app/main/views/test_broadcast.py b/tests/app/main/views/test_broadcast.py index b17f5c93e..35963b642 100644 --- a/tests/app/main/views/test_broadcast.py +++ b/tests/app/main/views/test_broadcast.py @@ -368,13 +368,57 @@ def test_broadcast_page( ), +@pytest.mark.parametrize('areas_selected, areas_listed, estimates', ( + ([ + 'ctry19-E92000001', + 'ctry19-S92000003', + ], [ + 'England remove', + 'Scotland remove', + ], [ + 'An area of 176,714.9 square miles Will get the alert', + 'An extra area of 3,052.8 square miles is Likely to get the alert', + '40,000,000 phones estimated', + ]), + ([ + 'wd20-E05003224', + 'wd20-E05003225', + 'wd20-E05003227', + 'wd20-E05003228', + 'wd20-E05003229', + ], [ + 'Penrith Carleton remove', + 'Penrith East remove', + 'Penrith Pategill remove', + 'Penrith South remove', + 'Penrith West remove', + ], [ + 'An area of 6.3 square miles Will get the alert', + 'An extra area of 14.4 square miles is Likely to get the alert', + '9,000 to 30,000 phones', + ]), +)) def test_preview_broadcast_areas_page( + mocker, client_request, service_one, fake_uuid, - mock_get_draft_broadcast_message, + areas_selected, + areas_listed, + estimates, ): service_one['permissions'] += ['broadcast'] + mocker.patch( + 'app.broadcast_message_api_client.get_broadcast_message', + return_value=broadcast_message_json( + id_=fake_uuid, + template_id=fake_uuid, + created_by_id=fake_uuid, + service_id=SERVICE_ONE_ID, + status='draft', + areas=areas_selected, + ), + ) page = client_request.get( '.preview_broadcast_areas', service_id=SERVICE_ONE_ID, @@ -384,20 +428,14 @@ def test_preview_broadcast_areas_page( assert [ normalize_spaces(item.text) for item in page.select('ul.area-list li.area-list-item') - ] == [ - 'England remove', - 'Scotland remove', - ] + ] == areas_listed assert len(page.select('#map')) == 1 assert [ normalize_spaces(item.text) for item in page.select('ul li.area-key') - ] == [ - 'An area of 176,714.9 square miles Will get the alert (44,000,000 phones)', - 'An extra area of 3,052.8 square miles is Likely to get the alert (800,000 phones)', - ] + ] == estimates @pytest.mark.parametrize('areas, expected_list', (