window_rails 1.0.2 → 1.0.4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +5 -0
- data/README.md +284 -12
- data/app/assets/javascripts/window_rails/base.js +14 -8
- data/lib/window_rails/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 3c6f0d1045b9c538f13cfd7e7f08f0aa78bff4ef
|
4
|
+
data.tar.gz: 97849f2e5f5509de2c266485d6d5e58eb2d97139
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 8573ad195c66b5772126615002e0e26b7e761a380f3559a512155373cb91f29c756d06b3789fa36e3a75659dd9cc8663b11c05055c6a8009cbd66a5938badcec
|
7
|
+
data.tar.gz: 00205fa5c3b818d6cd926bc7a85ae32580ab9320cb79c5e28a7fdee150ca44cf3cf618802e72dae26f606d7b7b43ca68274cab3d35eef6f1d734d5f436a69e89
|
data/CHANGELOG.md
CHANGED
data/README.md
CHANGED
@@ -2,11 +2,6 @@
|
|
2
2
|
|
3
3
|
Rails helper for easy to use modals via bootstrap.
|
4
4
|
|
5
|
-
## Important note
|
6
|
-
|
7
|
-
As of the 1.0 release, window_rails has been re-implemented
|
8
|
-
using bootstrap as the core.
|
9
|
-
|
10
5
|
## Requirements
|
11
6
|
|
12
7
|
* jQuery
|
@@ -36,28 +31,305 @@ and then update your application manifests:
|
|
36
31
|
|
37
32
|
## Basic usage
|
38
33
|
|
39
|
-
|
34
|
+
The WindowRails library provides a simple interface to Bootstrap
|
35
|
+
based modals from Rails views removing the need for writing JavaScript
|
36
|
+
for integration. For simplicity of examples, lets assume the views
|
37
|
+
defined below are for JS formatted requests:
|
38
|
+
|
39
|
+
### Creating a new window
|
40
|
+
|
41
|
+
Create a new window:
|
42
|
+
|
43
|
+
```erb
|
44
|
+
<%=
|
45
|
+
create_window(
|
46
|
+
:name => 'my_window',
|
47
|
+
:title => 'My window!',
|
48
|
+
:content => 'Important things.'
|
49
|
+
)
|
50
|
+
%>
|
51
|
+
```
|
52
|
+
|
53
|
+
Create a small window:
|
54
|
+
|
55
|
+
```erb
|
56
|
+
<%=
|
57
|
+
create_window(
|
58
|
+
:name => 'my_window',
|
59
|
+
:title => 'My window!',
|
60
|
+
:size => 'small',
|
61
|
+
:content => 'Important things.'
|
62
|
+
)
|
63
|
+
%>
|
64
|
+
```
|
65
|
+
|
66
|
+
Or create a large window:
|
67
|
+
|
68
|
+
```erb
|
69
|
+
<%=
|
70
|
+
create_window(
|
71
|
+
:name => 'my_window',
|
72
|
+
:title => 'My window!',
|
73
|
+
:size => 'large',
|
74
|
+
:content => 'Important things.'
|
75
|
+
)
|
76
|
+
%>
|
77
|
+
```
|
78
|
+
|
79
|
+
Perhaps the content is located in a partial:
|
80
|
+
|
81
|
+
```erb
|
82
|
+
<%=
|
83
|
+
create_window(
|
84
|
+
:name => 'my_window',
|
85
|
+
:title => 'My window!',
|
86
|
+
:size => 'large',
|
87
|
+
:content => render(
|
88
|
+
:partial => 'my_partial',
|
89
|
+
:locals => {
|
90
|
+
:thing1 => @thing1,
|
91
|
+
:thing2 => @thing2
|
92
|
+
}
|
93
|
+
)
|
94
|
+
)
|
95
|
+
%>
|
96
|
+
```
|
97
|
+
|
98
|
+
Include a footer on the window:
|
99
|
+
|
100
|
+
```erb
|
101
|
+
<%=
|
102
|
+
create_window(
|
103
|
+
:name => 'my_window',
|
104
|
+
:title => 'My window!',
|
105
|
+
:size => 'large',
|
106
|
+
:content => render(
|
107
|
+
:partial => 'my_partial',
|
108
|
+
:locals => {
|
109
|
+
:thing1 => @thing1,
|
110
|
+
:thing2 => @thing2
|
111
|
+
}
|
112
|
+
),
|
113
|
+
:footer => render(
|
114
|
+
:partial => 'my_footer_partial'
|
115
|
+
)
|
116
|
+
)
|
117
|
+
%>
|
118
|
+
```
|
119
|
+
|
120
|
+
### Close the window
|
121
|
+
|
122
|
+
Windows are referenced by name. We can close the
|
123
|
+
previously defined `my_window`:
|
124
|
+
|
125
|
+
```erb
|
126
|
+
<%= close_window('my_window') %>
|
127
|
+
```
|
128
|
+
|
129
|
+
### Open a closed window
|
130
|
+
|
131
|
+
Lets open that window back up:
|
132
|
+
|
133
|
+
```erb
|
134
|
+
<%= open_window('my_window') %>
|
135
|
+
```
|
136
|
+
|
137
|
+
Or lets open it and change the title and content:
|
40
138
|
|
41
139
|
```erb
|
42
|
-
<%=
|
140
|
+
<%=
|
141
|
+
open_window(
|
142
|
+
'my_window',
|
143
|
+
:title => 'My Updated Window!',
|
144
|
+
:content => 'New content.'
|
145
|
+
)
|
146
|
+
%>
|
43
147
|
```
|
44
148
|
|
45
|
-
|
149
|
+
There's also options we can set:
|
150
|
+
|
151
|
+
```erb
|
152
|
+
<%=
|
153
|
+
open_window(
|
154
|
+
'my_window',
|
155
|
+
:title => 'My Updated Window!',
|
156
|
+
:content => 'New content.',
|
157
|
+
:esc_close => true,
|
158
|
+
:backdrop => true,
|
159
|
+
:static_backdrop => true
|
160
|
+
)
|
161
|
+
%>
|
162
|
+
```
|
163
|
+
|
164
|
+
### Alert window
|
165
|
+
|
166
|
+
#### Open alert window
|
167
|
+
|
168
|
+
Need to show an alert? Use the alert window:
|
169
|
+
|
170
|
+
```erb
|
171
|
+
<%= open_alert_window('This is an important alert!') %>
|
172
|
+
```
|
173
|
+
|
174
|
+
#### Close alert window
|
175
|
+
|
176
|
+
And to close the important alert:
|
46
177
|
|
47
178
|
```erb
|
48
179
|
<%= close_alert_window %>
|
49
180
|
```
|
50
181
|
|
51
|
-
###
|
182
|
+
### Information window
|
183
|
+
|
184
|
+
#### Open information window
|
185
|
+
|
186
|
+
Need to show some information:
|
187
|
+
|
188
|
+
```erb
|
189
|
+
<%= open_info_window('This is some information') %>
|
190
|
+
```
|
191
|
+
|
192
|
+
Want to provide a title for the informational window:
|
193
|
+
|
194
|
+
```erb
|
195
|
+
<%=
|
196
|
+
open_info_window(
|
197
|
+
'This is some information',
|
198
|
+
:title => 'Information!'
|
199
|
+
)
|
200
|
+
%>
|
201
|
+
```
|
202
|
+
|
203
|
+
Or automatically close the window after a set number of seconds:
|
204
|
+
|
205
|
+
```erb
|
206
|
+
<%=
|
207
|
+
open_info_window(
|
208
|
+
'This is some information',
|
209
|
+
:title => 'Information!',
|
210
|
+
:auto_close => 4
|
211
|
+
)
|
212
|
+
%>
|
213
|
+
```
|
214
|
+
|
215
|
+
#### Close information window
|
216
|
+
|
217
|
+
```erb
|
218
|
+
<%= close_info_window %>
|
219
|
+
```
|
220
|
+
|
221
|
+
### Confirmation window
|
222
|
+
|
223
|
+
WindowRails provides a confirmation window to allow user
|
224
|
+
acceptance prior to running a task. The task can be provided
|
225
|
+
as a remote URL that is requested via AJAX, or a local callback
|
226
|
+
function. Upon user confirmation, WindowRails will display a
|
227
|
+
loading window while the action is processing and a completion
|
228
|
+
window once completed.
|
229
|
+
|
230
|
+
#### Open a confirmation window
|
231
|
+
|
232
|
+
Open a confirmation window before making a remote request:
|
233
|
+
|
234
|
+
```erb
|
235
|
+
<%=
|
236
|
+
open_confirm_window(
|
237
|
+
'Do this thing?',
|
238
|
+
:url => '/do/thing'
|
239
|
+
)
|
240
|
+
%>
|
241
|
+
```
|
242
|
+
|
243
|
+
Specify the HTTP method for the remote call when doing something
|
244
|
+
like a deletion:
|
245
|
+
|
246
|
+
```erb
|
247
|
+
<%=
|
248
|
+
open_confirm_window(
|
249
|
+
'Delete this thing?',
|
250
|
+
:url => '/delete/thing',
|
251
|
+
:ajax => 'delete'
|
252
|
+
)
|
253
|
+
%>
|
254
|
+
```
|
255
|
+
|
256
|
+
Set title for the loading window:
|
257
|
+
|
258
|
+
```erb
|
259
|
+
<%=
|
260
|
+
open_confirm_window(
|
261
|
+
'Delete this thing?',
|
262
|
+
:url => '/delete/thing',
|
263
|
+
:ajax => 'delete',
|
264
|
+
:progress => 'Deleting thing'
|
265
|
+
)
|
266
|
+
%>
|
267
|
+
```
|
268
|
+
|
269
|
+
Set content for the completion window:
|
270
|
+
|
271
|
+
```erb
|
272
|
+
<%=
|
273
|
+
open_confirm_window(
|
274
|
+
'Delete this thing?',
|
275
|
+
:url => '/delete/thing',
|
276
|
+
:ajax => 'delete',
|
277
|
+
:progress => 'Deleting thing',
|
278
|
+
:complete => 'Thing has been deleted!'
|
279
|
+
)
|
280
|
+
%>
|
281
|
+
```
|
282
|
+
|
283
|
+
Use a callback instead of making a remote request:
|
284
|
+
|
285
|
+
```erb
|
286
|
+
<%=
|
287
|
+
open_confirm_window(
|
288
|
+
'Delete this thing?',
|
289
|
+
:callback => 'my_javascript_callback',
|
290
|
+
:progress => 'Deleting thing',
|
291
|
+
:complete => 'Thing has been deleted!'
|
292
|
+
)
|
293
|
+
%>
|
294
|
+
```
|
295
|
+
|
296
|
+
And the javascript function `my_javascript_callback` will
|
297
|
+
be executed.
|
298
|
+
|
299
|
+
#### Close the confirmation window
|
300
|
+
|
301
|
+
```erb
|
302
|
+
<%= close_confirm_window %>
|
303
|
+
```
|
304
|
+
|
305
|
+
#### Confirmation window via link
|
306
|
+
|
307
|
+
The confirmation window can be generated using information defined within
|
308
|
+
a link. Using the rails link helper:
|
52
309
|
|
53
310
|
```erb
|
54
|
-
<%=
|
311
|
+
<%=
|
312
|
+
link_to('Thing', do_thing_path,
|
313
|
+
'class' => 'window-rails',
|
314
|
+
'window-rails-url' => do_thing_path,
|
315
|
+
'window-rails-confirm' => 'Do the thing?',
|
316
|
+
'window-rails-title' => 'Thing Doer',
|
317
|
+
'window-rails-ajax' => 'post'
|
318
|
+
)
|
319
|
+
%>
|
55
320
|
```
|
56
321
|
|
57
|
-
|
322
|
+
Or use a callback:
|
58
323
|
|
59
324
|
```erb
|
60
|
-
<%=
|
325
|
+
<%=
|
326
|
+
link_to('Thing', do_thing_path,
|
327
|
+
'class' => 'window-rails',
|
328
|
+
'window-rails-callback' => 'my_javascript_function',
|
329
|
+
'window-rails-confirm' => 'Do the thing?',
|
330
|
+
'window-rails-title' => 'Thing Doer',
|
331
|
+
)
|
332
|
+
%>
|
61
333
|
```
|
62
334
|
|
63
335
|
## Infos
|
@@ -207,7 +207,7 @@ window_rails.confirm.execute = function(){
|
|
207
207
|
} else if(args.url) {
|
208
208
|
document.location = args.url;
|
209
209
|
} else if(args.callback) {
|
210
|
-
window[args.callback]();
|
210
|
+
window[args.callback](args.element);
|
211
211
|
}
|
212
212
|
}
|
213
213
|
|
@@ -233,7 +233,7 @@ window_rails.loading.open = function(style, title){
|
|
233
233
|
if(style == 'progress'){
|
234
234
|
content = '<div class="progress progress-striped active look-busy"><div class="progress-bar progress-bar-info" aria-valuemax="100" aria-valuemin="0" aria-valuenow="5" role="progressbar" style="width: 5%"></div></div>';
|
235
235
|
} else {
|
236
|
-
content = '<
|
236
|
+
content = '<center><i class="fa fa-spinner fa-4x fa-pulse" /></center>';
|
237
237
|
}
|
238
238
|
window_rails.open_window('loading', {
|
239
239
|
esc_close: false,
|
@@ -307,9 +307,11 @@ window_rails.initialize_window = function(args){
|
|
307
307
|
}
|
308
308
|
name = window_rails.namer(args.name);
|
309
309
|
if(args.size == 'large'){
|
310
|
-
size = 'lg';
|
310
|
+
size = 'modal-lg';
|
311
|
+
} else if(args.size == 'small'){
|
312
|
+
size = 'modal-sm';
|
311
313
|
} else {
|
312
|
-
size = window_rails.config('default_size', '
|
314
|
+
size = window_rails.config('default_size', '');
|
313
315
|
}
|
314
316
|
if(args.footer){
|
315
317
|
footer = '\
|
@@ -322,7 +324,7 @@ window_rails.initialize_window = function(args){
|
|
322
324
|
}
|
323
325
|
$('#window-rails-container').append('\
|
324
326
|
<div id="' + name + '" class="modal fade" role="modal" aria-labelledby="' + name + '" aria-hidden="true">\
|
325
|
-
<div class="modal-dialog
|
327
|
+
<div class="modal-dialog ' + size + '">\
|
326
328
|
<div class="modal-content">\
|
327
329
|
<div class="modal-header">\
|
328
330
|
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">\
|
@@ -400,7 +402,7 @@ window_rails.init = function(){
|
|
400
402
|
<b class="modal-title">Loading...</b>\
|
401
403
|
</div>\
|
402
404
|
<div class="modal-body">\
|
403
|
-
<
|
405
|
+
<center><i class="fa fa-spinner fa-4x fa-pulse" /></center>\
|
404
406
|
</div>\
|
405
407
|
</div>\
|
406
408
|
</div>\
|
@@ -424,8 +426,10 @@ window_rails.hooks.open_window = function(){
|
|
424
426
|
progress: $(this).attr('window-rails-progress'),
|
425
427
|
complete: $(this).attr('window-rails-complete'),
|
426
428
|
error: $(this).attr('window-rails-error'),
|
427
|
-
callback: $(this).attr('window-rails-callback')
|
429
|
+
callback: $(this).attr('window-rails-callback'),
|
430
|
+
element: $(this)
|
428
431
|
});
|
432
|
+
return false;
|
429
433
|
}
|
430
434
|
|
431
435
|
/**
|
@@ -458,4 +462,6 @@ window_rails.hooks.init_links = function(dom_filter){
|
|
458
462
|
}
|
459
463
|
|
460
464
|
// Initialize once page has loaded
|
461
|
-
$(document).ready(window_rails.init);
|
465
|
+
$(document).ready(window_rails.init);
|
466
|
+
$(document).on('page:load', window_rails.init);
|
467
|
+
$(document).ajaxComplete(window_rails.hooks.init);
|
data/lib/window_rails/version.rb
CHANGED
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: window_rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.0.
|
4
|
+
version: 1.0.4
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Chris Roberts
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2015-11-
|
11
|
+
date: 2015-11-20 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: rails
|