Merge pull request #4501 from consul/improve-budget-header

Improve budget header
This commit is contained in:
Javi Martín
2021-06-09 19:50:09 +02:00
committed by GitHub
19 changed files with 366 additions and 187 deletions

View File

@@ -293,6 +293,11 @@ $table-header: #ecf1f6;
}
}
.form-label {
font-weight: bold;
margin-bottom: 0;
}
.menu.simple {
margin-bottom: $line-height / 2;

View File

@@ -1132,8 +1132,28 @@
.budget-header {
@extend %brand-background;
margin-top: -$line-height;
min-height: $line-height * 25;
padding-bottom: $line-height;
padding-top: $line-height;
padding-top: $line-height * 4;
.budget-title {
font-weight: bold;
text-transform: uppercase;
&::after {
border-bottom: 2px solid #fff;
content: "";
margin: 0 auto;
padding-top: $line-height / 2;
display: block;
width: 20%;
}
}
h1 {
font-size: rem-calc(60);
padding: $line-height * 2 0 $line-height;
}
h1,
h2,
@@ -1162,6 +1182,15 @@
text-transform: uppercase;
}
}
.main-link {
@include regular-button($color: rgba(0, 0, 0, 0.5));
font-size: 1.25rem;
margin-bottom: $line-height * 2;
min-width: 30%;
text-decoration: none;
}
}
.jumbo-budget {

View File

@@ -5,19 +5,36 @@
<%= render "shared/errors", resource: budget %>
<%= f.translatable_fields do |translations_form| %>
<div class="small-12 medium-9 large-6 column end">
<%= translations_form.text_field :name,
maxlength: Budget.title_max_length,
hint: t("admin.budgets.edit.name_description") %>
<div class="row expanded">
<div class="small-12 medium-9 large-6 column end">
<%= translations_form.text_field :name,
maxlength: Budget.title_max_length,
hint: t("admin.budgets.edit.name_description") %>
</div>
</div>
<div class="row expanded">
<div class="small-12 medium-9 large-6 column end">
<p class="form-label"><%= t("admin.budgets.edit.main_call_to_action") %></p>
<p class="help-text"> <%= t("admin.budgets.edit.main_call_to_action_description") %></p>
<%= translations_form.text_field :main_link_text %>
</div>
</div>
<% end %>
<div class="small-12 medium-4 column">
<%= f.select :voting_style, voting_styles_select_options %>
<div class="row expanded">
<div class="small-12 medium-9 large-6 column end">
<%= f.text_field :main_link_url, placeholder: t("admin.shared.example_url") %>
</div>
</div>
<div class="small-12 medium-2 column end">
<%= f.select :currency_symbol, currency_symbol_select_options %>
<div class="row expanded">
<div class="small-12 medium-4 column">
<%= f.select :voting_style, voting_styles_select_options %>
</div>
<div class="small-12 medium-2 column end">
<%= f.select :currency_symbol, currency_symbol_select_options %>
</div>
</div>
</fieldset>

View File

@@ -1,10 +1,12 @@
<div class="budget-header">
<div class="row">
<div class="small-12 column">
<div class="small-12 column text-center">
<span class="budget-title"><%= t("budgets.index.title") %></span>
<h1><%= budget.name %></h1>
<div class="description">
<%= auto_link_already_sanitized_html wysiwyg(budget.description) %>
</div>
<% if budget.main_link_text.present? && budget.main_link_url.present? %>
<%= link_to budget.main_link_text, budget.main_link_url, class: "main-link" %>
<% end %>
<p>
<%= link_to t("budgets.index.section_header.help"), "#section_help" %>

View File

@@ -61,6 +61,7 @@ class Admin::BudgetsController < Admin::BaseController
valid_attributes = [:phase,
:currency_symbol,
:voting_style,
:main_link_url,
administrator_ids: [],
valuator_ids: []
] + descriptions

View File

@@ -4,7 +4,7 @@ class Budget < ApplicationRecord
include StatsVersionable
include Reportable
translates :name, touch: true
translates :name, :main_link_text, touch: true
include Globalizable
class Translation
@@ -27,6 +27,7 @@ class Budget < ApplicationRecord
validates :currency_symbol, presence: true
validates :slug, presence: true, format: /\A[a-z0-9\-_]+\z/
validates :voting_style, inclusion: { in: VOTING_STYLES }
validates :main_link_url, presence: true, if: -> { main_link_text.present? }
has_many :investments, dependent: :destroy
has_many :ballots, dependent: :destroy

View File

@@ -160,7 +160,9 @@ en:
voting_style: "Final voting style"
voting_style_knapsack: "Knapsack"
voting_style_approval: "Approval"
main_link_url: "The link takes you to (add a link)"
budget/translation:
main_link_text: "Text on the link"
name: "Name"
budget/investment:
heading_id: "Heading"

View File

@@ -121,6 +121,8 @@ 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"
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:
budget_settings: "General participatory budget settings"
phases_settings: "Phases settings"
@@ -1350,6 +1352,7 @@ en:
color_help: Hexadecimal format
show_results_and_stats: "Show results and stats"
results_and_stats_reminder: "Marking these checkboxes the results and/or stats will be publicly available and every user will see them."
example_url: "https://consulproject.org"
geozones:
index:
title: Geozone

View File

@@ -160,7 +160,9 @@ es:
voting_style: "Estilo de la votación final"
voting_style_knapsack: Bolsa de dinero
voting_style_approval: Por aprobación
main_link_url: "El enlace te lleva a (añade un enlace)"
budget/translation:
main_link_text: "Texto del enlace"
name: "Nombre"
budget/investment:
heading_id: "Partida presupuestaria"

View File

@@ -121,6 +121,8 @@ 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"
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:
budget_settings: "Configuración genérica del presupuesto participativo"
phases_settings: "Configuración de las fases"
@@ -1349,6 +1351,7 @@ es:
color_help: Formato hexadecimal
show_results_and_stats: "Mostrar resultados y estadísticas"
results_and_stats_reminder: "Si marcas estas casillas los resultados y/o estadísticas serán públicos y podrán verlos todos los usuarios."
example_url: "https://consulproject.org"
geozones:
index:
title: Zonas

View File

@@ -0,0 +1,6 @@
class AddMainLinkToBudgets < ActiveRecord::Migration[5.2]
def change
add_column :budgets, :main_link_url, :string
add_column :budget_translations, :main_link_text, :string
end
end

View File

@@ -318,6 +318,7 @@ ActiveRecord::Schema.define(version: 2021_01_23_100638) do
t.datetime "created_at", null: false
t.datetime "updated_at", null: false
t.string "name"
t.string "main_link_text"
t.index ["budget_id"], name: "index_budget_translations_on_budget_id"
t.index ["locale"], name: "index_budget_translations_on_locale"
end
@@ -362,6 +363,7 @@ ActiveRecord::Schema.define(version: 2021_01_23_100638) do
t.text "description_informing"
t.string "voting_style", default: "knapsack"
t.boolean "published"
t.string "main_link_url"
end
create_table "campaigns", id: :serial, force: :cascade do |t|

View File

@@ -0,0 +1,131 @@
require "rails_helper"
describe Budgets::BudgetComponent, type: :component do
let(:budget) { create(:budget) }
let(:heading) { create(:budget_heading, budget: budget) }
let(:user) { create(:user) }
before do
allow(controller).to receive(:current_user).and_return(user)
end
describe "budget header" do
it "shows budget name and link to help" do
budget.update!(phase: "informing")
render_inline Budgets::BudgetComponent.new(budget)
within(".budget-header") do
expect(page).to have_content("PARTICIPATORY BUDGETS")
expect(page).to have_content(budget.name)
expect(page).to have_link("Help with participatory budgets")
end
end
it "shows budget main link when defined" do
render_inline Budgets::BudgetComponent.new(budget)
within(".budget-header") do
expect(page).not_to have_css("a.main-link")
end
budget.update!(main_link_text: "Partitipate now!", main_link_url: "https://consulproject.org")
render_inline Budgets::BudgetComponent.new(budget)
within(".budget-header") do
expect(page).to have_css("a.main-link", text: "Participate now!", href: "https://consulproject.org")
end
end
end
describe "map" do
before do
Setting["feature.map"] = true
end
it "displays investment's map location markers" do
investment1 = create(:budget_investment, heading: heading)
investment2 = create(:budget_investment, heading: heading)
investment3 = create(:budget_investment, heading: heading)
create(:map_location, longitude: 40.1234, latitude: -3.634, investment: investment1)
create(:map_location, longitude: 40.1235, latitude: -3.635, investment: investment2)
create(:map_location, longitude: 40.1236, latitude: -3.636, investment: investment3)
render_inline Budgets::BudgetComponent.new(budget)
within ".map_location" do
expect(page).to have_css(".map-icon", count: 3)
end
end
it "displays all investment's map location if there are no selected" do
budget.update!(phase: :publishing_prices)
investment1 = create(:budget_investment, heading: heading)
investment2 = create(:budget_investment, heading: heading)
investment3 = create(:budget_investment, heading: heading)
investment4 = create(:budget_investment, heading: heading)
investment1.create_map_location(longitude: 40.1234, latitude: 3.1234, zoom: 10)
investment2.create_map_location(longitude: 40.1235, latitude: 3.1235, zoom: 10)
investment3.create_map_location(longitude: 40.1236, latitude: 3.1236, zoom: 10)
investment4.create_map_location(longitude: 40.1240, latitude: 3.1240, zoom: 10)
render_inline Budgets::BudgetComponent.new(budget)
within ".map_location" do
expect(page).to have_css(".map-icon", count: 4)
end
end
it "displays only selected investment's map location from publishing prices phase" do
budget.update!(phase: :publishing_prices)
investment1 = create(:budget_investment, :selected, heading: heading)
investment2 = create(:budget_investment, :selected, heading: heading)
investment3 = create(:budget_investment, heading: heading)
investment4 = create(:budget_investment, heading: heading)
investment1.create_map_location(longitude: 40.1234, latitude: 3.1234, zoom: 10)
investment2.create_map_location(longitude: 40.1235, latitude: 3.1235, zoom: 10)
investment3.create_map_location(longitude: 40.1236, latitude: 3.1236, zoom: 10)
investment4.create_map_location(longitude: 40.1240, latitude: 3.1240, zoom: 10)
render_inline Budgets::BudgetComponent.new(budget)
within ".map_location" do
expect(page).to have_css(".map-icon", count: 2)
end
end
scenario "skips invalid map markers" do
map_locations = []
investment = create(:budget_investment, heading: heading)
map_locations << { longitude: 40.123456789, latitude: 3.12345678 }
map_locations << { longitude: 40.123456789, latitude: "********" }
map_locations << { longitude: "**********", latitude: 3.12345678 }
coordinates = map_locations.map do |map_location|
{
lat: map_location[:latitude],
long: map_location[:longitude],
investment_title: investment.title,
investment_id: investment.id,
budget_id: budget.id
}
end
allow_any_instance_of(Budgets::BudgetComponent).to receive(:coordinates).and_return(coordinates)
render_inline Budgets::BudgetComponent.new(budget)
within ".map_location" do
expect(page).to have_css(".map-icon", count: 1)
end
end
end
end

View File

@@ -0,0 +1,104 @@
require "rails_helper"
describe Budgets::SubheaderComponent, type: :component do
it "shows budget current phase name" do
allow(controller).to receive(:current_user).and_return(create(:user))
budget = create(:budget, :informing)
render_inline Budgets::SubheaderComponent.new(budget)
within(".budget-subheader") do
expect(page).to have_content "CURRENT PHASE"
expect(page).to have_content "Information"
end
end
describe "when budget is accepting" do
let(:budget) { create(:budget, :accepting) }
it "and user is level_two_or_three_verified shows a link to create a new investment" do
allow(controller).to receive(:current_user).and_return(create(:user, :level_two))
render_inline Budgets::SubheaderComponent.new(budget)
expect(page).to have_link "Create a budget investment"
(Budget::Phase::PHASE_KINDS - ["accepting"]).each do |phase|
budget.update!(phase: phase)
budget.reload
render_inline Budgets::SubheaderComponent.new(budget)
expect(page).not_to have_link "Create a budget investment"
end
end
it "and user is not verified shows a link to account verification" do
allow(controller).to receive(:current_user).and_return(create(:user))
render_inline Budgets::SubheaderComponent.new(budget)
expect(page).to have_content "To create a new budget investment"
expect(page).to have_link "verify your account"
(Budget::Phase::PHASE_KINDS - ["accepting"]).each do |phase|
budget.update!(phase: phase)
budget.reload
render_inline Budgets::SubheaderComponent.new(budget)
expect(page).not_to have_content "To create a new budget investment"
expect(page).not_to have_link "verify your account"
end
end
it "and user is not logged in shows links to sign in and sign up" do
allow(controller).to receive(:current_user).and_return(nil)
render_inline Budgets::SubheaderComponent.new(budget)
expect(page).to have_content "To create a new budget investment you must"
expect(page).to have_link "sign in"
expect(page).to have_link "sign up"
(Budget::Phase::PHASE_KINDS - ["accepting"]).each do |phase|
budget.update!(phase: phase)
budget.reload
render_inline Budgets::SubheaderComponent.new(budget)
expect(page).not_to have_content "To create a new budget investment you must"
expect(page).not_to have_link "sign in"
expect(page).not_to have_link "sign up"
end
end
end
describe "See results link" do
it "is showed when budget is finished and results are enabled for all users" do
budget = create(:budget, :finished)
allow(controller).to receive(:current_user).and_return(create(:user))
render_inline Budgets::SubheaderComponent.new(budget)
expect(page).to have_link "See results"
allow(controller).to receive(:current_user).and_return(create(:administrator).user)
render_inline Budgets::SubheaderComponent.new(budget)
expect(page).to have_link "See results"
end
it "is not showed when budget is finished or results are disabled for all users" do
budget = create(:budget, :balloting, results_enabled: true)
allow(controller).to receive(:current_user).and_return(create(:user))
render_inline Budgets::SubheaderComponent.new(budget)
expect(page).not_to have_link "See results"
allow(controller).to receive(:current_user).and_return(create(:administrator).user)
render_inline Budgets::SubheaderComponent.new(budget)
expect(page).not_to have_link "See results"
end
end
end

View File

@@ -114,6 +114,29 @@ describe Budget do
end
end
describe "main_link_url" do
it "is not required if main_link_text is not provided" do
valid_budget = build(:budget, main_link_text: nil)
expect(valid_budget).to be_valid
end
it "is required if main_link_text is provided" do
invalid_budget = build(:budget, main_link_text: "link text")
expect(invalid_budget).not_to be_valid
expect(invalid_budget.errors.count).to be 1
expect(invalid_budget.errors[:main_link_url].count).to be 1
expect(invalid_budget.errors[:main_link_url].first).to eq "can't be blank"
end
it "is valid if main_link_text and main_link_url are both provided" do
valid_budget = build(:budget, main_link_text: "Text link", main_link_url: "https://consulproject.org")
expect(valid_budget).to be_valid
end
end
describe "phase" do
it "is validated" do
Budget::Phase::PHASE_KINDS.each do |phase|

View File

@@ -13,6 +13,9 @@ shared_examples_for "globalizable" do |factory_name|
let(:attribute) { required_fields.sample || fields.sample }
before do
if factory_name == :budget
record.main_link_url = "https://consulproject.org"
end
record.update!(attribute => "In English")
I18n.with_locale(:es) do

View File

@@ -233,6 +233,21 @@ describe "Admin budgets", :admin do
end
end
scenario "Show CTA link in public site if added" do
visit edit_admin_budget_path(budget)
expect(page).to have_content("Main call to action (optional)")
fill_in "Text on the link", with: "Participate now"
fill_in "The link takes you to (add a link)", with: "https://consulproject.org"
click_button "Update Budget"
expect(page).to have_content "Participatory budget updated successfully"
visit budgets_path
expect(page).to have_link("Participate now", href: "https://consulproject.org")
end
scenario "Changing name for current locale will update the slug if budget is in draft phase" do
budget.update!(published: false, name: "Old English Name")

View File

@@ -122,7 +122,7 @@ describe "Admin edit translatable records", :admin do
let(:translatable) { create(:budget_investment) }
context "Input field" do
let(:translatable) { create(:budget) }
let(:translatable) { create(:budget, main_link_url: "https://consulproject.org") }
scenario "Shows validation erros" do
visit edit_admin_budget_path(translatable)

View File

@@ -22,23 +22,6 @@ describe "Budgets" do
let!(:heading1) { create(:budget_heading, group: group1) }
let!(:heading2) { create(:budget_heading, group: group2) }
scenario "Show normal index with links in informing phase" do
budget.update!(phase: "informing")
visit budgets_path
within(".budget-header") do
expect(page).to have_content(budget.name)
expect(page).to have_content(budget.description)
expect(page).to have_link("Help with participatory budgets")
end
within(".budget-subheader") do
expect(page).to have_content "CURRENT PHASE"
expect(page).to have_content "Information"
end
end
scenario "Show normal index with links publishing prices" do
budget.update!(phase: "publishing_prices")
@@ -143,15 +126,6 @@ describe "Budgets" do
expect(page).to have_content "There are no budgets"
end
scenario "Accepting" do
budget.update!(phase: "accepting")
login_as(create(:user, :level_two))
visit budgets_path
expect(page).to have_link "Create a budget investment"
end
end
scenario "Index shows only published phases" do
@@ -228,98 +202,6 @@ describe "Budgets" do
expect(page).to have_css(".tabs-panel.is-active", count: 1)
end
context "Index map" do
let(:heading) { create(:budget_heading, budget: budget) }
before do
Setting["feature.map"] = true
end
scenario "Display investment's map location markers" do
investment1 = create(:budget_investment, heading: heading)
investment2 = create(:budget_investment, heading: heading)
investment3 = create(:budget_investment, heading: heading)
create(:map_location, longitude: 40.1234, latitude: -3.634, investment: investment1)
create(:map_location, longitude: 40.1235, latitude: -3.635, investment: investment2)
create(:map_location, longitude: 40.1236, latitude: -3.636, investment: investment3)
visit budgets_path
within ".map_location" do
expect(page).to have_css(".map-icon", count: 3, visible: :all)
end
end
scenario "Display all investment's map location if there are no selected" do
budget.update!(phase: :publishing_prices)
investment1 = create(:budget_investment, heading: heading)
investment2 = create(:budget_investment, heading: heading)
investment3 = create(:budget_investment, heading: heading)
investment4 = create(:budget_investment, heading: heading)
investment1.create_map_location(longitude: 40.1234, latitude: 3.1234, zoom: 10)
investment2.create_map_location(longitude: 40.1235, latitude: 3.1235, zoom: 10)
investment3.create_map_location(longitude: 40.1236, latitude: 3.1236, zoom: 10)
investment4.create_map_location(longitude: 40.1240, latitude: 3.1240, zoom: 10)
visit budgets_path
within ".map_location" do
expect(page).to have_css(".map-icon", count: 4, visible: :all)
end
end
scenario "Display only selected investment's map location from publishing prices phase" do
budget.update!(phase: :publishing_prices)
investment1 = create(:budget_investment, :selected, heading: heading)
investment2 = create(:budget_investment, :selected, heading: heading)
investment3 = create(:budget_investment, heading: heading)
investment4 = create(:budget_investment, heading: heading)
investment1.create_map_location(longitude: 40.1234, latitude: 3.1234, zoom: 10)
investment2.create_map_location(longitude: 40.1235, latitude: 3.1235, zoom: 10)
investment3.create_map_location(longitude: 40.1236, latitude: 3.1236, zoom: 10)
investment4.create_map_location(longitude: 40.1240, latitude: 3.1240, zoom: 10)
visit budgets_path
within ".map_location" do
expect(page).to have_css(".map-icon", count: 2, visible: :all)
end
end
scenario "Skip invalid map markers" do
map_locations = []
investment = create(:budget_investment, heading: heading)
map_locations << { longitude: 40.123456789, latitude: 3.12345678 }
map_locations << { longitude: 40.123456789, latitude: "********" }
map_locations << { longitude: "**********", latitude: 3.12345678 }
coordinates = map_locations.map do |map_location|
{
lat: map_location[:latitude],
long: map_location[:longitude],
investment_title: investment.title,
investment_id: investment.id,
budget_id: budget.id
}
end
allow_any_instance_of(Budgets::BudgetComponent).to receive(:coordinates).and_return(coordinates)
visit budgets_path
within ".map_location" do
expect(page).to have_css(".map-icon", count: 1, visible: :all)
end
end
end
context "Show" do
let!(:budget) { create(:budget, :selecting) }
let!(:group) { create(:budget_group, budget: budget) }
@@ -379,36 +261,14 @@ describe "Budgets" do
expect(page).not_to have_css("#budget_heading_#{heading4.id}")
end
scenario "See results button is showed if the budget has finished for all users" do
scenario "See results button is showed if the budget has finished" do
user = create(:user)
admin = create(:administrator)
budget = create(:budget, :finished)
login_as(user)
visit budget_path(budget)
expect(page).to have_link "See results"
logout
login_as(admin.user)
visit budget_path(budget)
expect(page).to have_link "See results"
end
scenario "See results button isn't showed if the budget hasn't finished for all users" do
user = create(:user)
admin = create(:administrator)
budget = create(:budget, :balloting)
login_as(user)
visit budget_path(budget)
expect(page).not_to have_link "See results"
logout
login_as(admin.user)
visit budget_path(budget)
expect(page).not_to have_link "See results"
end
end
@@ -426,34 +286,4 @@ describe "Budgets" do
end
end
end
context "Accepting" do
before do
budget.update(phase: "accepting")
end
context "Permissions" do
scenario "Verified user" do
login_as(level_two_user)
visit budget_path(budget)
expect(page).to have_link "Create a budget investment"
end
scenario "Unverified user" do
user = create(:user)
login_as(user)
visit budget_path(budget)
expect(page).to have_content "To create a new budget investment verify your account."
end
scenario "user not logged in" do
visit budget_path(budget)
expect(page).to have_content "To create a new budget investment you must sign in or sign up"
end
end
end
end