bootstrap-modal-rails 2.0 → 2.1
Sign up to get free protection for your applications and to get access to all the features.
data/README.md
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
# Bootstrap::Modal::Rails
|
2
2
|
|
3
|
-
Rails Asset Gem for the default [https://github.com/jschr/bootstrap-modal
|
3
|
+
Rails Asset Gem for the default [Bootstrap Modal](https://github.com/jschr/bootstrap-modal) class by [Jordan Schroter](https://github.com/jschr)
|
4
4
|
|
5
5
|
## Installation
|
6
6
|
|
@@ -1,5 +1,5 @@
|
|
1
1
|
/* ===========================================================
|
2
|
-
* bootstrap-modal.js v2.
|
2
|
+
* bootstrap-modal.js v2.1
|
3
3
|
* ===========================================================
|
4
4
|
* Copyright 2012 Jordan Schroter
|
5
5
|
*
|
@@ -20,79 +20,55 @@
|
|
20
20
|
!function ($) {
|
21
21
|
|
22
22
|
"use strict"; // jshint ;_;
|
23
|
-
|
23
|
+
|
24
24
|
/* MODAL CLASS DEFINITION
|
25
25
|
* ====================== */
|
26
26
|
|
27
27
|
var Modal = function (element, options) {
|
28
28
|
this.init(element, options);
|
29
|
-
}
|
29
|
+
};
|
30
30
|
|
31
31
|
Modal.prototype = {
|
32
32
|
|
33
|
-
constructor: Modal,
|
34
|
-
|
33
|
+
constructor: Modal,
|
34
|
+
|
35
35
|
init: function (element, options) {
|
36
36
|
this.options = options;
|
37
|
-
|
37
|
+
|
38
38
|
this.$element = $(element)
|
39
39
|
.delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this));
|
40
|
-
|
40
|
+
|
41
41
|
this.options.remote && this.$element.find('.modal-body').load(this.options.remote);
|
42
|
-
|
43
|
-
var manager = typeof this.options.manager === 'function' ?
|
42
|
+
|
43
|
+
var manager = typeof this.options.manager === 'function' ?
|
44
44
|
this.options.manager.call(this) : this.options.manager;
|
45
45
|
|
46
|
-
manager = manager.appendModal ?
|
46
|
+
manager = manager.appendModal ?
|
47
47
|
manager : $(manager).modalmanager().data('modalmanager');
|
48
48
|
|
49
49
|
manager.appendModal(this);
|
50
|
-
},
|
51
|
-
|
50
|
+
},
|
51
|
+
|
52
52
|
toggle: function () {
|
53
53
|
return this[!this.isShown ? 'show' : 'hide']();
|
54
|
-
},
|
55
|
-
|
54
|
+
},
|
55
|
+
|
56
56
|
show: function () {
|
57
|
-
var
|
58
|
-
|
59
|
-
|
57
|
+
var e = $.Event('show');
|
58
|
+
|
60
59
|
if (this.isShown) return;
|
61
60
|
|
62
61
|
this.$element.triggerHandler(e);
|
63
62
|
|
64
63
|
if (e.isDefaultPrevented()) return;
|
65
|
-
|
66
|
-
if (this.options.width){
|
67
|
-
this.$element.css('width', this.options.width);
|
68
|
-
|
69
|
-
var that = this;
|
70
|
-
this.$element.css('margin-left', function () {
|
71
|
-
if (/%/ig.test(that.options.width)){
|
72
|
-
return -(parseInt(that.options.width) / 2) + '%';
|
73
|
-
} else {
|
74
|
-
return -($(this).width() / 2) + 'px';
|
75
|
-
}
|
76
|
-
});
|
77
|
-
}
|
78
|
-
|
79
|
-
var prop = this.options.height ? 'height' : 'max-height';
|
80
|
-
|
81
|
-
var value = this.options.height || this.options.maxHeight;
|
82
|
-
|
83
|
-
if (value){
|
84
|
-
this.$element.find('.modal-body')
|
85
|
-
.css('overflow', 'auto')
|
86
|
-
.css(prop, value);
|
87
|
-
}
|
88
64
|
|
89
65
|
this.escape();
|
90
66
|
|
91
67
|
this.tab();
|
92
|
-
|
68
|
+
|
93
69
|
this.options.loading && this.loading();
|
94
|
-
},
|
95
|
-
|
70
|
+
},
|
71
|
+
|
96
72
|
hide: function (e) {
|
97
73
|
e && e.preventDefault();
|
98
74
|
|
@@ -107,7 +83,7 @@
|
|
107
83
|
this.escape();
|
108
84
|
|
109
85
|
this.tab();
|
110
|
-
|
86
|
+
|
111
87
|
this.isLoading && this.loading();
|
112
88
|
|
113
89
|
$(document).off('focusin.modal');
|
@@ -122,108 +98,149 @@
|
|
122
98
|
$.support.transition && this.$element.hasClass('fade') ?
|
123
99
|
this.hideWithTransition() :
|
124
100
|
this.hideModal();
|
125
|
-
},
|
101
|
+
},
|
102
|
+
|
103
|
+
layout: function () {
|
104
|
+
var prop = this.options.height ? 'height' : 'max-height',
|
105
|
+
value = this.options.height || this.options.maxHeight;
|
106
|
+
|
107
|
+
if (this.options.width){
|
108
|
+
this.$element.css('width', this.options.width);
|
109
|
+
|
110
|
+
var that = this;
|
111
|
+
this.$element.css('margin-left', function () {
|
112
|
+
if (/%/ig.test(that.options.width)){
|
113
|
+
return -(parseInt(that.options.width) / 2) + '%';
|
114
|
+
} else {
|
115
|
+
return -($(this).width() / 2) + 'px';
|
116
|
+
}
|
117
|
+
});
|
118
|
+
} else {
|
119
|
+
this.$element.css('width', '');
|
120
|
+
this.$element.css('margin-left', '');
|
121
|
+
}
|
122
|
+
|
123
|
+
this.$element.find('.modal-body')
|
124
|
+
.css('overflow', '')
|
125
|
+
.css(prop, '');
|
126
|
+
|
127
|
+
var modalOverflow = $(window).height() - 10 < this.$element.height();
|
128
|
+
|
129
|
+
if (value){
|
130
|
+
this.$element.find('.modal-body')
|
131
|
+
.css('overflow', 'auto')
|
132
|
+
.css(prop, value);
|
133
|
+
}
|
134
|
+
|
135
|
+
if (modalOverflow || this.options.modalOverflow) {
|
136
|
+
this.$element
|
137
|
+
.css('margin-top', 0)
|
138
|
+
.addClass('modal-overflow');
|
139
|
+
} else {
|
140
|
+
this.$element
|
141
|
+
.css('margin-top', 0 - this.$element.height() / 2)
|
142
|
+
.removeClass('modal-overflow');
|
143
|
+
}
|
144
|
+
},
|
126
145
|
|
127
146
|
tab: function () {
|
128
147
|
var that = this;
|
129
148
|
|
130
|
-
if (this.isShown && this.options.consumeTab) {
|
131
|
-
this.$element.on('keydown.tabindex.modal', '[data-tabindex]', function (e) {
|
132
|
-
if (e.keyCode && e.keyCode == 9){
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
});
|
149
|
+
if (this.isShown && this.options.consumeTab) {
|
150
|
+
this.$element.on('keydown.tabindex.modal', '[data-tabindex]', function (e) {
|
151
|
+
if (e.keyCode && e.keyCode == 9){
|
152
|
+
var $next = $(this),
|
153
|
+
$rollover = $(this);
|
154
|
+
|
155
|
+
that.$element.find('[data-tabindex]:enabled:not([readonly])').each(function (e) {
|
156
|
+
if (!e.shiftKey){
|
157
|
+
$next = $next.data('tabindex') < $(this).data('tabindex') ?
|
158
|
+
$next = $(this) :
|
159
|
+
$rollover = $(this);
|
160
|
+
} else {
|
161
|
+
$next = $next.data('tabindex') > $(this).data('tabindex') ?
|
162
|
+
$next = $(this) :
|
163
|
+
$rollover = $(this);
|
164
|
+
}
|
165
|
+
});
|
166
|
+
|
167
|
+
$next[0] !== $(this)[0] ?
|
168
|
+
$next.focus() : $rollover.focus();
|
169
|
+
|
170
|
+
e.preventDefault();
|
171
|
+
}
|
172
|
+
});
|
155
173
|
} else if (!this.isShown) {
|
156
174
|
this.$element.off('keydown.tabindex.modal');
|
157
175
|
}
|
158
|
-
},
|
159
|
-
|
176
|
+
},
|
177
|
+
|
160
178
|
escape: function () {
|
161
179
|
var that = this;
|
162
180
|
if (this.isShown && this.options.keyboard) {
|
163
181
|
if (!this.$element.attr('tabindex')) this.$element.attr('tabindex', -1);
|
164
|
-
|
182
|
+
|
165
183
|
this.$element.on('keyup.dismiss.modal', function (e) {
|
166
184
|
e.which == 27 && that.hide();
|
167
185
|
});
|
168
186
|
} else if (!this.isShown) {
|
169
187
|
this.$element.off('keyup.dismiss.modal')
|
170
188
|
}
|
171
|
-
},
|
172
|
-
|
189
|
+
},
|
190
|
+
|
173
191
|
hideWithTransition: function () {
|
174
192
|
var that = this
|
175
193
|
, timeout = setTimeout(function () {
|
176
|
-
that.$element.off($.support.transition.end)
|
177
|
-
that.hideModal()
|
194
|
+
that.$element.off($.support.transition.end);
|
195
|
+
that.hideModal();
|
178
196
|
}, 500);
|
179
197
|
|
180
198
|
this.$element.one($.support.transition.end, function () {
|
181
|
-
clearTimeout(timeout)
|
182
|
-
that.hideModal()
|
199
|
+
clearTimeout(timeout);
|
200
|
+
that.hideModal();
|
183
201
|
});
|
184
|
-
},
|
185
|
-
|
202
|
+
},
|
203
|
+
|
186
204
|
hideModal: function () {
|
187
205
|
this.$element
|
188
206
|
.hide()
|
189
207
|
.triggerHandler('hidden');
|
190
208
|
|
191
|
-
|
192
209
|
var prop = this.options.height ? 'height' : 'max-height';
|
193
210
|
var value = this.options.height || this.options.maxHeight;
|
194
|
-
|
211
|
+
|
195
212
|
if (value){
|
196
213
|
this.$element.find('.modal-body')
|
197
214
|
.css('overflow', '')
|
198
215
|
.css(prop, '');
|
199
216
|
}
|
200
217
|
|
201
|
-
},
|
218
|
+
},
|
202
219
|
|
203
220
|
removeLoading: function () {
|
204
221
|
this.$loading.remove();
|
205
222
|
this.$loading = null;
|
206
223
|
this.isLoading = false;
|
207
224
|
},
|
208
|
-
|
225
|
+
|
209
226
|
loading: function (callback) {
|
210
227
|
callback = callback || function () {};
|
211
|
-
|
228
|
+
|
212
229
|
var animate = this.$element.hasClass('fade') ? 'fade' : '';
|
213
|
-
|
230
|
+
|
214
231
|
if (!this.isLoading) {
|
215
232
|
var doAnimate = $.support.transition && animate;
|
216
|
-
|
233
|
+
|
217
234
|
this.$loading = $('<div class="loading-mask ' + animate + '">')
|
218
235
|
.append(this.options.spinner)
|
219
236
|
.appendTo(this.$element);
|
220
237
|
|
221
|
-
if (doAnimate) this.$loading[0].offsetWidth // force reflow
|
222
|
-
|
223
|
-
this.$loading.addClass('in')
|
238
|
+
if (doAnimate) this.$loading[0].offsetWidth; // force reflow
|
239
|
+
|
240
|
+
this.$loading.addClass('in');
|
224
241
|
|
225
242
|
this.isLoading = true;
|
226
|
-
|
243
|
+
|
227
244
|
doAnimate ?
|
228
245
|
this.$loading.one($.support.transition.end, callback) :
|
229
246
|
callback();
|
@@ -240,7 +257,7 @@
|
|
240
257
|
callback(this.isLoading);
|
241
258
|
}
|
242
259
|
},
|
243
|
-
|
260
|
+
|
244
261
|
focus: function () {
|
245
262
|
var $focusElem = this.$element.find(this.options.focusOn);
|
246
263
|
|
@@ -269,17 +286,17 @@
|
|
269
286
|
|
270
287
|
this.focus();
|
271
288
|
},
|
272
|
-
|
289
|
+
|
273
290
|
|
274
291
|
destroy: function () {
|
275
292
|
var e = $.Event('destroy');
|
276
293
|
this.$element.triggerHandler(e);
|
277
294
|
if (e.isDefaultPrevented()) return;
|
278
|
-
|
295
|
+
|
279
296
|
this.teardown();
|
280
297
|
},
|
281
|
-
|
282
|
-
teardown: function () {
|
298
|
+
|
299
|
+
teardown: function () {
|
283
300
|
if (!this.$parent.length){
|
284
301
|
this.$element.remove();
|
285
302
|
this.$element = null;
|
@@ -296,26 +313,26 @@
|
|
296
313
|
.removeClass('in')
|
297
314
|
.attr('aria-hidden', true);
|
298
315
|
}
|
299
|
-
}
|
316
|
+
};
|
300
317
|
|
301
318
|
|
302
319
|
/* MODAL PLUGIN DEFINITION
|
303
320
|
* ======================= */
|
304
321
|
|
305
|
-
$.fn.modal = function (option) {
|
322
|
+
$.fn.modal = function (option, args) {
|
306
323
|
return this.each(function () {
|
307
|
-
var $this = $(this),
|
308
|
-
data = $this.data('modal'),
|
324
|
+
var $this = $(this),
|
325
|
+
data = $this.data('modal'),
|
309
326
|
options = $.extend({}, $.fn.modal.defaults, $this.data(), typeof option == 'object' && option);
|
310
327
|
|
311
|
-
if (!data) $this.data('modal', (data = new Modal(this, options)))
|
312
|
-
if (typeof option == 'string') data[option]()
|
328
|
+
if (!data) $this.data('modal', (data = new Modal(this, options)));
|
329
|
+
if (typeof option == 'string') data[option].apply(data, [].concat(args));
|
313
330
|
else if (options.show) data.show()
|
314
331
|
})
|
315
|
-
}
|
332
|
+
};
|
316
333
|
|
317
334
|
$.fn.modal.defaults = {
|
318
|
-
keyboard: true,
|
335
|
+
keyboard: true,
|
319
336
|
backdrop: true,
|
320
337
|
loading: false,
|
321
338
|
show: true,
|
@@ -325,22 +342,24 @@
|
|
325
342
|
modalOverflow: false,
|
326
343
|
consumeTab: true,
|
327
344
|
focusOn: null,
|
345
|
+
replace: false,
|
346
|
+
resize: false,
|
328
347
|
attentionAnimation: 'shake',
|
329
348
|
manager: 'body',
|
330
349
|
spinner: '<div class="loading-spinner" style="width: 200px; margin-left: -100px;"><div class="progress progress-striped active"><div class="bar" style="width: 100%;"></div></div></div>'
|
331
|
-
}
|
350
|
+
};
|
332
351
|
|
333
|
-
$.fn.modal.Constructor = Modal
|
352
|
+
$.fn.modal.Constructor = Modal;
|
334
353
|
|
335
354
|
|
336
355
|
/* MODAL DATA-API
|
337
356
|
* ============== */
|
338
|
-
|
357
|
+
|
339
358
|
$(function () {
|
340
359
|
$(document).off('.modal').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) {
|
341
|
-
var $this = $(this),
|
342
|
-
href = $this.attr('href'),
|
343
|
-
$target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))), //strip for ie7
|
360
|
+
var $this = $(this),
|
361
|
+
href = $this.attr('href'),
|
362
|
+
$target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))), //strip for ie7
|
344
363
|
option = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data());
|
345
364
|
|
346
365
|
e.preventDefault();
|
@@ -352,4 +371,4 @@
|
|
352
371
|
});
|
353
372
|
});
|
354
373
|
|
355
|
-
}(window.jQuery);
|
374
|
+
}(window.jQuery);
|
@@ -1,5 +1,5 @@
|
|
1
|
-
|
2
|
-
* bootstrap-modalmanager.js v2.
|
1
|
+
/* ===========================================================
|
2
|
+
* bootstrap-modalmanager.js v2.1
|
3
3
|
* ===========================================================
|
4
4
|
* Copyright 2012 Jordan Schroter.
|
5
5
|
*
|
@@ -25,7 +25,7 @@
|
|
25
25
|
|
26
26
|
var ModalManager = function (element, options) {
|
27
27
|
this.init(element, options);
|
28
|
-
}
|
28
|
+
};
|
29
29
|
|
30
30
|
ModalManager.prototype = {
|
31
31
|
|
@@ -36,6 +36,20 @@
|
|
36
36
|
this.options = $.extend({}, $.fn.modalmanager.defaults, this.$element.data(), typeof options == 'object' && options);
|
37
37
|
this.stack = [];
|
38
38
|
this.backdropCount = 0;
|
39
|
+
|
40
|
+
if (this.options.resize) {
|
41
|
+
var resizeTimeout,
|
42
|
+
that = this;
|
43
|
+
|
44
|
+
$(window).on('resize.modal', function(){
|
45
|
+
resizeTimeout && clearTimeout(resizeTimeout);
|
46
|
+
resizeTimeout = setTimeout(function(){
|
47
|
+
for (var i = 0; i < that.stack.length; i++){
|
48
|
+
that.stack[i].isShown && that.stack[i].layout();
|
49
|
+
}
|
50
|
+
}, 10);
|
51
|
+
});
|
52
|
+
}
|
39
53
|
},
|
40
54
|
|
41
55
|
createModal: function (element, options) {
|
@@ -48,47 +62,46 @@
|
|
48
62
|
var that = this;
|
49
63
|
|
50
64
|
modal.$element.on('show.modalmanager', targetIsSelf(function (e) {
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
modal.$element
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
});
|
65
|
+
|
66
|
+
var showModal = function(){
|
67
|
+
modal.isShown = true;
|
68
|
+
|
69
|
+
var transition = $.support.transition && modal.$element.hasClass('fade');
|
70
|
+
|
71
|
+
that.$element
|
72
|
+
.toggleClass('modal-open', that.hasOpenModal())
|
73
|
+
.toggleClass('page-overflow', $(window).height() < that.$element.height());
|
74
|
+
|
75
|
+
modal.$parent = modal.$element.parent();
|
76
|
+
|
77
|
+
modal.$container = that.createContainer(modal);
|
78
|
+
|
79
|
+
modal.$element.appendTo(modal.$container);
|
80
|
+
|
81
|
+
that.backdrop(modal, function () {
|
82
|
+
|
83
|
+
modal.$element.show();
|
84
|
+
|
85
|
+
modal.layout();
|
86
|
+
|
87
|
+
modal.$element
|
88
|
+
.addClass('in')
|
89
|
+
.attr('aria-hidden', false);
|
90
|
+
|
91
|
+
var complete = function () {
|
92
|
+
that.setFocus();
|
93
|
+
modal.$element.triggerHandler('shown');
|
94
|
+
};
|
95
|
+
|
96
|
+
transition ?
|
97
|
+
modal.$element.one($.support.transition.end, complete) :
|
98
|
+
complete();
|
99
|
+
});
|
100
|
+
};
|
101
|
+
|
102
|
+
modal.options.replace ?
|
103
|
+
that.replace(showModal) :
|
104
|
+
showModal();
|
92
105
|
}));
|
93
106
|
|
94
107
|
modal.$element.on('hidden.modalmanager', targetIsSelf(function (e) {
|
@@ -96,7 +109,7 @@
|
|
96
109
|
that.backdrop(modal);
|
97
110
|
|
98
111
|
if (modal.$backdrop){
|
99
|
-
$.support.transition && modal.$element.hasClass('fade')?
|
112
|
+
$.support.transition && modal.$element.hasClass('fade') ?
|
100
113
|
modal.$backdrop.one($.support.transition.end, function () { that.destroyModal(modal) }) :
|
101
114
|
that.destroyModal(modal);
|
102
115
|
} else {
|
@@ -108,6 +121,7 @@
|
|
108
121
|
modal.$element.on('destroy.modalmanager', targetIsSelf(function (e) {
|
109
122
|
that.removeModal(modal);
|
110
123
|
}));
|
124
|
+
|
111
125
|
},
|
112
126
|
|
113
127
|
destroyModal: function (modal) {
|
@@ -117,7 +131,7 @@
|
|
117
131
|
var hasOpenModal = this.hasOpenModal();
|
118
132
|
|
119
133
|
this.$element.toggleClass('modal-open', hasOpenModal);
|
120
|
-
|
134
|
+
|
121
135
|
if (!hasOpenModal){
|
122
136
|
this.$element.removeClass('page-overflow');
|
123
137
|
}
|
@@ -164,24 +178,42 @@
|
|
164
178
|
}
|
165
179
|
},
|
166
180
|
|
181
|
+
replace: function (callback) {
|
182
|
+
var topModal;
|
183
|
+
|
184
|
+
for (var i = 0; i < this.stack.length; i++){
|
185
|
+
if (this.stack[i].isShown) topModal = this.stack[i];
|
186
|
+
}
|
187
|
+
|
188
|
+
if (topModal) {
|
189
|
+
this.$backdropHandle = topModal.$backdrop;
|
190
|
+
topModal.$backdrop = null;
|
191
|
+
|
192
|
+
callback && topModal.$element.one('hidden',
|
193
|
+
targetIsSelf( $.proxy(callback, this) ));
|
194
|
+
|
195
|
+
topModal.hide();
|
196
|
+
} else if (callback) {
|
197
|
+
callback();
|
198
|
+
}
|
199
|
+
},
|
200
|
+
|
167
201
|
removeBackdrop: function (modal) {
|
168
202
|
modal.$backdrop.remove();
|
169
203
|
modal.$backdrop = null;
|
170
|
-
},
|
204
|
+
},
|
171
205
|
|
172
206
|
createBackdrop: function (animate) {
|
173
207
|
var $backdrop;
|
174
208
|
|
175
|
-
if (!this
|
209
|
+
if (!this.$backdropHandle) {
|
176
210
|
$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
|
177
211
|
.appendTo(this.$element);
|
178
|
-
|
179
212
|
} else {
|
180
|
-
$backdrop = this.$
|
213
|
+
$backdrop = this.$backdropHandle;
|
181
214
|
$backdrop.off('.modalmanager');
|
182
|
-
this.$
|
183
|
-
this.isLoading
|
184
|
-
this.$loading = this.$spinner = null;
|
215
|
+
this.$backdropHandle = null;
|
216
|
+
this.isLoading && this.removeSpinner();
|
185
217
|
}
|
186
218
|
|
187
219
|
return $backdrop
|
@@ -190,13 +222,13 @@
|
|
190
222
|
removeContainer: function (modal) {
|
191
223
|
modal.$container.remove();
|
192
224
|
modal.$container = null;
|
193
|
-
},
|
225
|
+
},
|
194
226
|
|
195
227
|
createContainer: function (modal) {
|
196
228
|
var $container;
|
197
229
|
|
198
230
|
$container = $('<div class="modal-scrollable">')
|
199
|
-
.css('z-index', getzIndex( 'modal',
|
231
|
+
.css('z-index', getzIndex( 'modal',
|
200
232
|
modal ? this.getIndexOfModal(modal) : this.stack.length ))
|
201
233
|
.appendTo(this.$element);
|
202
234
|
|
@@ -216,20 +248,19 @@
|
|
216
248
|
|
217
249
|
backdrop: function (modal, callback) {
|
218
250
|
var animate = modal.$element.hasClass('fade') ? 'fade' : '',
|
219
|
-
showBackdrop = modal.options.backdrop &&
|
251
|
+
showBackdrop = modal.options.backdrop &&
|
220
252
|
this.backdropCount < this.options.backdropLimit;
|
221
253
|
|
222
254
|
if (modal.isShown && showBackdrop) {
|
223
|
-
var doAnimate = $.support.transition && animate && !this
|
224
|
-
|
255
|
+
var doAnimate = $.support.transition && animate && !this.$backdropHandle;
|
225
256
|
|
226
257
|
modal.$backdrop = this.createBackdrop(animate);
|
227
258
|
|
228
|
-
modal.$backdrop.css('z-index', getzIndex( 'backdrop', this.getIndexOfModal(modal) ))
|
259
|
+
modal.$backdrop.css('z-index', getzIndex( 'backdrop', this.getIndexOfModal(modal) ));
|
229
260
|
|
230
|
-
if (doAnimate) modal.$backdrop[0].offsetWidth // force reflow
|
261
|
+
if (doAnimate) modal.$backdrop[0].offsetWidth; // force reflow
|
231
262
|
|
232
|
-
modal.$backdrop.addClass('in')
|
263
|
+
modal.$backdrop.addClass('in');
|
233
264
|
|
234
265
|
this.backdropCount += 1;
|
235
266
|
|
@@ -253,26 +284,32 @@
|
|
253
284
|
}
|
254
285
|
},
|
255
286
|
|
256
|
-
|
257
|
-
this.$
|
258
|
-
this.$
|
287
|
+
removeSpinner: function(){
|
288
|
+
this.$spinner && this.$spinner.remove();
|
289
|
+
this.$spinner = null;
|
259
290
|
this.isLoading = false;
|
260
291
|
},
|
261
292
|
|
293
|
+
removeLoading: function () {
|
294
|
+
this.$backdropHandle && this.$backdropHandle.remove();
|
295
|
+
this.$backdropHandle = null;
|
296
|
+
this.removeSpinner();
|
297
|
+
},
|
298
|
+
|
262
299
|
loading: function (callback) {
|
263
300
|
callback = callback || function () { };
|
264
|
-
|
301
|
+
|
265
302
|
this.$element
|
266
303
|
.toggleClass('modal-open', !this.isLoading || this.hasOpenModal())
|
267
304
|
.toggleClass('page-overflow', $(window).height() < this.$element.height());
|
268
|
-
|
305
|
+
|
269
306
|
if (!this.isLoading) {
|
270
307
|
|
271
|
-
this.$
|
308
|
+
this.$backdropHandle = this.createBackdrop('fade');
|
272
309
|
|
273
|
-
this.$
|
310
|
+
this.$backdropHandle[0].offsetWidth; // force reflow
|
274
311
|
|
275
|
-
this.$
|
312
|
+
this.$backdropHandle
|
276
313
|
.css('z-index', getzIndex('backdrop', this.stack.length))
|
277
314
|
.addClass('in');
|
278
315
|
|
@@ -288,31 +325,29 @@
|
|
288
325
|
this.isLoading = true;
|
289
326
|
|
290
327
|
$.support.transition ?
|
291
|
-
|
292
|
-
|
293
|
-
|
294
|
-
} else if (this.isLoading && this.$loading) {
|
295
|
-
this.$loading.removeClass('in');
|
328
|
+
this.$backdropHandle.one($.support.transition.end, callback) :
|
329
|
+
callback();
|
296
330
|
|
297
|
-
|
331
|
+
} else if (this.isLoading && this.$backdropHandle) {
|
332
|
+
this.$backdropHandle.removeClass('in');
|
298
333
|
|
299
334
|
var that = this;
|
300
335
|
$.support.transition ?
|
301
|
-
this.$
|
336
|
+
this.$backdropHandle.one($.support.transition.end, function () { that.removeLoading() }) :
|
302
337
|
that.removeLoading();
|
303
338
|
|
304
339
|
} else if (callback) {
|
305
340
|
callback(this.isLoading);
|
306
341
|
}
|
307
342
|
}
|
308
|
-
}
|
343
|
+
};
|
309
344
|
|
310
345
|
/* PRIVATE METHODS
|
311
346
|
* ======================= */
|
312
347
|
|
313
348
|
// computes and caches the zindexes
|
314
349
|
var getzIndex = (function () {
|
315
|
-
var zIndexFactor,
|
350
|
+
var zIndexFactor,
|
316
351
|
baseIndex = {};
|
317
352
|
|
318
353
|
return function (type, pos) {
|
@@ -321,10 +356,10 @@
|
|
321
356
|
var $baseModal = $('<div class="modal hide" />').appendTo('body'),
|
322
357
|
$baseBackdrop = $('<div class="modal-backdrop hide" />').appendTo('body');
|
323
358
|
|
324
|
-
baseIndex['modal'] = +$baseModal.css('z-index')
|
325
|
-
baseIndex['backdrop'] = +$baseBackdrop.css('z-index')
|
359
|
+
baseIndex['modal'] = +$baseModal.css('z-index');
|
360
|
+
baseIndex['backdrop'] = +$baseBackdrop.css('z-index');
|
326
361
|
zIndexFactor = baseIndex['modal'] - baseIndex['backdrop'];
|
327
|
-
|
362
|
+
|
328
363
|
$baseModal.remove();
|
329
364
|
$baseBackdrop.remove();
|
330
365
|
$baseBackdrop = $baseModal = null;
|
@@ -333,16 +368,16 @@
|
|
333
368
|
return baseIndex[type] + (zIndexFactor * pos);
|
334
369
|
|
335
370
|
}
|
336
|
-
}())
|
371
|
+
}());
|
337
372
|
|
338
|
-
// make sure the event target is the modal itself in order to prevent
|
339
|
-
// other components such as tabsfrom triggering the modal manager.
|
373
|
+
// make sure the event target is the modal itself in order to prevent
|
374
|
+
// other components such as tabsfrom triggering the modal manager.
|
340
375
|
// if Boostsrap namespaced events, this would not be needed.
|
341
376
|
function targetIsSelf(callback){
|
342
377
|
return function (e) {
|
343
378
|
if (this === e.target){
|
344
379
|
return callback.apply(this, arguments);
|
345
|
-
}
|
380
|
+
}
|
346
381
|
}
|
347
382
|
}
|
348
383
|
|
@@ -350,21 +385,22 @@
|
|
350
385
|
/* MODAL MANAGER PLUGIN DEFINITION
|
351
386
|
* ======================= */
|
352
387
|
|
353
|
-
$.fn.modalmanager = function (option) {
|
388
|
+
$.fn.modalmanager = function (option, args) {
|
354
389
|
return this.each(function () {
|
355
|
-
var $this = $(this),
|
390
|
+
var $this = $(this),
|
356
391
|
data = $this.data('modalmanager');
|
357
392
|
|
358
393
|
if (!data) $this.data('modalmanager', (data = new ModalManager(this, option)))
|
359
|
-
if (typeof option === 'string') data[option]()
|
394
|
+
if (typeof option === 'string') data[option].apply(data, [].concat(args))
|
360
395
|
})
|
361
|
-
}
|
396
|
+
};
|
362
397
|
|
363
398
|
$.fn.modalmanager.defaults = {
|
364
399
|
backdropLimit: 999,
|
400
|
+
resize: true,
|
365
401
|
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
|
-
}
|
402
|
+
};
|
367
403
|
|
368
404
|
$.fn.modalmanager.Constructor = ModalManager
|
369
405
|
|
370
|
-
}(jQuery);
|
406
|
+
}(jQuery);
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: bootstrap-modal-rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: '2.
|
4
|
+
version: '2.1'
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2013-01-
|
12
|
+
date: 2013-01-18 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: railties
|
@@ -53,18 +53,12 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
53
53
|
- - ! '>='
|
54
54
|
- !ruby/object:Gem::Version
|
55
55
|
version: '0'
|
56
|
-
segments:
|
57
|
-
- 0
|
58
|
-
hash: -894969782333094102
|
59
56
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
60
57
|
none: false
|
61
58
|
requirements:
|
62
59
|
- - ! '>='
|
63
60
|
- !ruby/object:Gem::Version
|
64
61
|
version: '0'
|
65
|
-
segments:
|
66
|
-
- 0
|
67
|
-
hash: -894969782333094102
|
68
62
|
requirements: []
|
69
63
|
rubyforge_project:
|
70
64
|
rubygems_version: 1.8.24
|