diff --git a/docs/_includes/waste/box.svg b/docs/_includes/waste/box.svg new file mode 100644 index 00000000000..d6e5d3cf8b8 --- /dev/null +++ b/docs/_includes/waste/box.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/docs/_includes/waste/communal.svg b/docs/_includes/waste/communal.svg new file mode 100644 index 00000000000..990ced30cc3 --- /dev/null +++ b/docs/_includes/waste/communal.svg @@ -0,0 +1,36 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/_includes/waste/sack-stripe.svg b/docs/_includes/waste/sack-stripe.svg new file mode 100644 index 00000000000..3e3cc7829fa --- /dev/null +++ b/docs/_includes/waste/sack-stripe.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + diff --git a/docs/_includes/waste/sack.svg b/docs/_includes/waste/sack.svg new file mode 100644 index 00000000000..f3e31311ea9 --- /dev/null +++ b/docs/_includes/waste/sack.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + diff --git a/docs/_includes/waste/wheelie.svg b/docs/_includes/waste/wheelie.svg new file mode 100644 index 00000000000..721dbe86334 --- /dev/null +++ b/docs/_includes/waste/wheelie.svg @@ -0,0 +1,46 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/_layouts/wasteworks.html b/docs/_layouts/wasteworks.html index e921f38eee7..676e5e96f6c 100644 --- a/docs/_layouts/wasteworks.html +++ b/docs/_layouts/wasteworks.html @@ -84,6 +84,7 @@
  • Displaying a site message
  • +
  • Container picture generator
  • diff --git a/docs/ww-manual/container-picture-generator.md b/docs/ww-manual/container-picture-generator.md new file mode 100644 index 00000000000..b318d77b9a7 --- /dev/null +++ b/docs/ww-manual/container-picture-generator.md @@ -0,0 +1,105 @@ +--- +layout: wasteworks +title: What is WasteWorks +order: 1 +user-guide: true +category: user-guide +--- + + + +# Container picture generator + +This can be used to test/pick colours to use as WasteWorks container icons on a bin day page. + +
    +
    + +

    Sack

    + +

    + +{% capture svg %} +{% include waste/sack.svg %} +{% endcapture %} + +
    {{ svg }}
    + +
    +
    + +

    Sack, with stripe

    + +

    + +{% capture svg %} +{% include waste/sack-stripe.svg %} +{% endcapture %} + +
    {{ svg }}
    + +
    +
    + +
    +
    + +

    Wheelie bin

    + +

    + + + +

    + +{% capture svg %} +{% include waste/wheelie.svg %} +{% endcapture %} + +
    {{ svg }}
    + +
    +
    + +

    Communal bin

    + +

    + + + +

    + +{% capture svg %} +{% include waste/communal.svg %} +{% endcapture %} + +
    {{ svg }}
    + +
    +
    + +## Box + + + + +{% capture svg %} +{% include waste/box.svg %} +{% endcapture %} + +
    {{ svg }}
    + + diff --git a/perllib/FixMyStreet/Cobrand/Bexley/Waste.pm b/perllib/FixMyStreet/Cobrand/Bexley/Waste.pm index f924c0156ca..3b7b5b64983 100644 --- a/perllib/FixMyStreet/Cobrand/Bexley/Waste.pm +++ b/perllib/FixMyStreet/Cobrand/Bexley/Waste.pm @@ -1,6 +1,7 @@ package FixMyStreet::Cobrand::Bexley::Waste; use Moo::Role; +with 'FixMyStreet::Roles::Cobrand::Waste'; use BexleyAddresses; use Integrations::Whitespace; diff --git a/perllib/FixMyStreet/Cobrand/Brent.pm b/perllib/FixMyStreet/Cobrand/Brent.pm index dc6fe5cbc3f..37534d65aea 100644 --- a/perllib/FixMyStreet/Cobrand/Brent.pm +++ b/perllib/FixMyStreet/Cobrand/Brent.pm @@ -14,6 +14,7 @@ use parent 'FixMyStreet::Cobrand::UKCouncils'; use Moo; # We use the functionality of bulky waste, though it's called small items +with 'FixMyStreet::Roles::Cobrand::Waste'; with 'FixMyStreet::Roles::Cobrand::BulkyWaste'; use strict; @@ -1182,15 +1183,15 @@ sub image_for_unit { my $base = '/i/waste-containers'; my $images = { - 262 => "$base/bin-grey", - 265 => "$base/bin-grey-blue-lid-recycling", + 262 => svg_container_bin("wheelie", '#767472'), + 265 => svg_container_bin("wheelie", '#767472', '#00A6D2', 1), 316 => "$base/caddy-green-recycling", - 317 => "$base/bin-green", - 263 => "$base/large-communal-black", - 266 => "$base/large-communal-blue-recycling", - 271 => "$base/bin-brown", - 267 => "$base/sack-black", - 269 => "$base/sack-clear", + 317 => svg_container_bin("wheelie", '#41B28A'), + 263 => svg_container_bin("communal", '#333333'), + 266 => svg_container_bin("communal", '#00A6D2', undef, 1), + 271 => svg_container_bin("wheelie", '#8B5E3D'), + 267 => svg_container_sack("normal", '#333333'), + 269 => svg_container_sack("normal", '#d8d8d8'), 807 => "$base/bag-blue", bulky => "$base/electricals-batteries-textiles", }; diff --git a/perllib/FixMyStreet/Cobrand/Bromley.pm b/perllib/FixMyStreet/Cobrand/Bromley.pm index b9aaafb0db5..5832108387f 100644 --- a/perllib/FixMyStreet/Cobrand/Bromley.pm +++ b/perllib/FixMyStreet/Cobrand/Bromley.pm @@ -16,6 +16,7 @@ with 'FixMyStreet::Roles::Cobrand::Echo'; with 'FixMyStreet::Roles::Cobrand::Pay360'; with 'FixMyStreet::Roles::Open311Multi'; with 'FixMyStreet::Roles::Cobrand::SCP'; +with 'FixMyStreet::Roles::Cobrand::Waste'; with 'FixMyStreet::Roles::Cobrand::BulkyWaste'; sub council_area_id { return [2482]; } @@ -445,8 +446,8 @@ sub image_for_unit { my $service_id = $unit->{service_id}; my $base = '/i/waste-containers'; my $images = { - 531 => "$base/sack-black", - 532 => "$base/sack-black", + 531 => svg_container_sack("normal", '#333333'), + 532 => svg_container_sack("normal", '#333333'), 533 => "$base/large-communal-grey-black-lid", 535 => "$base/box-green-mix", 536 => "$base/bin-grey-green-lid-recycling", diff --git a/perllib/FixMyStreet/Cobrand/Kingston.pm b/perllib/FixMyStreet/Cobrand/Kingston.pm index b69ffe54244..95cbd9ad556 100644 --- a/perllib/FixMyStreet/Cobrand/Kingston.pm +++ b/perllib/FixMyStreet/Cobrand/Kingston.pm @@ -3,6 +3,7 @@ use parent 'FixMyStreet::Cobrand::UKCouncils'; use utf8; use Moo; +with 'FixMyStreet::Roles::Cobrand::Waste'; with 'FixMyStreet::Roles::Cobrand::KingstonSutton'; with 'FixMyStreet::Roles::Cobrand::SCP'; @@ -40,7 +41,7 @@ sub image_for_unit { my ($self, $unit) = @_; my $base = '/i/waste-containers'; if (my $container = $unit->{garden_container}) { - return "$base/bin-grey-green-lid-recycling" if $container == 26 || $container == 27; + return svg_container_bin('wheelie', '#767472', '#41B28A', 1) if $container == 26 || $container == 27; return ""; } @@ -50,22 +51,22 @@ sub image_for_unit { # Base mixed recycling (2241) on the container itself my %containers = map { $_ => 1 } @{$unit->{request_containers}}; - return "$base/bin-green" if $containers{+CONTAINER_RECYCLING_BIN}; + return svg_container_bin("wheelie", '#41B28A') if $containers{+CONTAINER_RECYCLING_BIN}; return "$base/box-green-mix" if $containers{+CONTAINER_RECYCLING_BOX}; my $service_id = $unit->{service_id}; my $images = { - 2238 => "$base/bin-black", # refuse + 2238 => svg_container_bin('wheelie', '#333333'), # refuse 2239 => "$base/caddy-brown-large", # food - 2240 => "$base/bin-grey-blue-lid-recycling", # paper and card - 2241 => "$base/bin-green", # dry mixed - 2242 => "$base/sack-clear-red", # domestic refuse bag - 2243 => "$base/large-communal-grey-black-lid", # Communal refuse - 2246 => "$base/sack-clear-blue", # domestic recycling bag - 2248 => "$base/bin-brown", # Communal food - 2249 => "$base/large-communal-grey-blue-lid", # Communal paper - 2250 => "$base/large-communal-green", # Communal recycling - 2632 => "$base/sack-clear", # domestic paper bag + 2240 => svg_container_bin("wheelie", '#767472', '#00A6D2', 1), # paper and card + 2241 => svg_container_bin("wheelie", '#41B28A'), # dry mixed + 2242 => svg_container_sack('stripe', '#E83651'), # domestic refuse bag + 2243 => svg_container_bin('communal', '#767472', '#333333'), # Communal refuse + 2246 => svg_container_sack('stripe', '#4f4cf0'), # domestic recycling bag + 2248 => svg_container_bin('wheelie', '#8B5E3D'), # Communal food + 2249 => svg_container_bin("communal", '#767472', '#00A6D2'), # Communal paper + 2250 => svg_container_bin('communal', '#41B28A'), # Communal recycling + 2632 => svg_container_sack('normal', '#d8d8d8'), # domestic paper bag }; return $images->{$service_id}; } diff --git a/perllib/FixMyStreet/Cobrand/Peterborough.pm b/perllib/FixMyStreet/Cobrand/Peterborough.pm index 25e82ba4b24..dbdb7b70ce0 100644 --- a/perllib/FixMyStreet/Cobrand/Peterborough.pm +++ b/perllib/FixMyStreet/Cobrand/Peterborough.pm @@ -31,6 +31,7 @@ with 'FixMyStreet::Roles::ConfirmOpen311'; with 'FixMyStreet::Roles::ConfirmValidation'; with 'FixMyStreet::Roles::Open311Multi'; with 'FixMyStreet::Roles::Cobrand::SCP'; +with 'FixMyStreet::Roles::Cobrand::Waste'; with 'FixMyStreet::Cobrand::Peterborough::Bulky'; =head2 Defaults @@ -591,9 +592,9 @@ sub image_for_unit { my $service_id = $unit->{service_id}; my $base = '/i/waste-containers'; my $images = { - 6533 => "$base/bin-black", - 6534 => "$base/bin-green", - 6579 => "$base/bin-brown", + 6533 => svg_container_bin('wheelie', '#333333'), + 6534 => svg_container_bin("wheelie", '#41B28A'), + 6579 => svg_container_bin("wheelie", '#8B5E3D'), bulky => "$base/bulky-white", }; return $images->{$service_id}; diff --git a/perllib/FixMyStreet/Cobrand/Sutton.pm b/perllib/FixMyStreet/Cobrand/Sutton.pm index 8f57fb1c60d..7af61a47627 100644 --- a/perllib/FixMyStreet/Cobrand/Sutton.pm +++ b/perllib/FixMyStreet/Cobrand/Sutton.pm @@ -3,6 +3,7 @@ use parent 'FixMyStreet::Cobrand::UKCouncils'; use utf8; use Moo; +with 'FixMyStreet::Roles::Cobrand::Waste'; with 'FixMyStreet::Roles::Cobrand::KingstonSutton'; with 'FixMyStreet::Roles::Cobrand::SCP'; @@ -68,7 +69,7 @@ sub image_for_unit { my ($self, $unit) = @_; my $base = '/i/waste-containers'; if (my $container = $unit->{garden_container}) { - return "$base/bin-green-brown-lid" if $container == 26 || $container == 27; + return svg_container_bin("wheelie", '#41B28A', '#8B5E3D') if $container == 26 || $container == 27; return ""; } if (my $container = $unit->{request_containers}[0]) { @@ -80,20 +81,20 @@ sub image_for_unit { } if ($service_id == 2243 && $unit->{schedule} =~ /fortnight/i) { # Communal fortnightly is a wheelie bin, not a large bin - return "$base/bin-brown"; + return svg_container_bin('wheelie', '#8B5E3D'); } my $images = { - 2238 => "$base/bin-brown", # refuse + 2238 => svg_container_bin('wheelie', '#8B5E3D'), # refuse 2239 => "$base/caddy-brown-large", # food - 2240 => "$base/bin-green", # paper and card + 2240 => svg_container_bin('wheelie', '#41B28A'), # paper and card 2241 => "$base/box-green-mix", # dry mixed - 2242 => "$base/sack-clear-red", # domestic refuse bag - 2243 => "$base/large-communal-grey-black-lid", # Communal refuse - 2246 => "$base/sack-clear-blue", # domestic recycling bag - 2248 => "$base/bin-brown", # Communal food - 2249 => "$base/bin-grey-blue-lid-recycling", # Communal paper - 2250 => "$base/large-communal-green", # Communal recycling - 2632 => "$base/sack-clear", # domestic paper bag + 2242 => svg_container_sack('stripe', '#E83651'), # domestic refuse bag + 2243 => svg_container_bin('communal', '#767472', '#333333'), # Communal refuse + 2246 => svg_container_sack('stripe', '#4f4cf0'), # domestic recycling bag + 2248 => svg_container_bin('wheelie', '#8B5E3D'), # Communal food + 2249 => svg_container_bin("wheelie", '#767472', '#00A6D2', 1), # Communal paper + 2250 => svg_container_bin('communal', '#41B28A'), # Communal recycling + 2632 => svg_container_sack('normal', '#d8d8d8'), # domestic paper bag }; return $images->{$service_id}; } diff --git a/perllib/FixMyStreet/Roles/Cobrand/Waste.pm b/perllib/FixMyStreet/Roles/Cobrand/Waste.pm new file mode 100644 index 00000000000..dc03405fa8a --- /dev/null +++ b/perllib/FixMyStreet/Roles/Cobrand/Waste.pm @@ -0,0 +1,58 @@ +=head1 NAME + +FixMyStreet::Roles::Cobrand::Waste - cobrand functions shared with all waste clients + +=cut + +package FixMyStreet::Roles::Cobrand::Waste; + +use Moo::Role; +use Path::Tiny; + +=head2 svg_container_sack + +TYPE is either 'normal' or 'stripe'. + +=cut + +sub svg_container_sack { + my ($type, $colour) = @_; + my $dir = path(FixMyStreet->path_to("web/i/waste-containers")); + $type = ($type eq 'stripe') ? 'sack-stripe' : 'sack'; + return { + type => 'svg', + data => $dir->child("$type.svg")->slurp_raw, + colour => $colour, + }; +} + +=head2 svg_container_bin + +TYPE is either 'wheelie' or 'communal'. + +=cut + +sub svg_container_bin { + my ($type, $colour_main, $colour_lid, $recycling_logo) = @_; + my $dir = path(FixMyStreet->path_to("web/i/waste-containers")); + return { + type => 'svg', + data => $dir->child("$type.svg")->slurp_raw, + colour => $colour_main, + lid_colour => $colour_lid, + recycling_logo => $recycling_logo, + }; +} + +sub svg_container_box { + my ($colour, $recycling_logo) = @_; + my $dir = path(FixMyStreet->path_to("web/i/waste-containers")); + return { + type => 'svg', + data => $dir->child("box.svg")->slurp_raw, + colour => $colour, + recycling_logo => $recycling_logo, + }; +} + +1; diff --git a/templates/web/base/waste/bin_days.html b/templates/web/base/waste/bin_days.html index c97158f103e..5efd9d6e0a7 100644 --- a/templates/web/base/waste/bin_days.html +++ b/templates/web/base/waste/bin_days.html @@ -64,7 +64,12 @@

    [% IF c.cobrand.moniker == 'peterborough' %]

    [% unit.service_name %]

    [% END %] - [% IF c.cobrand.waste_images_2x_unavailable %] + [% IF image.type == 'svg' %] + [% image.data.replace(' + [% ELSIF c.cobrand.waste_images_2x_unavailable %] [% ELSE %] diff --git a/web/i/waste-containers/bin-black.png b/web/i/waste-containers/bin-black.png deleted file mode 100644 index f663e677cb3..00000000000 Binary files a/web/i/waste-containers/bin-black.png and /dev/null differ diff --git a/web/i/waste-containers/bin-black@2x.png b/web/i/waste-containers/bin-black@2x.png deleted file mode 100644 index f663e677cb3..00000000000 Binary files a/web/i/waste-containers/bin-black@2x.png and /dev/null differ diff --git a/web/i/waste-containers/bin-brown.png b/web/i/waste-containers/bin-brown.png deleted file mode 100644 index 9544d87d794..00000000000 Binary files a/web/i/waste-containers/bin-brown.png and /dev/null differ diff --git a/web/i/waste-containers/bin-brown@2x.png b/web/i/waste-containers/bin-brown@2x.png deleted file mode 100644 index 9544d87d794..00000000000 Binary files a/web/i/waste-containers/bin-brown@2x.png and /dev/null differ diff --git a/web/i/waste-containers/bin-grey.png b/web/i/waste-containers/bin-grey.png deleted file mode 100644 index c17a7d5dd16..00000000000 Binary files a/web/i/waste-containers/bin-grey.png and /dev/null differ diff --git a/web/i/waste-containers/bin-grey@2x.png b/web/i/waste-containers/bin-grey@2x.png deleted file mode 100644 index e075ff1fe85..00000000000 Binary files a/web/i/waste-containers/bin-grey@2x.png and /dev/null differ diff --git a/web/i/waste-containers/box.svg b/web/i/waste-containers/box.svg new file mode 100644 index 00000000000..d6e5d3cf8b8 --- /dev/null +++ b/web/i/waste-containers/box.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/web/i/waste-containers/communal.svg b/web/i/waste-containers/communal.svg new file mode 100644 index 00000000000..990ced30cc3 --- /dev/null +++ b/web/i/waste-containers/communal.svg @@ -0,0 +1,36 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/web/i/waste-containers/large-communal-black.png b/web/i/waste-containers/large-communal-black.png deleted file mode 100644 index 2b0b96f239f..00000000000 Binary files a/web/i/waste-containers/large-communal-black.png and /dev/null differ diff --git a/web/i/waste-containers/large-communal-black@2x.png b/web/i/waste-containers/large-communal-black@2x.png deleted file mode 100644 index cde929f377e..00000000000 Binary files a/web/i/waste-containers/large-communal-black@2x.png and /dev/null differ diff --git a/web/i/waste-containers/large-communal-blue-recycling.png b/web/i/waste-containers/large-communal-blue-recycling.png deleted file mode 100644 index 32a9b685d2f..00000000000 Binary files a/web/i/waste-containers/large-communal-blue-recycling.png and /dev/null differ diff --git a/web/i/waste-containers/large-communal-blue-recycling@2x.png b/web/i/waste-containers/large-communal-blue-recycling@2x.png deleted file mode 100644 index 4ed56e609c9..00000000000 Binary files a/web/i/waste-containers/large-communal-blue-recycling@2x.png and /dev/null differ diff --git a/web/i/waste-containers/large-communal-green.png b/web/i/waste-containers/large-communal-green.png deleted file mode 100644 index ba45da74770..00000000000 Binary files a/web/i/waste-containers/large-communal-green.png and /dev/null differ diff --git a/web/i/waste-containers/large-communal-green@2x.png b/web/i/waste-containers/large-communal-green@2x.png deleted file mode 100644 index 8077589a583..00000000000 Binary files a/web/i/waste-containers/large-communal-green@2x.png and /dev/null differ diff --git a/web/i/waste-containers/large-communal-grey-blue-lid.png b/web/i/waste-containers/large-communal-grey-blue-lid.png deleted file mode 100644 index cb6d6e194b0..00000000000 Binary files a/web/i/waste-containers/large-communal-grey-blue-lid.png and /dev/null differ diff --git a/web/i/waste-containers/large-communal-grey-blue-lid@2x.png b/web/i/waste-containers/large-communal-grey-blue-lid@2x.png deleted file mode 100644 index 2ed941daaf8..00000000000 Binary files a/web/i/waste-containers/large-communal-grey-blue-lid@2x.png and /dev/null differ diff --git a/web/i/waste-containers/sack-black.png b/web/i/waste-containers/sack-black.png deleted file mode 100644 index 0ecd7956bd3..00000000000 Binary files a/web/i/waste-containers/sack-black.png and /dev/null differ diff --git a/web/i/waste-containers/sack-black@2x.png b/web/i/waste-containers/sack-black@2x.png deleted file mode 100644 index e880b1c4eac..00000000000 Binary files a/web/i/waste-containers/sack-black@2x.png and /dev/null differ diff --git a/web/i/waste-containers/sack-clear-blue.png b/web/i/waste-containers/sack-clear-blue.png deleted file mode 100644 index 3cdc70285f2..00000000000 Binary files a/web/i/waste-containers/sack-clear-blue.png and /dev/null differ diff --git a/web/i/waste-containers/sack-clear-blue@2x.png b/web/i/waste-containers/sack-clear-blue@2x.png deleted file mode 100644 index d3215a14af2..00000000000 Binary files a/web/i/waste-containers/sack-clear-blue@2x.png and /dev/null differ diff --git a/web/i/waste-containers/sack-clear-red.png b/web/i/waste-containers/sack-clear-red.png deleted file mode 100644 index bb88dd427ca..00000000000 Binary files a/web/i/waste-containers/sack-clear-red.png and /dev/null differ diff --git a/web/i/waste-containers/sack-clear-red@2x.png b/web/i/waste-containers/sack-clear-red@2x.png deleted file mode 100644 index 6e58da0e9d8..00000000000 Binary files a/web/i/waste-containers/sack-clear-red@2x.png and /dev/null differ diff --git a/web/i/waste-containers/sack-clear.png b/web/i/waste-containers/sack-clear.png deleted file mode 100644 index c20e48dbef2..00000000000 Binary files a/web/i/waste-containers/sack-clear.png and /dev/null differ diff --git a/web/i/waste-containers/sack-clear@2x.png b/web/i/waste-containers/sack-clear@2x.png deleted file mode 100644 index 61460a47704..00000000000 Binary files a/web/i/waste-containers/sack-clear@2x.png and /dev/null differ diff --git a/web/i/waste-containers/sack-stripe.svg b/web/i/waste-containers/sack-stripe.svg new file mode 100644 index 00000000000..3e3cc7829fa --- /dev/null +++ b/web/i/waste-containers/sack-stripe.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + diff --git a/web/i/waste-containers/sack.svg b/web/i/waste-containers/sack.svg new file mode 100644 index 00000000000..f3e31311ea9 --- /dev/null +++ b/web/i/waste-containers/sack.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + diff --git a/web/i/waste-containers/wheelie.svg b/web/i/waste-containers/wheelie.svg new file mode 100644 index 00000000000..721dbe86334 --- /dev/null +++ b/web/i/waste-containers/wheelie.svg @@ -0,0 +1,46 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +