Module: BootstrapComponentHelper
- Extended by:
- ActiveSupport::Concern
- Includes:
- BootstrapHelper
- Defined in:
- app/helpers/bootstrap_component_helper.rb
Instance Method Summary collapse
- #badge(text, type = 'default') ⇒ Object (also: #b)
-
#btn_group(opts = {}, &block) ⇒ Object
(also: #bg)
Button groups 就是一个div, 里面的btn还是自己写 opts: type: vertical 默认为空,竖着排。。。诡异.
-
#btn_toolbar(opts = {}, &block) ⇒ Object
(also: #bt)
可以组合多个btn group.
-
#flash(message = nil, options = {}, &block) ⇒ Object
(also: #f)
Alerts, Styles for success, warning, and error messages.
-
#hero_unit(*args, &block) ⇒ Object
(also: #hu)
Typographic components.
-
#label(text, type = 'default') ⇒ Object
(also: #l)
Labels and badges type: success, warning, important, info, inverse.
-
#modal(id, header_text, options = {}, &block) ⇒ Object
bootstrap modal see bootstrap-modal-rails gem.
-
#modal_trigger(id, value, options = {}) ⇒ Object
options: type - a or b, a is link, b is button.
- #modal_with_trigger(id, header_text, trigger_value, options = {}, trigger_options = {}, &block) ⇒ Object
-
#nav(*args, &block) ⇒ Object
Nav : tabs, pills, and lists bootstrap navs.
-
#navbar(options = {}, &block) ⇒ Object
Navbar.
-
#page_header(*args, &block) ⇒ Object
(also: #ph)
Page header components.
-
#progress(*args) ⇒ Object
(also: #pg)
Progress bars.
- #progress_bar(options = {}) ⇒ Object
-
#thumbnail(span = 12, *options, &block) ⇒ Object
(also: #tn)
Thumbnail element span - width of thumbnail, 1-12 title - title of thumbnail, h5 description - description of thumbnail, p li_options - any options that can be accepted by li tn_options - thumbnail options tag: :div default.
-
#thumbnails(options = {}, &block) ⇒ Object
(also: #tns)
Thumbnails Grids of images, videos, text, and more options - any options that can be accepted by ul.
Methods included from BootstrapHelper
#div, #javascript_include_tag_with_p, #merge_predef_class
Instance Method Details
#badge(text, type = 'default') ⇒ Object Also known as: b
120 121 122 |
# File 'app/helpers/bootstrap_component_helper.rb', line 120 def badge(text, type='default') content_tag('span', text, class: "badge badge-#{type.to_s}") end |
#btn_group(opts = {}, &block) ⇒ Object Also known as: bg
Button groups 就是一个div, 里面的btn还是自己写opts:
type: vertical 默认为空,竖着排。。。诡异
12 13 14 15 16 17 |
# File 'app/helpers/bootstrap_component_helper.rb', line 12 def btn_group(opts={}, &block) class_str = 'btn-group' class_str << ' btn-group-vertical' if opts.delete(:type) == 'vertical' div(merge_predef_class(class_str, opts), &block) end |
#btn_toolbar(opts = {}, &block) ⇒ Object Also known as: bt
可以组合多个btn group
22 23 24 |
# File 'app/helpers/bootstrap_component_helper.rb', line 22 def (opts={}, &block) div(merge_predef_class('btn-toolbar', opts), &block) end |
#flash(message = nil, options = {}, &block) ⇒ Object Also known as: f
Alerts, Styles for success, warning, and error messages
message - the message of alert options -
type - type of alerts: error, warning, success, info. default: warning
block: true, false, add padding to alert component. default: false
closable: true, false, add a close button to alert. default: true
the other options that can be accepted by div
224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 |
# File 'app/helpers/bootstrap_component_helper.rb', line 224 def flash(=nil, ={}, &block) , = nil, if .is_a?(Hash) = {closable: true, block: false} .reverse_merge!() flash_class = %w(alert) flash_class << "alert-#{.delete(:type).to_s}" if [:type] flash_class << 'alert-block' if .delete(:block) flash_class << "#{.delete(:class)}" closable = .delete(:closable) content_tag(:div, nil, .merge!(class: flash_class)) do content = [] content << '<a href="#" class="close" data-dismiss="alert">×</a>' if closable content << if content << capture(&block) if block_given? content.join.html_safe end end |
#hero_unit(*args, &block) ⇒ Object Also known as: hu
Typographic components
title - hero unit’s title, presented as h1 description - description of hero unit, presented as p options - any html options that can be accepted by div
131 132 133 134 135 136 137 138 139 140 141 142 143 |
# File 'app/helpers/bootstrap_component_helper.rb', line 131 def hero_unit(*args, &block) = args. title = args.try(:first) description = args.try(:second) div(merge_predef_class('hero-unit', )) do content = [] content << content_tag('h1', title) unless title.blank? content << content_tag('p', description) unless description.blank? content << capture(&block) if block_given? content.compact.join.html_safe end end |
#label(text, type = 'default') ⇒ Object Also known as: l
Labels and badges type: success, warning, important, info, inverse
114 115 116 |
# File 'app/helpers/bootstrap_component_helper.rb', line 114 def label(text, type='default') content_tag('span', text, class: "label label-#{type.to_s}") end |
#modal(id, header_text, options = {}, &block) ⇒ Object
bootstrap modal see bootstrap-modal-rails gem
options -
header - header of modal, replace default header.
footer_text - text of footer, default: Close
footer - footer of modal, replace default footer.
width - numbers
static - true, false. default: true
fullwidth - true, false, default: false
long - true, false, default: false
307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 |
# File 'app/helpers/bootstrap_component_helper.rb', line 307 def modal(id, header_text, ={}, &block) = { header: "<button type='button' data-dismiss='modal' class='close'>×</button><h3>#{header_text}</h3>", footer: "<button class=\"btn\" data-dismiss=\"modal\" type=\"button\">#{.delete(:footer_text)||'Close'}</button>", fullwidth: false, long: false, static: true } = .merge() = .delete(:footer) header = .delete(:header) .merge!({'data-backdrop' => 'static', 'data-keyboard' => 'false'}) if .delete(:static) .merge!({'data-replace' => 'true'}) if .delete(:long) .merge!({'data-width' => .delete(:width)}) if [:width] div(merge_predef_class("modal hide fade #{.delete(:fullwidth) ? 'container' : ''}", ).merge!(id: id)) do content = '' content << div(class: 'modal-header') do header.html_safe end content << div(class: 'modal-body') do capture(&block) if block_given? end content << div(class: 'modal-footer') do .html_safe end content.html_safe end end |
#modal_trigger(id, value, options = {}) ⇒ Object
options:
type - a or b, a is link, b is button. default: a
icon - glyph icon of trigger
341 342 343 344 345 346 347 348 349 350 351 352 |
# File 'app/helpers/bootstrap_component_helper.rb', line 341 def modal_trigger(id, value, ={}) = {name: "trigger-#{id}", id: "trigger-#{id}", 'data-toggle' => 'modal', type: 'a'} = .merge() merge_predef_class('btn', ) if .delete(:type) == 'b' link_to("##{id}", ) do content = '' content << glyph_icon(.delete(:icon)) if [:icon] content << value content.html_safe end end |
#modal_with_trigger(id, header_text, trigger_value, options = {}, trigger_options = {}, &block) ⇒ Object
354 355 356 |
# File 'app/helpers/bootstrap_component_helper.rb', line 354 def modal_with_trigger(id, header_text, trigger_value, ={}, ={}, &block) modal(id, header_text, , &block) + modal_trigger(id, trigger_value, ) end |
#nav(*args, &block) ⇒ Object
Nav : tabs, pills, and lists bootstrap navs
34 35 36 37 38 39 40 41 |
# File 'app/helpers/bootstrap_component_helper.rb', line 34 def nav(*args, &block) = {class: 'nav'} = args. current_class = .delete(:class) || '' .reverse_merge!()[:class] << " #{current_class}" list(*(args << ), &block) end |
#navbar(options = {}, &block) ⇒ Object
Navbar
options -
fix: top, bottom
static: top, bottom
fluid: true, false default: true
inverse: true, false default: false
&block ,navbar的内容
51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 |
# File 'app/helpers/bootstrap_component_helper.rb', line 51 def (={}, &block) = {fluid: true, inverse: false} .reverse_merge!() fluid = .delete(:fluid) result = '' = 'navbar' case .delete(:fix) when 'top' << ' navbar-fixed-top' result << javascript_tag do raw <<-JS $(function(){ if ($('.navbar-fixed-top').css('position') != 'static') $('body').css('padding-top','40px'); }); JS end when 'bottom' << ' navbar-fixed-bottom' result << javascript_tag do raw <<-JS $(function(){ if ($('.navbar-fixed-top').css('position') != 'static') $('body').css('padding-bottom','40px'); }); JS end end case .delete(:static) when 'top' << ' navbar-static-top' when 'bottom' << ' navbar-static-bottom' end << ' navbar-inverse' if .delete(:inverse) [:class] ||= '' [:class] << " #{}" result << div() do div(class: 'navbar-inner') do if fluid capture(&block) if block_given? else div(class: 'container') do capture(&block) if block_given? end end end end result.html_safe end |
#page_header(*args, &block) ⇒ Object Also known as: ph
Page header components
title - hero unit’s title, presented as h1 description - description of hero unit, presented as p options - any html options that can be accepted by div
152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 |
# File 'app/helpers/bootstrap_component_helper.rb', line 152 def page_header(*args, &block) = args. title = args.try(:first) description = args.try(:second) div(merge_predef_class('page-header', )) do if block_given? capture(&block) else content_tag('h1') do [title, (content_tag('small', description) unless description.blank?) ].compact.join(' ').html_safe end unless title.blank? end end end |
#progress(*args) ⇒ Object Also known as: pg
Progress bars
the first parameter is a hash: active - true, false. it’s the active style of the bar. striped - true, false. it’s the striped style of the bar. in_table - true, false. If progress is in a table, set the margin-bottom to zero. the other options that can be acctpted by div
bar_options - hash or array. the bar options. If it is a stacked bar, options will be a hash, or will be an array
type - bar's type: success, warning, danger, info
percentage - the bar's percentage
content - bar content
the other options that can be acctpted by div
260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 |
# File 'app/helpers/bootstrap_component_helper.rb', line 260 def progress(*args) = args.shift = args.flatten , = [], {} if .empty? progress_class = "progress #{.delete(:striped) ? 'progress-striped' : ''} #{.delete(:active) ? 'active' : ''}" progress_class << " #{.delete(:class)}" if [:class] progress_style = .delete(:in_table) ? 'margin-bottom: 0;' : '' progress_style << " #{.delete(:style)}" if [:style] div(.merge!({class: progress_class, style: progress_style})) do content = [] .each do |opts| content << (opts) end content.join.html_safe end end |
#progress_bar(options = {}) ⇒ Object
283 284 285 286 287 288 289 290 |
# File 'app/helpers/bootstrap_component_helper.rb', line 283 def (={}) = "bar #{[:type] ? 'bar-' + [:type].to_s : ''}" << " #{.delete(:class)}" if [:class] = "width: #{[:percentage].to_i}%;" << " #{.delete(:style)}" if [:style] content_tag('div', [:content], .merge!({class: , style: })) end |
#thumbnail(span = 12, *options, &block) ⇒ Object Also known as: tn
Thumbnail element span - width of thumbnail, 1-12 title - title of thumbnail, h5 description - description of thumbnail, p li_options - any options that can be accepted by li tn_options - thumbnail options
tag: :div default.
any options that can be accepted by the tag
190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 |
# File 'app/helpers/bootstrap_component_helper.rb', line 190 def thumbnail(span=12, *, &block) = . = .first || {} , = , {} if .empty? [:class] ||= '' [:class] << " span#{span}" [:class] ||= '' [:class] << ' thumbnail' .reverse_merge!({tag: :div}) content_tag('li', nil, ) do content_tag(.delete(:tag), nil, ) do capture(&block) end end end |
#thumbnails(options = {}, &block) ⇒ Object Also known as: tns
Thumbnails Grids of images, videos, text, and more options - any options that can be accepted by ul
174 175 176 177 178 179 180 |
# File 'app/helpers/bootstrap_component_helper.rb', line 174 def thumbnails(={}, &block) [:class] ||= '' [:class] << ' thumbnails' content_tag('ul', nil, ) do capture(&block) end end |