BCN budgets

Co-authored-by: Vera Rojman <[email protected]>
Co-authored-by: Vera Rojman <[email protected]>
Co-authored-by: Ivan Vergés <[email protected]>
Co-authored-by: decidim-bot <[email protected]>

bcn-budget-v0.24 to 0.24-stable-bcn (#12)

Fix modal pop up when project exceeds budget amount (#13)


Check amount in add to order command (#14)


Fix 'Add line command' (#15)


Restyle project vote button (#16)


Change literal of button when budget is voted (#17)


show loading spinner only if no modals will open

Fix voted budgets and title bar hidden by focus mode (#18)

decidim-budgets/app/cells/decidim/budgets/budget_information_modal/show.erb

@@ -1,28 +1,10 @@
-<button class="link" data-open="budget-modal-info" aria-controls="budget-modal-info" aria-haspopup="true" tabindex="0">
-  <%= t(:more_information, scope: i18n_scope) %>
-</button>
-
-<div class="reveal" data-reveal id="budget-modal-info">
-  <div class="reveal__header">
-    <h3 class="reveal__title"><%= decidim_sanitize(component_name) %></h3>
-    <button class="close-button" data-close aria-label="<%= t(:close_modal, scope: i18n_scope) %>" type="button">
-      <span aria-hidden="true">×</span>
-    </button>
-  </div>
-
-  <%= content_tag(:p, more_information) if more_information %>
-
-  <% unless current_workflow.single? %>
-    <p>
-      <%= link_to t(:back_to, scope: i18n_scope, component_name: component_name), budgets_path %>
-    </p>
-  <% end %>
-
-  <div class="row">
-    <div class="columns medium-8 medium-offset-2">
-      <button class="button expanded" data-close>
-        <%= t(:continue, scope: i18n_scope) %>
-      </button>
-    </div>
+<% if more_information %>
+  <button data-toggle="budget-modal-info">
+    <%= t("more_information", scope: i18n_scope) %>
+    <%= icon("caret-bottom", class:"icon--small", aria_label: t("more_information", scope: i18n_scope), role: "img") %>
+  </button>
+
+  <div class="hide" data-toggler=".hide" id="budget-modal-info">
+    <%= content_tag(:p, more_information) %>
   </div>
-</div>
+<% end %>

decidim-budgets/app/cells/decidim/budgets/budget_information_modal_cell.rb

@@ -7,7 +7,7 @@ class BudgetInformationModalCell < BaseCell
       alias budget model
 
       def more_information
-        translated_attribute(current_settings.more_information_modal).presence || translated_attribute(settings.more_information_modal)
+        translated_attribute(current_settings.more_information_modal).presence || translated_attribute(settings.more_information_modal).presence
       end
 
       def component_name

decidim-budgets/app/cells/decidim/budgets/budget_list_item/show.erb

@@ -1,22 +1,38 @@
-<div class="<%= card_class %>">
-  <div class="card--list__text">
+<div class="<%= card_class %> budget-list__item budget-list__item-cell">
+  <div class="budget-list__text flex-horizontal">
     <%= link_to budget_path(budget), class: link_class do %>
-      <% if voted? && !voting_finished? %>
-        <strong>
-          <%= translated_attribute(title) %>
-        </strong>
-        <span class="button tiny success card--list__check card--list__check--disabled">
-          <%= icon "check", class: "icon--small", role: "img", aria_label: t("decidim.budgets.budget_list_item.voting_finished") %>
-        </span>
-      <% else %>
+      <h5 class="card--list__heading">
         <%= translated_attribute(title) %>
+      </h5>
+    <% end %>
+
+    <h5>
+      <strong>
+        <%= budget_to_currency(total_budget) %>
+      </strong>
+    </h5>
+
+    <%= decidim_sanitize html_truncate(translated_attribute(description), length: 140) %>
+  </div>
 
-        <% if progress? && !voting_finished? %>
-          <span class="button tiny hollow secondary card--list__check card--list__check--disabled">
-            <%= icon "bookmark", class: "icon--small", role: "img", aria_label: t("decidim.budgets.budget_list_item.voting_started") %>
-          </span>
-        <% end %>
+  <% if !voting_finished? %>
+    <div class="budget-list__icon mr-s">
+      <% if voted? %>
+        <span class="button tiny success card--list__check card--list__check--disabled card--list__check--inline">
+          <%= icon "check", class: "icon--small", role: "img", aria_label: t("decidim.budgets.budget_list_item.voting_finished") %>
+        </span>
+      <% elsif progress? %>
+        <span class="button tiny warning card--list__check card--list__check--disabled card--list__check--inline">
+          <%= icon "bookmark", class: "icon--small", role: "img", aria_label: t("decidim.budgets.budget_list_item.voting_started") %>
+        </span>
       <% end %>
+    </div>
+  <% end %>
+
+  <div class="budget-list__data">
+    <%= link_to budget_path(budget), class: "button button--sc expanded #{button_class} mb-none" do %>
+      <span><%= button_text %></span>
+      <%= icon "chevron-right", class: "icon--small", role: "img" %>
     <% end %>
   </div>
 </div>

decidim-budgets/app/cells/decidim/budgets/budget_list_item_cell.rb

@@ -4,9 +4,14 @@ module Decidim
   module Budgets
     # This cell renders the budget item list in the budgets list
     class BudgetListItemCell < BaseCell
+      include Decidim::SanitizeHelper
+      include Decidim::ApplicationHelper
+      include Decidim::Budgets::ProjectsHelper
+
       delegate :voting_finished?, to: :controller
+      delegate :highlighted, to: :current_workflow
 
-      property :title
+      property :title, :description, :total_budget
       alias budget model
 
       private
@@ -17,6 +22,7 @@ def card_class
             list << "card--list__data-added" if voted?
             list << "card--list__data-progress" if progress?
           end
+          list << "budget--highlighted" if highlighted?
         end.join(" ")
       end
 
@@ -32,9 +38,31 @@ def progress?
         current_user && status == :progress
       end
 
+      def highlighted?
+        highlighted.include?(budget)
+      end
+
       def status
         @status ||= current_workflow.status(budget)
       end
+
+      def button_class
+        "hollow" if voted? || !highlighted?
+      end
+
+      def button_text
+        key = if current_workflow.vote_allowed?(budget) && !voted?
+                progress? ? :progress : :vote
+              else
+                :show
+              end
+
+        t(key, scope: i18n_scope)
+      end
+
+      def i18n_scope
+        "decidim.budgets.budgets_list"
+      end
     end
   end
 end

decidim-budgets/app/cells/decidim/budgets/budget_m_cell.rb

@@ -5,7 +5,6 @@ module Budgets
     # This cell renders the Medium (:m) budget card
     # for an given instance of a Decidim::Budgets::Budget
     class BudgetMCell < Decidim::CardMCell
-      include ActiveSupport::NumberHelper
       include Decidim::Budgets::ProjectsHelper
 
       def statuses

decidim-budgets/app/cells/decidim/budgets/budgets_header/show.erb

@@ -1,7 +1,3 @@
-<div class="row">
-  <div class="columns medium-7 mediumlarge-8">
-    <div class="section">
-      <%= decidim_sanitize(landing_page_content) %>
-    </div>
-  </div>
+<div class="section">
+  <%= decidim_sanitize(landing_page_content) %>
 </div>

decidim-budgets/app/cells/decidim/budgets/budgets_header_cell.rb

@@ -9,6 +9,10 @@ class BudgetsHeaderCell < BaseCell
       def landing_page_content
         translated_attribute(current_settings.landing_page_content).presence || translated_attribute(settings.landing_page_content)
       end
+
+      def landing_page_instructions
+        translated_attribute(current_settings.landing_page_instructions).presence || translated_attribute(settings.landing_page_instructions)
+      end
     end
   end
 end

decidim-budgets/app/cells/decidim/budgets/budgets_list/card_list.erb

@@ -1,7 +1,18 @@
-<div id="budgets" class="card card--list card--list--mini">
-  <% budgets.each do |budget| %>
-    <% next if highlighted.include?(budget) && !voting_finished? %>
+<%# show highlighted budgets first %>
+<% if highlighted.any? %>
+  <div id="highlighted-budgets" class="card card--list budget-list">
+    <% highlighted.each do |budget| %>
+      <%= cell("decidim/budgets/budget_list_item", budget) %>
+    <% end %>
+  </div>
+<% end %>
 
-    <%= cell("decidim/budgets/budget_list_item", budget) %>
-  <% end %>
-</div>
+<% non_highlighted = (budgets - highlighted - voted) %>
+
+<% if non_highlighted.any? %>
+  <div id="budgets" class="card card--list budget-list">
+    <% non_highlighted.each do |budget| %>
+      <%= cell("decidim/budgets/budget_list_item", budget) %>
+    <% end %>
+  </div>
+<% end %>

decidim-budgets/app/cells/decidim/budgets/budgets_list/show.erb

@@ -1,20 +1,15 @@
-<div class="row">
-  <div class="columns medium-7 mediumlarge-8">
-    <% if !voting_finished? && (highlighted? || voted?) %>
-      <div class="section">
-        <h3 class="section-heading">
-          <%= t(:my_budgets, scope: i18n_scope) %>
-        </h3>
+<% if voted? %>
+  <div class="section">
+    <h3 class="section-heading">
+      <%= t(:my_budgets, scope: i18n_scope) %>
+    </h3>
 
-        <%= render :highlighted %>
-        <%= render :voted %>
-      </div>
-    <% end %>
+    <%= render :voted %>
+  </div>
+<% end %>
 
-    <div class="row">
-      <div class="columns mediumlarge-6">
-        <%= render :card_list %>
-      </div>
-    </div>
+<div class="row">
+  <div class="columns mediumlarge-12">
+    <%= render :card_list %>
   </div>
 </div>

decidim-budgets/app/cells/decidim/budgets/budgets_list/voted.erb

@@ -4,6 +4,12 @@
       <%= t(:voted_on, scope: i18n_scope, links: budgets_link_list(voted)) %>
     </p>
 
+    <div id="voted-budgets" class="card card--list budget-list">
+      <% voted.each do |budget| %>
+        <%= cell("decidim/budgets/budget_list_item", budget) %>
+      <% end %>
+    </div>
+
     <% if finished? %>
       <p class="lead">
         <%= t(:finished_message, scope: i18n_scope) %>

decidim-budgets/app/cells/decidim/budgets/project_list_item/project_data.erb

@@ -14,6 +14,6 @@
       <%= cell("decidim/budgets/project_voted_hint", model, class: "display-block margin-top-1") if current_order_checked_out? && resource_added? %>
     </span>
 
-    <%= render :project_data_vote_button if !current_order_checked_out? && voting_open? %>
+    <%= cell("decidim/budgets/project_vote_button", model) if !current_order_checked_out? && voting_open? %>
   <% end %>
 </div>

decidim-budgets/app/cells/decidim/budgets/project_list_item/project_text.erb

@@ -12,6 +12,12 @@
       <%= cell "decidim/budgets/project_tags", model, context: { extra_classes: ["tags--project"] } %>
     </div>
 
+    <% unless voting_finished? %>
+      <div class="hide-for-medium">
+        <%= budget_to_currency(model.budget_amount) %>
+      </div>
+    <% end %>
+
     <div class="budget-list__data__number budget-list__number hide-for-medium">
       <%= cell("decidim/budgets/project_votes_count",
       model,

decidim-budgets/app/cells/decidim/budgets/project_list_item_cell.rb

@@ -5,7 +5,6 @@ module Budgets
     # This cell renders a horizontal project card
     # for an given instance of a Project in a budget list
     class ProjectListItemCell < Decidim::ViewModel
-      include ActiveSupport::NumberHelper
       include Decidim::LayoutHelper
       include Decidim::ActionAuthorizationHelper
       include Decidim::Budgets::ProjectsHelper

decidim-budgets/app/cells/decidim/budgets/project_m_cell.rb

@@ -5,7 +5,6 @@ module Budgets
     # This cell renders the Medium (:m) project card
     # for an given instance of a Project
     class ProjectMCell < Decidim::CardMCell
-      include ActiveSupport::NumberHelper
       include Decidim::Budgets::ProjectsHelper
 
       private

decidim-budgets/app/cells/decidim/budgets/project_list_item/project_data_vote_button.erb → decidim-budgets/app/cells/decidim/budgets/project_vote_button/show.erb

@@ -3,12 +3,13 @@
       method: vote_button_method,
       remote: true,
       class: "button tiny budget-list__action #{vote_button_class}",
+      id: "project-vote-button-#{model.id}",
       data: {
         add: !resource_added?,
         disable: true,
         budget: model.budget_amount,
         allocation: resource_allocation,
-        "redirect-url": resource_path
+        "redirect-url": budget_projects_path(model.budget)
       },
       disabled: vote_button_disabled?,
       title: vote_button_label do %>

decidim-budgets/app/cells/decidim/budgets/project_vote_button_cell.rb

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+module Decidim
+  module Budgets
+    # This cell renders an authorized_action button
+    # to vote a given instance of a Project in a budget list
+    class ProjectVoteButtonCell < ProjectListItemCell
+    end
+  end
+end

decidim-budgets/app/commands/decidim/budgets/add_line_item.rb

@@ -23,7 +23,7 @@ def initialize(current_order, project, current_user)
       # Returns nothing.
       def call
         transaction do
-          return broadcast(:invalid) if voting_not_enabled? || order.checked_out?
+          return broadcast(:invalid) if voting_not_enabled? || order.checked_out? || exceeds_budget?
 
           add_line_item
           broadcast(:ok, order)
@@ -44,6 +44,10 @@ def add_line_item
         end
       end
 
+      def exceeds_budget?
+        order.allocation_for(project) + order.total > order.available_allocation
+      end
+
       def voting_not_enabled?
         project.component.current_settings.votes != "enabled"
       end

decidim-budgets/app/controllers/decidim/budgets/application_controller.rb

@@ -8,6 +8,7 @@ module Budgets
     # Note that it inherits from `Decidim::Components::BaseController`, which
     # override its layout and provide all kinds of useful methods.
     class ApplicationController < Decidim::Components::BaseController
+      helper Decidim::FocusModeHelper
       helper_method :current_workflow, :voting_finished?, :voting_open?
 
       def current_workflow

decidim-budgets/app/controllers/decidim/budgets/line_items_controller.rb

@@ -20,7 +20,7 @@ def create
             end
 
             on(:invalid) do
-              render nothing: true, status: :unprocessable_entity
+              format.js { render "update_budget", status: :unprocessable_entity }
             end
           end
         end
@@ -35,7 +35,7 @@ def destroy
             end
 
             on(:invalid) do
-              render nothing: true, status: :unprocessable_entity
+              format.js { render "update_budget", status: :unprocessable_entity }
             end
           end
         end

decidim-budgets/app/helpers/decidim/budgets/projects_helper.rb

@@ -4,6 +4,8 @@ module Decidim
   module Budgets
     # A helper to render order and budgets actions
     module ProjectsHelper
+      include ActiveSupport::NumberHelper
+
       # Render a budget as a currency
       #
       # budget - A integer to represent a budget
@@ -13,7 +15,7 @@ def budget_to_currency(budget)
 
       # Return a percentage of the current order budget from the total budget
       def current_order_budget_percent
-        current_order&.budget_percent.to_f.floor
+        current_order&.budget_percent.to_f.floor.clamp(0, 100)
       end
 
       # Return the minimum percentage of the current order budget from the total budget