Module: Decidim::LayoutHelper

Included in:
AddressCell, Amendable::EmendationActionsCell, AuthorCell, CardMCell, DiffCell, EndorsementButtonsCell, FollowButtonCell, IconHelper, UserConversationCell, UserConversationsCell, VersionsListItemCell, WizardStepFormCell
Defined in:
app/helpers/decidim/layout_helper.rb

Overview

View helpers related to the layout.

Instance Method Summary collapse

Instance Method Details

#_icon_classes(options = {}) ⇒ Object 



98
99
100
101
102
 
# File 'app/helpers/decidim/layout_helper.rb', line 98

def _icon_classes(options = {})
  classes = options[:remove_icon_class] ? [] : ["icon"]
  classes += [options[:class]]
  classes.compact
end

#application_path(path) ⇒ Object 



85
86
87
88
89
 
# File 'app/helpers/decidim/layout_helper.rb', line 85

def application_path(path)
  img_path = asset_pack_path(path)
  img_path = URI(img_path).path if Decidim.cors_enabled
  Rails.root.join("public/#{img_path}")
end

#extended_navigation_bar(items, max_items: 5) ⇒ Object 



104
105
106
107
108
109
110
111
112
113
114
115
116
 
# File 'app/helpers/decidim/layout_helper.rb', line 104

def extended_navigation_bar(items, max_items: 5)
  return unless items.any?

  extra_items = items.slice((max_items + 1)..-1) || []
  active_item = items.find { |item| item[:active] }

  render partial: "decidim/shared/extended_navigation_bar.html", locals: {
    items: items,
    extra_items: extra_items,
    active_item: active_item,
    max_items: max_items
  }
end

#external_icon(path, options = {}) ⇒ Object

Outputs a SVG icon from an external file. It apparently renders an image tag, but then a JS script kicks in and replaces it with an inlined SVG version.

path - The asset’s path

Returns an <img /> tag with the SVG icon.



73
74
75
76
77
78
79
80
81
82
83
 
# File 'app/helpers/decidim/layout_helper.rb', line 73

def external_icon(path, options = {})
  classes = _icon_classes(options) + ["external-icon"]

  if path.split(".").last == "svg"
    attributes = { class: classes.join(" ") }.merge(options)
    asset = File.read(application_path(path))
    asset.gsub("<svg ", "<svg#{tag_builder.tag_options(attributes)} ").html_safe
  else
    image_pack_tag(path, class: classes.join(" "), style: "display: none")
  end
end

#favicon ⇒ Object

Public: Generates a set of meta tags that generate the different favicon versions for an organization.

Returns a safe String with the versions.



10
11
12
13
14
15
16
 
# File 'app/helpers/decidim/layout_helper.rb', line 10

def favicon
  return if current_organization.favicon.blank?

  safe_join(Decidim::OrganizationFaviconUploader::SIZES.map do |version, size|
    favicon_link_tag(current_organization.attached_uploader(:favicon).variant_url(version, host: current_organization.host), sizes: "#{size}x#{size}")
  end)
end

#icon(name, options = {}) ⇒ Object

Outputs an SVG-based icon.

name - The String with the icon name. options - The Hash options used to customize the icon (default {}):

:width  - The Number of width in pixels (optional).
:height - The Number of height in pixels (optional).
:title - The title for the SVG element (optional, similar to alt for img)
:aria_label - The String to set as aria label (optional).
:aria_hidden - The Truthy value to enable aria_hidden (optional).
:role - The String to set as the role (optional).
:class - The String to add as a CSS class (optional).

Returns a String.



31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
 
# File 'app/helpers/decidim/layout_helper.rb', line 31

def icon(name, options = {})
  options = options.with_indifferent_access
  html_properties = {}

  html_properties["width"] = options[:width]
  html_properties["height"] = options[:height]
  html_properties["aria-label"] = options[:aria_label] || options[:"aria-label"]
  html_properties["role"] = options[:role] || "img"
  html_properties["aria-hidden"] = options[:aria_hidden] || options[:"aria-hidden"]

  html_properties["class"] = (["icon--#{name}"] + _icon_classes(options)).join(" ")

  title = options["title"] || html_properties["aria-label"]
  if title.blank? && html_properties["role"] == "img"
    # This will make the accessibility audit tools happy as with the "img"
    # role, the alternative text (aria-label) and title are required for the
    # element. This will also force the SVG to be hidden because otherwise
    # the screen reader would announce the icon name which can be in
    # different language (English) than the page language which is not
    # allowed.
    title = name
    html_properties["aria-label"] = title
    html_properties["aria-hidden"] = true
  end

  href = Decidim.cors_enabled ? "" : asset_pack_path("media/images/icons.svg")

  content_tag :svg, html_properties do
    inner = content_tag :title, title
    inner += content_tag :use, nil, "href" => "#{href}#icon-#{name}"

    inner
  end
end

#organization_colors ⇒ Object

Renders a view with the customizable CSS variables in two flavours:

  1. as a hexadecimal valid CSS color (ie: #ff0000)

  2. as a disassembled RGB components (ie: 255,0,0)

Example:

–primary: #ff0000; –primary-rgb: 255,0,0

Hexadecimal variables can be used as a normal CSS color:

color: var(–primary)

While the disassembled variant can be used where you need to manipulate the color somehow (ie: adding a background transparency):

background-color: rgba(var(–primary-rgb), 0.5)



135
136
137
138
 
# File 'app/helpers/decidim/layout_helper.rb', line 135

def organization_colors
  css = current_organization.colors.each.map { |k, v| "--#{k}: #{v};--#{k}-rgb: #{v[1..2].hex},#{v[3..4].hex},#{v[5..6].hex};" }.join
  render partial: "layouts/decidim/organization_colors", locals: { css: css }
end

#role(options = {}) ⇒ Object

Allows to create role attribute according to accessibility rules

Returns role attribute string if role option is specified



94
95
96
 
# File 'app/helpers/decidim/layout_helper.rb', line 94

def role(options = {})
  "role=\"#{options[:role]}\" " if options[:role]
end