Ability to attach an image to budgets

Co-authored-by: decabeza <alberto@decabeza.es>

app/assets/stylesheets/admin/budgets/form.scss

@@ -1,5 +1,12 @@
 .admin .budgets-form {
   @include full-width-form;
+  @include direct-uploads;
+
+  .button {
+    &.upload-image {
+      margin-bottom: $line-height / 2;
+    }
+  }
 
   > fieldset {
     border-top: 4px solid $admin-border-color;

app/assets/stylesheets/participation.scss

@@ -1136,6 +1136,12 @@
   padding-bottom: $line-height;
   padding-top: $line-height * 4;
 
+  &.with-background-image {
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: cover;
+  }
+
   .budget-title {
     font-weight: bold;
     text-transform: uppercase;

app/components/admin/budgets/form_component.html.erb

@@ -36,6 +36,13 @@
         <%= f.select :currency_symbol, currency_symbol_select_options %>
       </div>
     </div>
+
+    <% if feature?(:allow_images) %>
+      <div class="images small-12 column">
+        <%= render "/images/nested_image", imageable: budget, f: f %>
+        <p class="help-text"><%= t("admin.budgets.edit.image_description") %></p>
+      </div>
+    <% end %>
   </fieldset>
 
   <fieldset>

app/components/budgets/budget_component.html.erb

@@ -1,4 +1,9 @@
-<div class="budget-header">
+<% if budget.image.present? %>
+  <div class="budget-header with-background-image"
+       style="background-image: url(<%= asset_url budget.image.attachment.url(:large) %>);">
+<% else %>
+  <div class="budget-header">
+<% end %>
   <div class="row">
     <div class="small-12 column text-center">
       <span class="budget-title"><%= t("budgets.index.title") %></span>

app/controllers/admin/budgets_controller.rb

@@ -1,6 +1,7 @@
 class Admin::BudgetsController < Admin::BaseController
   include Translatable
   include ReportAttributes
+  include ImageAttributes
   include FeatureFlags
   feature_flag :budgets
 
@@ -63,7 +64,8 @@ class Admin::BudgetsController < Admin::BaseController
                           :voting_style,
                           :main_link_url,
                           administrator_ids: [],
-                          valuator_ids: []
+                          valuator_ids: [],
+                          image_attributes: image_attributes
       ] + descriptions
       params.require(:budget).permit(*valid_attributes, *report_attributes, translation_params(Budget))
     end

app/controllers/admin/budgets_wizard/budgets_controller.rb

@@ -1,5 +1,6 @@
 class Admin::BudgetsWizard::BudgetsController < Admin::BaseController
   include Translatable
+  include ImageAttributes
   include FeatureFlags
   feature_flag :budgets
 
@@ -36,7 +37,8 @@ class Admin::BudgetsWizard::BudgetsController < Admin::BaseController
     end
 
     def allowed_params
-      valid_attributes = [:currency_symbol, :voting_style, administrator_ids: [], valuator_ids: []]
+      valid_attributes = [:currency_symbol, :voting_style, administrator_ids: [], valuator_ids: [],
+                          image_attributes: image_attributes]
 
       valid_attributes + [translation_params(Budget)]
     end

app/models/budget.rb

@@ -3,6 +3,7 @@ class Budget < ApplicationRecord
   include Sluggable
   include StatsVersionable
   include Reportable
+  include Imageable
 
   translates :name, :main_link_text, touch: true
   include Globalizable

config/locales/en/admin.yml

@@ -121,6 +121,7 @@ en:
         empty_administrators: "There are no administrators"
         empty_valuators: "There are no valuators"
         name_description: "This is the name of the participatory budget used on the header and cards whenever it is active"
+        image_description: "If an image is uplodaded it will be used as the banner on top of this participatory budget, otherwise the default color for budgets will be used."
         main_call_to_action: "Main call to action (optional)"
         main_call_to_action_description: "This link will appear on main banner of this participatory budget and encourages your user to perform a specific action like creating a proposal, voting for existing ones, or learn more about the process."
         info:

config/locales/es/admin.yml

@@ -121,6 +121,7 @@ es:
         empty_administrators: "No hay administradores"
         empty_valuators: "No hay evaluadores"
         name_description: "Este es el nombre del presupuesto participativo usado en la cabecera y tarjetas cuando éste está activo"
+        image_description: "Si se proporciona una imagen será usada como fondo del presupuesto, si no el fondo será del color por defecto para los presupuestos."
         main_call_to_action: "Enlace de acción principal (opcional)"
         main_call_to_action_description: "Este enlace aparecerá en la cabecera de este presupuesto participativo y permite al usuario ejecutar una acción específica como crear una nueva propuesta, votar las existentes, o leer más sobre el funcionamiento de los presupuestos participativos."
         info:

spec/shared/system/nested_imageable.rb

@@ -212,7 +212,7 @@ shared_examples "nested imageable" do |imageable_factory_name, path, imageable_p
         # Pending. Review soon and test
       else
         expect(page).to have_selector "figure img"
-        expect(page).to have_selector "figure figcaption"
+        expect(page).to have_selector "figure figcaption" if show_caption_for?(imageable_factory_name)
       end
     end
 
@@ -259,10 +259,12 @@ def do_login_for(user)
 end
 
 def imageable_redirected_to_resource_show_or_navigate_to
-  find("a", text: "Not now, go to my proposal")
+  case imageable.class.to_s
-  click_on "Not now, go to my proposal"
+  when "Budget"
-rescue
+    visit edit_admin_budget_path(Budget.last)
-  nil
+  when "Proposal"
+    click_on "Not now, go to my proposal" rescue Capybara::ElementNotFound
+  end
 end
 
 def imageable_attach_new_file(_imageable_factory_name, path, success = true)
@@ -287,6 +289,10 @@ def imageable_fill_new_valid_proposal
   check :proposal_terms_of_service
 end
 
+def imageable_fill_new_valid_budget
+  fill_in "Name", with: "Budget name"
+end
+
 def imageable_fill_new_valid_budget_investment
   page.select imageable.heading.name_scoped_by_group, from: :budget_investment_heading_id
   fill_in "Title", with: "Budget investment title"
@@ -311,3 +317,7 @@ def expect_image_has_cached_attachment(extension)
     end
   end
 end
+
+def show_caption_for?(imageable_factory_name)
+  imageable_factory_name != "budget"
+end

spec/system/admin/budgets_spec.rb

@@ -1,6 +1,14 @@
 require "rails_helper"
 
 describe "Admin budgets", :admin do
+  it_behaves_like "nested imageable",
+                  "budget",
+                  "new_admin_budgets_wizard_budget_path",
+                  {},
+                  "imageable_fill_new_valid_budget",
+                  "Continue to groups",
+                  "New participatory budget created successfully!"
+
   context "Load" do
     before { create(:budget, slug: "budget_slug") }