2016-03-07 10:37:35 -05:00
|
|
|
module DropdownsHelper
|
2016-03-09 05:19:41 -05:00
|
|
|
def dropdown_tag(toggle_text, options: {}, &block)
|
2017-06-02 13:11:26 -04:00
|
|
|
content_tag :div, class: "dropdown #{options[:wrapper_class] if options.key?(:wrapper_class)}" do
|
2016-03-09 05:19:41 -05:00
|
|
|
data_attr = { toggle: "dropdown" }
|
2016-03-07 12:17:11 -05:00
|
|
|
|
2017-06-02 13:11:26 -04:00
|
|
|
if options.key?(:data)
|
2016-03-09 05:19:41 -05:00
|
|
|
data_attr = options[:data].merge(data_attr)
|
2016-03-07 10:37:35 -05:00
|
|
|
end
|
|
|
|
|
2016-03-09 05:19:41 -05:00
|
|
|
dropdown_output = dropdown_toggle(toggle_text, data_attr, options)
|
2016-03-07 10:37:35 -05:00
|
|
|
|
2017-06-02 13:11:26 -04:00
|
|
|
dropdown_output << content_tag(:div, class: "dropdown-menu dropdown-select #{options[:dropdown_class] if options.key?(:dropdown_class)}") do
|
2016-03-09 05:19:41 -05:00
|
|
|
output = ""
|
2016-03-07 10:37:35 -05:00
|
|
|
|
2017-06-02 13:11:26 -04:00
|
|
|
if options.key?(:title)
|
2016-03-09 05:19:41 -05:00
|
|
|
output << dropdown_title(options[:title])
|
2016-03-07 10:37:35 -05:00
|
|
|
end
|
|
|
|
|
2017-06-02 13:11:26 -04:00
|
|
|
if options.key?(:filter)
|
2016-03-09 05:19:41 -05:00
|
|
|
output << dropdown_filter(options[:placeholder])
|
2016-03-07 10:37:35 -05:00
|
|
|
end
|
|
|
|
|
2017-06-02 13:11:26 -04:00
|
|
|
output << content_tag(:div, class: "dropdown-content #{options[:content_class] if options.key?(:content_class)}") do
|
|
|
|
capture(&block) if block && !options.key?(:footer_content)
|
2016-03-07 12:28:37 -05:00
|
|
|
end
|
|
|
|
|
2016-03-17 05:09:06 -04:00
|
|
|
if block && options[:footer_content]
|
2016-03-09 05:19:41 -05:00
|
|
|
output << content_tag(:div, class: "dropdown-footer") do
|
2016-03-07 12:28:37 -05:00
|
|
|
capture(&block)
|
|
|
|
end
|
2016-03-07 10:37:35 -05:00
|
|
|
end
|
|
|
|
|
2016-03-09 05:19:41 -05:00
|
|
|
output << dropdown_loading
|
2016-03-07 10:37:35 -05:00
|
|
|
|
|
|
|
output.html_safe
|
|
|
|
end
|
|
|
|
|
|
|
|
dropdown_output.html_safe
|
|
|
|
end
|
|
|
|
end
|
2016-03-09 05:19:41 -05:00
|
|
|
|
2016-05-26 18:55:49 -04:00
|
|
|
def dropdown_toggle(toggle_text, data_attr, options = {})
|
2016-07-19 05:05:38 -04:00
|
|
|
default_label = data_attr[:default_label]
|
2018-04-25 15:42:23 -04:00
|
|
|
content_tag(:button, disabled: options[:disabled], class: "dropdown-menu-toggle #{options[:toggle_class] if options.key?(:toggle_class)}", id: (options[:id] if options.key?(:id)), type: "button", data: data_attr) do
|
2016-07-16 04:03:19 -04:00
|
|
|
output = content_tag(:span, toggle_text, class: "dropdown-toggle-text #{'is-default' if toggle_text == default_label}")
|
2016-11-18 15:19:44 -05:00
|
|
|
output << icon('chevron-down')
|
2016-03-09 05:19:41 -05:00
|
|
|
output.html_safe
|
|
|
|
end
|
|
|
|
end
|
|
|
|
|
2017-07-28 13:36:07 -04:00
|
|
|
def dropdown_title(title, options: {})
|
2016-03-09 05:19:41 -05:00
|
|
|
content_tag :div, class: "dropdown-title" do
|
|
|
|
title_output = ""
|
|
|
|
|
2017-07-28 13:36:07 -04:00
|
|
|
if options.fetch(:back, false)
|
2016-03-09 05:19:41 -05:00
|
|
|
title_output << content_tag(:button, class: "dropdown-title-button dropdown-menu-back", aria: { label: "Go back" }, type: "button") do
|
|
|
|
icon('arrow-left')
|
|
|
|
end
|
|
|
|
end
|
|
|
|
|
|
|
|
title_output << content_tag(:span, title)
|
|
|
|
|
2017-07-28 13:36:07 -04:00
|
|
|
if options.fetch(:close, true)
|
|
|
|
title_output << content_tag(:button, class: "dropdown-title-button dropdown-menu-close", aria: { label: "Close" }, type: "button") do
|
|
|
|
icon('times', class: 'dropdown-menu-close-icon')
|
|
|
|
end
|
2016-03-09 05:19:41 -05:00
|
|
|
end
|
|
|
|
|
|
|
|
title_output.html_safe
|
|
|
|
end
|
|
|
|
end
|
|
|
|
|
2017-07-28 13:36:07 -04:00
|
|
|
def dropdown_input(placeholder, input_id: nil)
|
|
|
|
content_tag :div, class: "dropdown-input" do
|
2017-07-28 19:33:56 -04:00
|
|
|
filter_output = text_field_tag input_id, nil, class: "dropdown-input-field dropdown-no-filter", placeholder: placeholder, autocomplete: 'off'
|
2017-07-28 13:36:07 -04:00
|
|
|
filter_output << icon('times', class: "dropdown-input-clear js-dropdown-input-clear", role: "button")
|
|
|
|
|
|
|
|
filter_output.html_safe
|
|
|
|
end
|
|
|
|
end
|
|
|
|
|
2016-06-09 05:44:17 -04:00
|
|
|
def dropdown_filter(placeholder, search_id: nil)
|
2016-03-09 05:19:41 -05:00
|
|
|
content_tag :div, class: "dropdown-input" do
|
2016-06-28 12:19:59 -04:00
|
|
|
filter_output = search_field_tag search_id, nil, class: "dropdown-input-field", placeholder: placeholder, autocomplete: 'off'
|
2016-03-18 12:53:15 -04:00
|
|
|
filter_output << icon('search', class: "dropdown-input-search")
|
|
|
|
filter_output << icon('times', class: "dropdown-input-clear js-dropdown-input-clear", role: "button")
|
2016-03-09 05:19:41 -05:00
|
|
|
|
|
|
|
filter_output.html_safe
|
|
|
|
end
|
|
|
|
end
|
|
|
|
|
|
|
|
def dropdown_content(&block)
|
|
|
|
content_tag(:div, class: "dropdown-content") do
|
|
|
|
if block
|
|
|
|
capture(&block)
|
|
|
|
end
|
|
|
|
end
|
|
|
|
end
|
|
|
|
|
2017-08-14 03:26:19 -04:00
|
|
|
def dropdown_footer(add_content_class: false, &block)
|
2016-03-09 05:19:41 -05:00
|
|
|
content_tag(:div, class: "dropdown-footer") do
|
2017-08-14 03:26:19 -04:00
|
|
|
if add_content_class
|
|
|
|
content_tag(:div, capture(&block), class: "dropdown-footer-content")
|
|
|
|
else
|
2016-03-09 05:19:41 -05:00
|
|
|
capture(&block)
|
|
|
|
end
|
|
|
|
end
|
|
|
|
end
|
|
|
|
|
|
|
|
def dropdown_loading
|
|
|
|
content_tag :div, class: "dropdown-loading" do
|
|
|
|
icon('spinner spin')
|
|
|
|
end
|
|
|
|
end
|
2016-03-07 10:37:35 -05:00
|
|
|
end
|