bootstrap_modal_rails 2.0.3 → 2.0.4
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/lib/bootstrap_modal_rails/version.rb +1 -1
- data/vendor/assets/javascripts/bootstrap_modal_rails/all.js +3 -0
- data/vendor/assets/javascripts/bootstrap_modal_rails/bootstrap-modal.js +332 -332
- data/vendor/assets/javascripts/bootstrap_modal_rails/bootstrap-modalmanager.js +266 -266
- data/vendor/assets/javascripts/bootstrap_modal_rails/dynamic-modal.js +49 -0
- metadata +6 -5
- data/vendor/assets/javascripts/bootstrap_modal_rails/dynamic-modal.js.coffee +0 -42
|
@@ -18,353 +18,353 @@
|
|
|
18
18
|
|
|
19
19
|
!function ($) {
|
|
20
20
|
|
|
21
|
-
|
|
21
|
+
"use strict"; // jshint ;_;
|
|
22
22
|
|
|
23
|
-
|
|
24
|
-
|
|
23
|
+
/* MODAL MANAGER CLASS DEFINITION
|
|
24
|
+
* ====================== */
|
|
25
25
|
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
26
|
+
var ModalManager = function (element, options) {
|
|
27
|
+
this.init(element, options);
|
|
28
|
+
}
|
|
29
29
|
|
|
30
|
-
|
|
30
|
+
ModalManager.prototype = {
|
|
31
31
|
|
|
32
|
-
|
|
32
|
+
constructor: ModalManager,
|
|
33
33
|
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
34
|
+
init: function (element, options) {
|
|
35
|
+
this.$element = $(element);
|
|
36
|
+
this.options = $.extend({}, $.fn.modalmanager.defaults, this.$element.data(), typeof options == 'object' && options);
|
|
37
|
+
this.stack = [];
|
|
38
|
+
this.backdropCount = 0;
|
|
39
|
+
},
|
|
40
40
|
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
41
|
+
createModal: function (element, options) {
|
|
42
|
+
$(element).modal($.extend({ manager: this }, options));
|
|
43
|
+
},
|
|
44
44
|
|
|
45
|
-
|
|
46
|
-
|
|
45
|
+
appendModal: function (modal) {
|
|
46
|
+
this.stack.push(modal);
|
|
47
47
|
|
|
48
|
-
|
|
48
|
+
var that = this;
|
|
49
49
|
|
|
50
|
-
|
|
51
|
-
|
|
50
|
+
modal.$element.on('show.modalmanager', targetIsSelf(function (e) {
|
|
51
|
+
modal.isShown = true;
|
|
52
52
|
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
53
|
+
var transition = $.support.transition && modal.$element.hasClass('fade');
|
|
54
|
+
|
|
55
|
+
that.$element
|
|
56
|
+
.toggleClass('modal-open', that.hasOpenModal())
|
|
57
|
+
.toggleClass('page-overflow', $(window).height() < that.$element.height());
|
|
58
|
+
|
|
59
|
+
modal.$parent = modal.$element.parent();
|
|
60
|
+
|
|
61
|
+
modal.$container = that.createContainer(modal);
|
|
62
62
|
|
|
63
|
-
|
|
63
|
+
modal.$element.appendTo(modal.$container);
|
|
64
64
|
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
65
|
+
var modalOverflow = $(window).height() < modal.$element.height() || modal.options.modalOverflow;
|
|
66
|
+
|
|
67
|
+
that.backdrop(modal, function () {
|
|
68
68
|
|
|
69
|
-
|
|
69
|
+
modal.$element.show();
|
|
70
70
|
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
71
|
+
if (transition) {
|
|
72
|
+
modal.$element[0].style.display = 'run-in';
|
|
73
|
+
modal.$element[0].offsetWidth;
|
|
74
|
+
modal.$element.one($.support.transition.end, function () { modal.$element[0].style.display = 'block' });
|
|
75
|
+
}
|
|
76
76
|
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
77
|
+
modal.$element
|
|
78
|
+
.toggleClass('modal-overflow', modalOverflow)
|
|
79
|
+
.css('margin-top', modalOverflow ? 0 : 0 - modal.$element.height()/2)
|
|
80
|
+
.addClass('in')
|
|
81
|
+
.attr('aria-hidden', false);
|
|
82
|
+
|
|
83
|
+
var complete = function () {
|
|
84
|
+
that.setFocus();
|
|
85
|
+
modal.$element.triggerHandler('shown');
|
|
86
|
+
}
|
|
87
87
|
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
88
|
+
transition ?
|
|
89
|
+
modal.$element.one($.support.transition.end, complete) :
|
|
90
|
+
complete();
|
|
91
|
+
});
|
|
92
|
+
}));
|
|
93
93
|
|
|
94
|
-
|
|
94
|
+
modal.$element.on('hidden.modalmanager', targetIsSelf(function (e) {
|
|
95
95
|
|
|
96
|
-
|
|
96
|
+
that.backdrop(modal);
|
|
97
97
|
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
98
|
+
if (modal.$backdrop){
|
|
99
|
+
$.support.transition && modal.$element.hasClass('fade')?
|
|
100
|
+
modal.$backdrop.one($.support.transition.end, function () { that.destroyModal(modal) }) :
|
|
101
|
+
that.destroyModal(modal);
|
|
102
|
+
} else {
|
|
103
|
+
that.destroyModal(modal);
|
|
104
|
+
}
|
|
105
105
|
|
|
106
|
-
|
|
106
|
+
}));
|
|
107
107
|
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
108
|
+
modal.$element.on('destroy.modalmanager', targetIsSelf(function (e) {
|
|
109
|
+
that.removeModal(modal);
|
|
110
|
+
}));
|
|
111
|
+
},
|
|
112
|
+
|
|
113
|
+
destroyModal: function (modal) {
|
|
114
114
|
|
|
115
|
-
|
|
115
|
+
modal.destroy();
|
|
116
116
|
|
|
117
|
-
|
|
117
|
+
var hasOpenModal = this.hasOpenModal();
|
|
118
118
|
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
119
|
+
this.$element.toggleClass('modal-open', hasOpenModal);
|
|
120
|
+
|
|
121
|
+
if (!hasOpenModal){
|
|
122
|
+
this.$element.removeClass('page-overflow');
|
|
123
|
+
}
|
|
124
124
|
|
|
125
|
-
|
|
125
|
+
this.removeContainer(modal);
|
|
126
126
|
|
|
127
|
-
|
|
128
|
-
|
|
127
|
+
this.setFocus();
|
|
128
|
+
},
|
|
129
129
|
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
130
|
+
hasOpenModal: function () {
|
|
131
|
+
for (var i = 0; i < this.stack.length; i++){
|
|
132
|
+
if (this.stack[i].isShown) return true;
|
|
133
|
+
}
|
|
134
134
|
|
|
135
|
-
|
|
136
|
-
|
|
135
|
+
return false;
|
|
136
|
+
},
|
|
137
137
|
|
|
138
|
-
|
|
139
|
-
|
|
138
|
+
setFocus: function () {
|
|
139
|
+
var topModal;
|
|
140
140
|
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
141
|
+
for (var i = 0; i < this.stack.length; i++){
|
|
142
|
+
if (this.stack[i].isShown) topModal = this.stack[i];
|
|
143
|
+
}
|
|
144
144
|
|
|
145
|
-
|
|
145
|
+
if (!topModal) return;
|
|
146
146
|
|
|
147
|
-
|
|
147
|
+
topModal.focus();
|
|
148
148
|
|
|
149
|
-
|
|
149
|
+
},
|
|
150
150
|
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
151
|
+
removeModal: function (modal) {
|
|
152
|
+
modal.$element.off('.modalmanager');
|
|
153
|
+
if (modal.$backdrop) this.removeBackdrop.call(modal);
|
|
154
|
+
this.stack.splice(this.getIndexOfModal(modal), 1);
|
|
155
|
+
},
|
|
156
156
|
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
157
|
+
getModalAt: function (index) {
|
|
158
|
+
return this.stack[index];
|
|
159
|
+
},
|
|
160
160
|
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
161
|
+
getIndexOfModal: function (modal) {
|
|
162
|
+
for (var i = 0; i < this.stack.length; i++){
|
|
163
|
+
if (modal === this.stack[i]) return i;
|
|
164
|
+
}
|
|
165
|
+
},
|
|
166
166
|
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
167
|
+
removeBackdrop: function (modal) {
|
|
168
|
+
modal.$backdrop.remove();
|
|
169
|
+
modal.$backdrop = null;
|
|
170
|
+
},
|
|
171
171
|
|
|
172
|
-
|
|
173
|
-
|
|
172
|
+
createBackdrop: function (animate) {
|
|
173
|
+
var $backdrop;
|
|
174
174
|
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
175
|
+
if (!this.isLoading) {
|
|
176
|
+
$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
|
|
177
|
+
.appendTo(this.$element);
|
|
178
178
|
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
179
|
+
} else {
|
|
180
|
+
$backdrop = this.$loading;
|
|
181
|
+
$backdrop.off('.modalmanager');
|
|
182
|
+
this.$spinner.remove();
|
|
183
|
+
this.isLoading = false;
|
|
184
|
+
this.$loading = this.$spinner = null;
|
|
185
|
+
}
|
|
186
186
|
|
|
187
|
-
|
|
188
|
-
|
|
187
|
+
return $backdrop
|
|
188
|
+
},
|
|
189
189
|
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
190
|
+
removeContainer: function (modal) {
|
|
191
|
+
modal.$container.remove();
|
|
192
|
+
modal.$container = null;
|
|
193
|
+
},
|
|
194
194
|
|
|
195
|
-
|
|
196
|
-
|
|
195
|
+
createContainer: function (modal) {
|
|
196
|
+
var $container;
|
|
197
197
|
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
198
|
+
$container = $('<div class="modal-scrollable">')
|
|
199
|
+
.css('z-index', getzIndex( 'modal',
|
|
200
|
+
modal ? this.getIndexOfModal(modal) : this.stack.length ))
|
|
201
|
+
.appendTo(this.$element);
|
|
202
202
|
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
203
|
+
if (modal && modal.options.backdrop != 'static') {
|
|
204
|
+
$container.on('click.modal', targetIsSelf(function (e) {
|
|
205
|
+
modal.hide();
|
|
206
|
+
}));
|
|
207
|
+
} else if (modal) {
|
|
208
|
+
$container.on('click.modal', targetIsSelf(function (e) {
|
|
209
|
+
modal.attention();
|
|
210
|
+
}));
|
|
211
|
+
}
|
|
212
212
|
|
|
213
|
-
|
|
213
|
+
return $container;
|
|
214
214
|
|
|
215
|
-
|
|
215
|
+
},
|
|
216
216
|
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
217
|
+
backdrop: function (modal, callback) {
|
|
218
|
+
var animate = modal.$element.hasClass('fade') ? 'fade' : '',
|
|
219
|
+
showBackdrop = modal.options.backdrop &&
|
|
220
|
+
this.backdropCount < this.options.backdropLimit;
|
|
221
221
|
|
|
222
|
-
|
|
223
|
-
|
|
222
|
+
if (modal.isShown && showBackdrop) {
|
|
223
|
+
var doAnimate = $.support.transition && animate && !this.isLoading;
|
|
224
224
|
|
|
225
225
|
|
|
226
|
-
|
|
226
|
+
modal.$backdrop = this.createBackdrop(animate);
|
|
227
227
|
|
|
228
|
-
|
|
228
|
+
modal.$backdrop.css('z-index', getzIndex( 'backdrop', this.getIndexOfModal(modal) ))
|
|
229
229
|
|
|
230
|
-
|
|
230
|
+
if (doAnimate) modal.$backdrop[0].offsetWidth // force reflow
|
|
231
231
|
|
|
232
|
-
|
|
232
|
+
modal.$backdrop.addClass('in')
|
|
233
233
|
|
|
234
|
-
|
|
234
|
+
this.backdropCount += 1;
|
|
235
235
|
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
236
|
+
doAnimate ?
|
|
237
|
+
modal.$backdrop.one($.support.transition.end, callback) :
|
|
238
|
+
callback();
|
|
239
239
|
|
|
240
|
-
|
|
241
|
-
|
|
240
|
+
} else if (!modal.isShown && modal.$backdrop) {
|
|
241
|
+
modal.$backdrop.removeClass('in');
|
|
242
242
|
|
|
243
|
-
|
|
243
|
+
this.backdropCount -= 1;
|
|
244
244
|
|
|
245
|
-
|
|
245
|
+
var that = this;
|
|
246
246
|
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
247
|
+
$.support.transition && modal.$element.hasClass('fade')?
|
|
248
|
+
modal.$backdrop.one($.support.transition.end, function () { that.removeBackdrop(modal) }) :
|
|
249
|
+
that.removeBackdrop(modal);
|
|
250
250
|
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
251
|
+
} else if (callback) {
|
|
252
|
+
callback();
|
|
253
|
+
}
|
|
254
|
+
},
|
|
255
255
|
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
256
|
+
removeLoading: function () {
|
|
257
|
+
this.$loading && this.$loading.remove();
|
|
258
|
+
this.$loading = null;
|
|
259
|
+
this.isLoading = false;
|
|
260
|
+
},
|
|
261
261
|
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
262
|
+
loading: function (callback) {
|
|
263
|
+
callback = callback || function () { };
|
|
264
|
+
|
|
265
|
+
this.$element
|
|
266
|
+
.toggleClass('modal-open', !this.isLoading || this.hasOpenModal())
|
|
267
|
+
.toggleClass('page-overflow', $(window).height() < this.$element.height());
|
|
268
|
+
|
|
269
|
+
if (!this.isLoading) {
|
|
270
270
|
|
|
271
|
-
|
|
271
|
+
this.$loading = this.createBackdrop('fade');
|
|
272
272
|
|
|
273
|
-
|
|
273
|
+
this.$loading[0].offsetWidth // force reflow
|
|
274
274
|
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
275
|
+
this.$loading
|
|
276
|
+
.css('z-index', getzIndex('backdrop', this.stack.length))
|
|
277
|
+
.addClass('in');
|
|
278
278
|
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
279
|
+
var $spinner = $(this.options.spinner)
|
|
280
|
+
.css('z-index', getzIndex('modal', this.stack.length))
|
|
281
|
+
.appendTo(this.$element)
|
|
282
|
+
.addClass('in');
|
|
283
283
|
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
284
|
+
this.$spinner = $(this.createContainer())
|
|
285
|
+
.append($spinner)
|
|
286
|
+
.on('click.modalmanager', $.proxy(this.loading, this));
|
|
287
287
|
|
|
288
|
-
|
|
288
|
+
this.isLoading = true;
|
|
289
289
|
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
290
|
+
$.support.transition ?
|
|
291
|
+
this.$loading.one($.support.transition.end, callback) :
|
|
292
|
+
callback();
|
|
293
293
|
|
|
294
|
-
|
|
295
|
-
|
|
294
|
+
} else if (this.isLoading && this.$loading) {
|
|
295
|
+
this.$loading.removeClass('in');
|
|
296
296
|
|
|
297
|
-
|
|
297
|
+
if (this.$spinner) this.$spinner.remove();
|
|
298
298
|
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
299
|
+
var that = this;
|
|
300
|
+
$.support.transition ?
|
|
301
|
+
this.$loading.one($.support.transition.end, function () { that.removeLoading() }) :
|
|
302
|
+
that.removeLoading();
|
|
303
303
|
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
304
|
+
} else if (callback) {
|
|
305
|
+
callback(this.isLoading);
|
|
306
|
+
}
|
|
307
|
+
}
|
|
308
|
+
}
|
|
309
309
|
|
|
310
|
-
|
|
311
|
-
|
|
310
|
+
/* PRIVATE METHODS
|
|
311
|
+
* ======================= */
|
|
312
312
|
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
313
|
+
// computes and caches the zindexes
|
|
314
|
+
var getzIndex = (function () {
|
|
315
|
+
var zIndexFactor,
|
|
316
|
+
baseIndex = {};
|
|
317
317
|
|
|
318
|
-
|
|
318
|
+
return function (type, pos) {
|
|
319
319
|
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
320
|
+
if (typeof zIndexFactor === 'undefined'){
|
|
321
|
+
var $baseModal = $('<div class="modal hide" />').appendTo('body'),
|
|
322
|
+
$baseBackdrop = $('<div class="modal-backdrop hide" />').appendTo('body');
|
|
323
323
|
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
324
|
+
baseIndex['modal'] = +$baseModal.css('z-index'),
|
|
325
|
+
baseIndex['backdrop'] = +$baseBackdrop.css('z-index'),
|
|
326
|
+
zIndexFactor = baseIndex['modal'] - baseIndex['backdrop'];
|
|
327
|
+
|
|
328
|
+
$baseModal.remove();
|
|
329
|
+
$baseBackdrop.remove();
|
|
330
|
+
$baseBackdrop = $baseModal = null;
|
|
331
|
+
}
|
|
332
332
|
|
|
333
|
-
|
|
333
|
+
return baseIndex[type] + (zIndexFactor * pos);
|
|
334
334
|
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
335
|
+
}
|
|
336
|
+
}())
|
|
337
|
+
|
|
338
|
+
// make sure the event target is the modal itself in order to prevent
|
|
339
|
+
// other components such as tabsfrom triggering the modal manager.
|
|
340
|
+
// if Boostsrap namespaced events, this would not be needed.
|
|
341
|
+
function targetIsSelf(callback){
|
|
342
|
+
return function (e) {
|
|
343
|
+
if (this === e.target){
|
|
344
|
+
return callback.apply(this, arguments);
|
|
345
|
+
}
|
|
346
|
+
}
|
|
347
|
+
}
|
|
348
|
+
|
|
349
|
+
|
|
350
|
+
/* MODAL MANAGER PLUGIN DEFINITION
|
|
351
|
+
* ======================= */
|
|
352
|
+
|
|
353
|
+
$.fn.modalmanager = function (option) {
|
|
354
|
+
return this.each(function () {
|
|
355
|
+
var $this = $(this),
|
|
356
|
+
data = $this.data('modalmanager');
|
|
357
|
+
|
|
358
|
+
if (!data) $this.data('modalmanager', (data = new ModalManager(this, option)))
|
|
359
|
+
if (typeof option === 'string') data[option]()
|
|
360
|
+
})
|
|
361
|
+
}
|
|
362
|
+
|
|
363
|
+
$.fn.modalmanager.defaults = {
|
|
364
|
+
backdropLimit: 999,
|
|
365
|
+
spinner: '<div class="loading-spinner fade" style="width: 200px; margin-left: -100px;"><div class="progress progress-striped active"><div class="bar" style="width: 100%;"></div></div></div>'
|
|
366
|
+
}
|
|
367
367
|
|
|
368
|
-
|
|
368
|
+
$.fn.modalmanager.Constructor = ModalManager
|
|
369
369
|
|
|
370
370
|
}(jQuery);
|