jqr-helpers 1.0.1 → 1.0.3
Sign up to get free protection for your applications and to get access to all the features.
- 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