jqr-helpers 1.0.1 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/Readme.md +13 -0
- data/app/assets/javascripts/jqr-helpers.js +8 -3
- data/app/assets/stylesheets/jqr-helpers.css +4 -0
- data/jqr-helpers.gemspec +1 -1
- data/lib/jqr-helpers/helpers.rb +80 -0
- data/lib/jqr-helpers/version.rb +1 -1
- metadata +1 -1
data/Readme.md
CHANGED
@@ -44,6 +44,7 @@ the dialog content from a remote route)
|
|
44
44
|
* `button_to_ajax` - send an Ajax request when a button is clicked
|
45
45
|
* `form_tag_ajax` - send an Ajax request when a form is submitted
|
46
46
|
* `form_for_ajax` - ditto but using Rails's `form_for` helper
|
47
|
+
* `tab_container` - create a tab container.
|
47
48
|
|
48
49
|
There are two sets of options that recur throughout the methods here:
|
49
50
|
|
@@ -113,6 +114,18 @@ this indicates that the dialog should be closed when the request completes
|
|
113
114
|
successfully. This is true by default for forms and false for
|
114
115
|
other elements.
|
115
116
|
|
117
|
+
## Panel Renderers ##
|
118
|
+
|
119
|
+
Tabs (and eventually accordion panes and menus) are rendered using a "panel renderer".
|
120
|
+
This allows you to loop through the tabs in an intuitive and concise way.
|
121
|
+
|
122
|
+
<%= tab_container {:collapsible => true}, {:class => 'my-tabs}' do |r| %>
|
123
|
+
<%= r.panel 'Tab 1', do %>
|
124
|
+
My tab content here
|
125
|
+
<% end %>
|
126
|
+
<%= r.panel 'Tab 2', 'http://www.foobar.com/' %>
|
127
|
+
<% end %>
|
128
|
+
|
116
129
|
## jQuery Events ##
|
117
130
|
|
118
131
|
There are two special events triggered by jqr-helpers:
|
@@ -18,7 +18,8 @@
|
|
18
18
|
|
19
19
|
// called from dialog button value
|
20
20
|
function ujsDialogClose() {
|
21
|
-
$('.ui-dialog-content:visible').dialog('destroy')
|
21
|
+
$('.ui-dialog-content:visible').dialog('destroy')
|
22
|
+
.addClass('ujs-dialog-hidden');
|
22
23
|
}
|
23
24
|
|
24
25
|
function ujsDialogOpen() {
|
@@ -50,7 +51,7 @@
|
|
50
51
|
var open = dialogOptions['open'];
|
51
52
|
dialogOptions = $.extend(dialogOptions, {
|
52
53
|
'close': function() {
|
53
|
-
$(this).dialog('destroy');
|
54
|
+
$(this).dialog('destroy').addClass('ujs-dialog-hidden');
|
54
55
|
},
|
55
56
|
'open': function() {
|
56
57
|
ujsDialogOpen.call(this);
|
@@ -190,7 +191,9 @@
|
|
190
191
|
}
|
191
192
|
|
192
193
|
$(function() {
|
193
|
-
$('.ujs-tab-container', this).
|
194
|
+
$('.ujs-tab-container', this).each(function() {
|
195
|
+
var options = $(this).data('tab-options');
|
196
|
+
options = $.extend(options, {
|
194
197
|
beforeLoad: function(event, ui) {
|
195
198
|
if (ui.tab.data('loaded')) {
|
196
199
|
event.preventDefault();
|
@@ -205,6 +208,8 @@
|
|
205
208
|
});
|
206
209
|
}
|
207
210
|
});
|
211
|
+
$(this).tabs(options);
|
212
|
+
});
|
208
213
|
|
209
214
|
if ($().on) { // newer jQueries
|
210
215
|
$(document).on('click', '.ujs-dialog', ujsDialogClick);
|
data/jqr-helpers.gemspec
CHANGED
data/lib/jqr-helpers/helpers.rb
CHANGED
@@ -1,6 +1,47 @@
|
|
1
1
|
module JqrHelpers
|
2
2
|
module Helpers
|
3
3
|
|
4
|
+
# A renderer used for tabs, accordions, etc.
|
5
|
+
class PanelRenderer
|
6
|
+
|
7
|
+
# @return [Array<Hash>]
|
8
|
+
attr_accessor :panels
|
9
|
+
|
10
|
+
def initialize
|
11
|
+
self.panels = []
|
12
|
+
end
|
13
|
+
|
14
|
+
# Render a panel in the parent container. The panel must have either
|
15
|
+
# a URL or a block containing content.
|
16
|
+
# @param title [String]
|
17
|
+
# @param url_or_options [String|Hash] If a URL is given, it will be here
|
18
|
+
# and the options will be the next parameter. If a block is given,
|
19
|
+
# this will be the option hash. Options will be passed as is into the
|
20
|
+
# HTML <li> tag.
|
21
|
+
# @param options [Hash] the options if a URL is given.
|
22
|
+
def panel(title, url_or_options={}, options={}, &block)
|
23
|
+
if url_or_options.is_a?(String)
|
24
|
+
url = url_or_options
|
25
|
+
content = ''
|
26
|
+
id = nil
|
27
|
+
else
|
28
|
+
options = url_or_options
|
29
|
+
content = yield
|
30
|
+
id = (0...8).map { (65 + rand(26)).chr }.join # random string
|
31
|
+
url = '#' + id
|
32
|
+
end
|
33
|
+
options.merge!(:id => id)
|
34
|
+
panels << {
|
35
|
+
:title => title,
|
36
|
+
:url => url,
|
37
|
+
:options => options,
|
38
|
+
:content => content
|
39
|
+
}
|
40
|
+
nil # suppress output
|
41
|
+
end
|
42
|
+
|
43
|
+
end
|
44
|
+
|
4
45
|
# Add a link to create a jQuery dialog.
|
5
46
|
# If a block is given, dialog_options and html_options are shifted left by
|
6
47
|
# 1 and the block is used as the html_content.
|
@@ -186,6 +227,45 @@ module JqrHelpers
|
|
186
227
|
|
187
228
|
end
|
188
229
|
|
230
|
+
# Print a tab container. This expects a block, which will be passed a
|
231
|
+
# PanelRenderer object. Panels can be local (with content) or remote
|
232
|
+
# (with a URL).
|
233
|
+
# @example
|
234
|
+
# <%= tab_container {:collapsible => true}, {:class => 'my-tabs}' do |r| %>
|
235
|
+
# <%= r.panel 'Tab 1', do %>
|
236
|
+
# My tab content here
|
237
|
+
# <% end %>
|
238
|
+
# <%= r.panel 'Tab 2', 'http://www.foobar.com/' %>
|
239
|
+
# <% end %>
|
240
|
+
# @param options [Hash] options to pass to the jQuery tabs() method.
|
241
|
+
# @param html_options [Hash] options to pass to the tab container element
|
242
|
+
# itself.
|
243
|
+
def tab_container(options={}, html_options={}, &block)
|
244
|
+
renderer = PanelRenderer.new
|
245
|
+
capture(renderer, &block)
|
246
|
+
html_options[:class] ||= ''
|
247
|
+
html_options[:class] << ' ujs-tab-container'
|
248
|
+
html_options[:'data-tab-options'] = options.to_json
|
249
|
+
content_tag(:div, html_options) do
|
250
|
+
s = content_tag :ul do
|
251
|
+
s2 = ''
|
252
|
+
renderer.panels.each do |panel|
|
253
|
+
s2 << content_tag(:li) do
|
254
|
+
link_to panel[:title], panel[:url]
|
255
|
+
end
|
256
|
+
end
|
257
|
+
raw s2
|
258
|
+
end
|
259
|
+
s3 = renderer.panels.inject('') do |sum, panel|
|
260
|
+
if panel[:options][:id]
|
261
|
+
sum = sum + content_tag(:div, panel[:content], panel[:options])
|
262
|
+
end
|
263
|
+
sum
|
264
|
+
end
|
265
|
+
s + raw(s3)
|
266
|
+
end
|
267
|
+
end
|
268
|
+
|
189
269
|
private
|
190
270
|
|
191
271
|
# Process options related to Ajax requests (e.g. button_to_ajax).
|
data/lib/jqr-helpers/version.rb
CHANGED