popupoverlay-rails 1.7.6
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/MIT-LICENSE +20 -0
- data/README.md +28 -0
- data/lib/popupoverlay/rails.rb +8 -0
- data/lib/popupoverlay/rails/version.rb +5 -0
- data/vendor/assets/javascripts/popupoverlay.js +786 -0
- metadata +104 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA1:
|
3
|
+
metadata.gz: 1f8d09947a939b5892400a345c2c0938ca886345
|
4
|
+
data.tar.gz: f87c213704cfcbe1c116dfbe5441f6e5b94d1313
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: f3f7d728f924f9c3ffccf088212e452cdb99d450c44234013fcb09cefe07f831e0eec88eb0ab55f3575cb3f639f326d6e97b5490bd1f1a8756cc71fec195baa3
|
7
|
+
data.tar.gz: ae4d957d8fe28c5406568d10a6388b6d0bfa492fc12b45cfcc99f2b92aa3a8ff1597c0646c03510e0b557307f30bd779c1a0ddbc6eb57298af9793f26e8541ef
|
data/MIT-LICENSE
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
Copyright 2014 Prakash Murthy
|
2
|
+
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
4
|
+
a copy of this software and associated documentation files (the
|
5
|
+
"Software"), to deal in the Software without restriction, including
|
6
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
7
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
8
|
+
permit persons to whom the Software is furnished to do so, subject to
|
9
|
+
the following conditions:
|
10
|
+
|
11
|
+
The above copyright notice and this permission notice shall be
|
12
|
+
included in all copies or substantial portions of the Software.
|
13
|
+
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
15
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
16
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
17
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
18
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
19
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
20
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.md
ADDED
@@ -0,0 +1,28 @@
|
|
1
|
+
# popupoverlay-rails
|
2
|
+
|
3
|
+
The [jquery popup overlay library](http://dev.vast.com/jquery-popup-overlay/) ready to play with Rails Asset Pipeline
|
4
|
+
|
5
|
+
## Usage
|
6
|
+
|
7
|
+
Add the following to your gemfile:
|
8
|
+
|
9
|
+
```
|
10
|
+
gem 'popupoverlay-rails'
|
11
|
+
```
|
12
|
+
|
13
|
+
Add the following directive to your Javascript manifest file (application.js):
|
14
|
+
|
15
|
+
```
|
16
|
+
//= require popupoverlay
|
17
|
+
```
|
18
|
+
|
19
|
+
## Versioning
|
20
|
+
popupoverlay-rails 1.7.6 == jquery-popupi-overlay 1.7.6
|
21
|
+
|
22
|
+
## Contributing
|
23
|
+
|
24
|
+
1. Fork it ( https://github.com/[my-github-username]/popupoverlay-rails/fork )
|
25
|
+
2. Create your feature branch (`git checkout -b my-new-feature`)
|
26
|
+
3. Commit your changes (`git commit -am 'Add some feature'`)
|
27
|
+
4. Push to the branch (`git push origin my-new-feature`)
|
28
|
+
5. Create a new Pull Request
|
@@ -0,0 +1,786 @@
|
|
1
|
+
/*!
|
2
|
+
* jQuery Popup Overlay
|
3
|
+
*
|
4
|
+
* @version 1.7.6
|
5
|
+
* @requires jQuery v1.7.1+
|
6
|
+
* @link http://vast-engineering.github.com/jquery-popup-overlay/
|
7
|
+
*/
|
8
|
+
;(function ($) {
|
9
|
+
|
10
|
+
var $window = $(window);
|
11
|
+
var options = {};
|
12
|
+
var zindexvalues = [];
|
13
|
+
var lastclicked = [];
|
14
|
+
var scrollbarwidth;
|
15
|
+
var bodymarginright = null;
|
16
|
+
var opensuffix = '_open';
|
17
|
+
var closesuffix = '_close';
|
18
|
+
var stack = [];
|
19
|
+
var transitionsupport = null;
|
20
|
+
var opentimer;
|
21
|
+
var iOS = /(iPad|iPhone|iPod)/g.test(navigator.userAgent);
|
22
|
+
|
23
|
+
var methods = {
|
24
|
+
|
25
|
+
_init: function (el) {
|
26
|
+
var $el = $(el);
|
27
|
+
var options = $el.data('popupoptions');
|
28
|
+
lastclicked[el.id] = false;
|
29
|
+
zindexvalues[el.id] = 0;
|
30
|
+
|
31
|
+
if (!$el.data('popup-initialized')) {
|
32
|
+
$el.attr('data-popup-initialized', 'true');
|
33
|
+
methods._initonce(el);
|
34
|
+
}
|
35
|
+
|
36
|
+
if (options.autoopen) {
|
37
|
+
setTimeout(function() {
|
38
|
+
methods.show(el, 0);
|
39
|
+
}, 0);
|
40
|
+
}
|
41
|
+
},
|
42
|
+
|
43
|
+
_initonce: function (el) {
|
44
|
+
var $el = $(el);
|
45
|
+
var $body = $('body');
|
46
|
+
var $wrapper;
|
47
|
+
var options = $el.data('popupoptions');
|
48
|
+
var css;
|
49
|
+
|
50
|
+
bodymarginright = parseInt($body.css('margin-right'), 10);
|
51
|
+
transitionsupport = document.body.style.webkitTransition !== undefined ||
|
52
|
+
document.body.style.MozTransition !== undefined ||
|
53
|
+
document.body.style.msTransition !== undefined ||
|
54
|
+
document.body.style.OTransition !== undefined ||
|
55
|
+
document.body.style.transition !== undefined;
|
56
|
+
|
57
|
+
if (options.type == 'tooltip') {
|
58
|
+
options.background = false;
|
59
|
+
options.scrolllock = false;
|
60
|
+
}
|
61
|
+
|
62
|
+
if (options.backgroundactive) {
|
63
|
+
options.background = false;
|
64
|
+
options.blur = false;
|
65
|
+
options.scrolllock = false;
|
66
|
+
}
|
67
|
+
|
68
|
+
if (options.scrolllock) {
|
69
|
+
// Calculate the browser's scrollbar width dynamically
|
70
|
+
var parent;
|
71
|
+
var child;
|
72
|
+
if (typeof scrollbarwidth === 'undefined') {
|
73
|
+
parent = $('<div style="width:50px;height:50px;overflow:auto"><div/></div>').appendTo('body');
|
74
|
+
child = parent.children();
|
75
|
+
scrollbarwidth = child.innerWidth() - child.height(99).innerWidth();
|
76
|
+
parent.remove();
|
77
|
+
}
|
78
|
+
}
|
79
|
+
|
80
|
+
if (!$el.attr('id')) {
|
81
|
+
$el.attr('id', 'j-popup-' + parseInt((Math.random() * 100000000), 10));
|
82
|
+
}
|
83
|
+
|
84
|
+
$el.addClass('popup_content');
|
85
|
+
|
86
|
+
$body.prepend(el);
|
87
|
+
|
88
|
+
$el.wrap('<div id="' + el.id + '_wrapper" class="popup_wrapper" />');
|
89
|
+
|
90
|
+
$wrapper = $('#' + el.id + '_wrapper');
|
91
|
+
|
92
|
+
$wrapper.css({
|
93
|
+
opacity: 0,
|
94
|
+
visibility: 'hidden',
|
95
|
+
position: 'absolute'
|
96
|
+
});
|
97
|
+
|
98
|
+
// Make div clickable in iOS
|
99
|
+
if (iOS) {
|
100
|
+
$wrapper.css('cursor', 'pointer');
|
101
|
+
}
|
102
|
+
|
103
|
+
if (options.type == 'overlay') {
|
104
|
+
$wrapper.css('overflow','auto');
|
105
|
+
}
|
106
|
+
|
107
|
+
$el.css({
|
108
|
+
opacity: 0,
|
109
|
+
visibility: 'hidden',
|
110
|
+
display: 'inline-block'
|
111
|
+
});
|
112
|
+
|
113
|
+
if (options.setzindex && !options.autozindex) {
|
114
|
+
$wrapper.css('z-index', '100001');
|
115
|
+
}
|
116
|
+
|
117
|
+
if (!options.outline) {
|
118
|
+
$el.css('outline', 'none');
|
119
|
+
}
|
120
|
+
|
121
|
+
if (options.transition) {
|
122
|
+
$el.css('transition', options.transition);
|
123
|
+
$wrapper.css('transition', options.transition);
|
124
|
+
}
|
125
|
+
|
126
|
+
// Hide popup content from screen readers initially
|
127
|
+
$el.attr('aria-hidden', true);
|
128
|
+
|
129
|
+
if ((options.background) && (!$('#' + el.id + '_background').length)) {
|
130
|
+
|
131
|
+
$body.prepend('<div id="' + el.id + '_background" class="popup_background"></div>');
|
132
|
+
|
133
|
+
var $background = $('#' + el.id + '_background');
|
134
|
+
|
135
|
+
$background.css({
|
136
|
+
opacity: 0,
|
137
|
+
visibility: 'hidden',
|
138
|
+
backgroundColor: options.color,
|
139
|
+
position: 'fixed',
|
140
|
+
top: 0,
|
141
|
+
right: 0,
|
142
|
+
bottom: 0,
|
143
|
+
left: 0
|
144
|
+
});
|
145
|
+
|
146
|
+
if (options.setzindex && !options.autozindex) {
|
147
|
+
$background.css('z-index', '100000');
|
148
|
+
}
|
149
|
+
|
150
|
+
if (options.transition) {
|
151
|
+
$background.css('transition', options.transition);
|
152
|
+
}
|
153
|
+
}
|
154
|
+
|
155
|
+
if (options.type == 'overlay') {
|
156
|
+
$el.css({
|
157
|
+
textAlign: 'left',
|
158
|
+
position: 'relative',
|
159
|
+
verticalAlign: 'middle'
|
160
|
+
});
|
161
|
+
|
162
|
+
css = {
|
163
|
+
position: 'fixed',
|
164
|
+
width: '100%',
|
165
|
+
height: '100%',
|
166
|
+
top: 0,
|
167
|
+
left: 0,
|
168
|
+
textAlign: 'center'
|
169
|
+
};
|
170
|
+
|
171
|
+
if(options.backgroundactive){
|
172
|
+
css.position = 'relative';
|
173
|
+
css.height = '0';
|
174
|
+
css.overflow = 'visible';
|
175
|
+
}
|
176
|
+
|
177
|
+
$wrapper.css(css);
|
178
|
+
|
179
|
+
// CSS vertical align helper
|
180
|
+
$wrapper.append('<div class="popup_align" />');
|
181
|
+
|
182
|
+
$('.popup_align').css({
|
183
|
+
display: 'inline-block',
|
184
|
+
verticalAlign: 'middle',
|
185
|
+
height: '100%'
|
186
|
+
});
|
187
|
+
}
|
188
|
+
|
189
|
+
// Add WAI ARIA role to announce dialog to screen readers
|
190
|
+
$el.attr('role', 'dialog');
|
191
|
+
|
192
|
+
var openelement = (options.openelement) ? options.openelement : ('.' + el.id + opensuffix);
|
193
|
+
|
194
|
+
$(openelement).each(function (i, item) {
|
195
|
+
$(item).attr('data-popup-ordinal', i);
|
196
|
+
|
197
|
+
if (!item.id) {
|
198
|
+
$(item).attr('id', 'open_' + parseInt((Math.random() * 100000000), 10));
|
199
|
+
}
|
200
|
+
});
|
201
|
+
|
202
|
+
// Set aria-labelledby (if aria-label or aria-labelledby is not set in html)
|
203
|
+
if (!($el.attr('aria-labelledby') || $el.attr('aria-label'))) {
|
204
|
+
$el.attr('aria-labelledby', $(openelement).attr('id'));
|
205
|
+
}
|
206
|
+
|
207
|
+
// Show and hide tooltips on hover
|
208
|
+
if(options.action == 'hover'){
|
209
|
+
options.keepfocus = false;
|
210
|
+
|
211
|
+
// Handler: mouseenter, focusin
|
212
|
+
$(openelement).on('mouseenter', function (event) {
|
213
|
+
methods.show(el, $(this).data('popup-ordinal'));
|
214
|
+
});
|
215
|
+
|
216
|
+
// Handler: mouseleave, focusout
|
217
|
+
$(openelement).on('mouseleave', function (event) {
|
218
|
+
methods.hide(el);
|
219
|
+
});
|
220
|
+
|
221
|
+
} else {
|
222
|
+
|
223
|
+
// Handler: Show popup when clicked on `open` element
|
224
|
+
$(document).on('click', openelement, function (event) {
|
225
|
+
event.preventDefault();
|
226
|
+
|
227
|
+
var ord = $(this).data('popup-ordinal');
|
228
|
+
setTimeout(function() { // setTimeout is to allow `close` method to finish (for issues with multiple tooltips)
|
229
|
+
methods.show(el, ord);
|
230
|
+
}, 0);
|
231
|
+
});
|
232
|
+
}
|
233
|
+
|
234
|
+
if (options.closebutton) {
|
235
|
+
methods.addclosebutton(el);
|
236
|
+
}
|
237
|
+
|
238
|
+
if (options.detach) {
|
239
|
+
$el.hide().detach();
|
240
|
+
} else {
|
241
|
+
$wrapper.hide();
|
242
|
+
}
|
243
|
+
},
|
244
|
+
|
245
|
+
/**
|
246
|
+
* Show method
|
247
|
+
*
|
248
|
+
* @param {object} el - popup instance DOM node
|
249
|
+
* @param {number} ordinal - order number of an `open` element
|
250
|
+
*/
|
251
|
+
show: function (el, ordinal) {
|
252
|
+
var $el = $(el);
|
253
|
+
|
254
|
+
if ($el.data('popup-visible')) return;
|
255
|
+
|
256
|
+
// Initialize if not initialized. Required for: $('#popup').popup('show')
|
257
|
+
if (!$el.data('popup-initialized')) {
|
258
|
+
methods._init(el);
|
259
|
+
}
|
260
|
+
$el.attr('data-popup-initialized', 'true');
|
261
|
+
|
262
|
+
var $body = $('body');
|
263
|
+
var options = $el.data('popupoptions');
|
264
|
+
var $wrapper = $('#' + el.id + '_wrapper');
|
265
|
+
var $background = $('#' + el.id + '_background');
|
266
|
+
|
267
|
+
// `beforeopen` callback event
|
268
|
+
callback(el, ordinal, options.beforeopen);
|
269
|
+
|
270
|
+
// Remember last clicked place
|
271
|
+
lastclicked[el.id] = ordinal;
|
272
|
+
|
273
|
+
// Add popup id to popup stack
|
274
|
+
setTimeout(function() {
|
275
|
+
stack.push(el.id);
|
276
|
+
}, 0);
|
277
|
+
|
278
|
+
// Calculating maximum z-index
|
279
|
+
if (options.autozindex) {
|
280
|
+
|
281
|
+
var elements = document.getElementsByTagName('*');
|
282
|
+
var len = elements.length;
|
283
|
+
var maxzindex = 0;
|
284
|
+
|
285
|
+
for(var i=0; i<len; i++){
|
286
|
+
|
287
|
+
var elementzindex = $(elements[i]).css('z-index');
|
288
|
+
|
289
|
+
if(elementzindex !== 'auto'){
|
290
|
+
|
291
|
+
elementzindex = parseInt(elementzindex, 10);
|
292
|
+
|
293
|
+
if(maxzindex < elementzindex){
|
294
|
+
maxzindex = elementzindex;
|
295
|
+
}
|
296
|
+
}
|
297
|
+
}
|
298
|
+
|
299
|
+
zindexvalues[el.id] = maxzindex;
|
300
|
+
|
301
|
+
// Add z-index to the background
|
302
|
+
if (options.background) {
|
303
|
+
if (zindexvalues[el.id] > 0) {
|
304
|
+
$('#' + el.id + '_background').css({
|
305
|
+
zIndex: (zindexvalues[el.id] + 1)
|
306
|
+
});
|
307
|
+
}
|
308
|
+
}
|
309
|
+
|
310
|
+
// Add z-index to the wrapper
|
311
|
+
if (zindexvalues[el.id] > 0) {
|
312
|
+
$wrapper.css({
|
313
|
+
zIndex: (zindexvalues[el.id] + 2)
|
314
|
+
});
|
315
|
+
}
|
316
|
+
}
|
317
|
+
|
318
|
+
if (options.detach) {
|
319
|
+
$wrapper.prepend(el);
|
320
|
+
$el.show();
|
321
|
+
} else {
|
322
|
+
$wrapper.show();
|
323
|
+
}
|
324
|
+
|
325
|
+
opentimer = setTimeout(function() {
|
326
|
+
$wrapper.css({
|
327
|
+
visibility: 'visible',
|
328
|
+
opacity: 1
|
329
|
+
});
|
330
|
+
|
331
|
+
$('html').addClass('popup_visible').addClass('popup_visible_' + el.id);
|
332
|
+
$wrapper.addClass('popup_wrapper_visible');
|
333
|
+
}, 20); // 20ms required for opening animation to occur in FF
|
334
|
+
|
335
|
+
// Disable background layer scrolling when popup is opened
|
336
|
+
if (options.scrolllock) {
|
337
|
+
$body.css('overflow', 'hidden');
|
338
|
+
if ($body.height() > $window.height()) {
|
339
|
+
$body.css('margin-right', bodymarginright + scrollbarwidth);
|
340
|
+
}
|
341
|
+
}
|
342
|
+
|
343
|
+
if(options.backgroundactive){
|
344
|
+
//calculates the vertical align
|
345
|
+
$el.css({
|
346
|
+
top:(
|
347
|
+
$window.height() - (
|
348
|
+
$el.get(0).offsetHeight +
|
349
|
+
parseInt($el.css('margin-top'), 10) +
|
350
|
+
parseInt($el.css('margin-bottom'), 10)
|
351
|
+
)
|
352
|
+
)/2 +'px'
|
353
|
+
});
|
354
|
+
}
|
355
|
+
|
356
|
+
$el.css({
|
357
|
+
'visibility': 'visible',
|
358
|
+
'opacity': 1
|
359
|
+
});
|
360
|
+
|
361
|
+
// Show background
|
362
|
+
if (options.background) {
|
363
|
+
$background.css({
|
364
|
+
'visibility': 'visible',
|
365
|
+
'opacity': options.opacity
|
366
|
+
});
|
367
|
+
|
368
|
+
// Fix IE8 issue with background not appearing
|
369
|
+
setTimeout(function() {
|
370
|
+
$background.css({
|
371
|
+
'opacity': options.opacity
|
372
|
+
});
|
373
|
+
}, 0);
|
374
|
+
}
|
375
|
+
|
376
|
+
$el.data('popup-visible', true);
|
377
|
+
|
378
|
+
// Position popup
|
379
|
+
methods.reposition(el, ordinal);
|
380
|
+
|
381
|
+
// Remember which element had focus before opening a popup
|
382
|
+
$el.data('focusedelementbeforepopup', document.activeElement);
|
383
|
+
|
384
|
+
// Handler: Keep focus inside dialog box
|
385
|
+
if (options.keepfocus) {
|
386
|
+
// Make holder div focusable
|
387
|
+
$el.attr('tabindex', -1);
|
388
|
+
|
389
|
+
// Focus popup or user specified element.
|
390
|
+
// Initial timeout of 50ms is set to give some time to popup to show after clicking on
|
391
|
+
// `open` element, and after animation is complete to prevent background scrolling.
|
392
|
+
setTimeout(function() {
|
393
|
+
if (options.focuselement === 'closebutton') {
|
394
|
+
$('#' + el.id + ' .' + el.id + closesuffix + ':first').focus();
|
395
|
+
} else if (options.focuselement) {
|
396
|
+
$(options.focuselement).focus();
|
397
|
+
} else {
|
398
|
+
$el.focus();
|
399
|
+
}
|
400
|
+
}, options.focusdelay);
|
401
|
+
|
402
|
+
}
|
403
|
+
|
404
|
+
// Hide main content from screen readers
|
405
|
+
$(options.pagecontainer).attr('aria-hidden', true);
|
406
|
+
|
407
|
+
// Reveal popup content to screen readers
|
408
|
+
$el.attr('aria-hidden', false);
|
409
|
+
|
410
|
+
callback(el, ordinal, options.onopen);
|
411
|
+
|
412
|
+
if (transitionsupport) {
|
413
|
+
$wrapper.one('transitionend', function() {
|
414
|
+
callback(el, ordinal, options.opentransitionend);
|
415
|
+
});
|
416
|
+
} else {
|
417
|
+
callback(el, ordinal, options.opentransitionend);
|
418
|
+
}
|
419
|
+
},
|
420
|
+
|
421
|
+
/**
|
422
|
+
* Hide method
|
423
|
+
*
|
424
|
+
* @param {object} el - popup instance DOM node
|
425
|
+
*/
|
426
|
+
hide: function (el) {
|
427
|
+
if(opentimer) clearTimeout(opentimer);
|
428
|
+
|
429
|
+
var $body = $('body');
|
430
|
+
var $el = $(el);
|
431
|
+
var options = $el.data('popupoptions');
|
432
|
+
var $wrapper = $('#' + el.id + '_wrapper');
|
433
|
+
var $background = $('#' + el.id + '_background');
|
434
|
+
|
435
|
+
$el.data('popup-visible', false);
|
436
|
+
|
437
|
+
|
438
|
+
if (stack.length === 1) {
|
439
|
+
$('html').removeClass('popup_visible').removeClass('popup_visible_' + el.id);
|
440
|
+
} else {
|
441
|
+
if($('html').hasClass('popup_visible_' + el.id)) {
|
442
|
+
$('html').removeClass('popup_visible_' + el.id);
|
443
|
+
}
|
444
|
+
}
|
445
|
+
|
446
|
+
// Remove last opened popup from the stack
|
447
|
+
stack.pop();
|
448
|
+
|
449
|
+
if($wrapper.hasClass('popup_wrapper_visible')) {
|
450
|
+
$wrapper.removeClass('popup_wrapper_visible');
|
451
|
+
}
|
452
|
+
|
453
|
+
if (options.keepfocus) {
|
454
|
+
// Focus back on saved element
|
455
|
+
setTimeout(function() {
|
456
|
+
if ($($el.data('focusedelementbeforepopup')).is(':visible')) {
|
457
|
+
$el.data('focusedelementbeforepopup').focus();
|
458
|
+
}
|
459
|
+
}, 0);
|
460
|
+
}
|
461
|
+
|
462
|
+
// Hide popup
|
463
|
+
$wrapper.css({
|
464
|
+
'visibility': 'hidden',
|
465
|
+
'opacity': 0
|
466
|
+
});
|
467
|
+
$el.css({
|
468
|
+
'visibility': 'hidden',
|
469
|
+
'opacity': 0
|
470
|
+
});
|
471
|
+
|
472
|
+
// Hide background
|
473
|
+
if (options.background) {
|
474
|
+
$background.css({
|
475
|
+
'visibility': 'hidden',
|
476
|
+
'opacity': 0
|
477
|
+
});
|
478
|
+
}
|
479
|
+
|
480
|
+
// Reveal main content to screen readers
|
481
|
+
$(options.pagecontainer).attr('aria-hidden', false);
|
482
|
+
|
483
|
+
// Hide popup content from screen readers
|
484
|
+
$el.attr('aria-hidden', true);
|
485
|
+
|
486
|
+
// `onclose` callback event
|
487
|
+
callback(el, lastclicked[el.id], options.onclose);
|
488
|
+
|
489
|
+
if (transitionsupport && $el.css('transition-duration') !== '0s') {
|
490
|
+
$el.one('transitionend', function(e) {
|
491
|
+
|
492
|
+
if (!($el.data('popup-visible'))) {
|
493
|
+
if (options.detach) {
|
494
|
+
$el.hide().detach();
|
495
|
+
} else {
|
496
|
+
$wrapper.hide();
|
497
|
+
}
|
498
|
+
}
|
499
|
+
|
500
|
+
// Re-enable scrolling of background layer
|
501
|
+
if (options.scrolllock) {
|
502
|
+
setTimeout(function() {
|
503
|
+
$body.css({
|
504
|
+
overflow: 'visible',
|
505
|
+
'margin-right': bodymarginright
|
506
|
+
});
|
507
|
+
}, 10); // 10ms added for CSS transition in Firefox which doesn't like overflow:auto
|
508
|
+
}
|
509
|
+
|
510
|
+
callback(el, lastclicked[el.id], options.closetransitionend);
|
511
|
+
});
|
512
|
+
} else {
|
513
|
+
if (options.detach) {
|
514
|
+
$el.hide().detach();
|
515
|
+
} else {
|
516
|
+
$wrapper.hide();
|
517
|
+
}
|
518
|
+
|
519
|
+
// Re-enable scrolling of background layer
|
520
|
+
if (options.scrolllock) {
|
521
|
+
setTimeout(function() {
|
522
|
+
$body.css({
|
523
|
+
overflow: 'visible',
|
524
|
+
'margin-right': bodymarginright
|
525
|
+
});
|
526
|
+
}, 10); // 10ms added for CSS transition in Firefox which doesn't like overflow:auto
|
527
|
+
}
|
528
|
+
|
529
|
+
callback(el, lastclicked[el.id], options.closetransitionend);
|
530
|
+
}
|
531
|
+
|
532
|
+
},
|
533
|
+
|
534
|
+
/**
|
535
|
+
* Toggle method
|
536
|
+
*
|
537
|
+
* @param {object} el - popup instance DOM node
|
538
|
+
* @param {number} ordinal - order number of an `open` element
|
539
|
+
*/
|
540
|
+
toggle: function (el, ordinal) {
|
541
|
+
if ($(el).data('popup-visible')) {
|
542
|
+
methods.hide(el);
|
543
|
+
} else {
|
544
|
+
setTimeout(function() {
|
545
|
+
methods.show(el, ordinal);
|
546
|
+
}, 0);
|
547
|
+
}
|
548
|
+
},
|
549
|
+
|
550
|
+
/**
|
551
|
+
* Reposition method
|
552
|
+
*
|
553
|
+
* @param {object} el - popup instance DOM node
|
554
|
+
* @param {number} ordinal - order number of an `open` element
|
555
|
+
*/
|
556
|
+
reposition: function (el, ordinal) {
|
557
|
+
var $el = $(el);
|
558
|
+
var options = $el.data('popupoptions');
|
559
|
+
var $wrapper = $('#' + el.id + '_wrapper');
|
560
|
+
var $background = $('#' + el.id + '_background');
|
561
|
+
|
562
|
+
ordinal = ordinal || 0;
|
563
|
+
|
564
|
+
// Tooltip type
|
565
|
+
if (options.type == 'tooltip') {
|
566
|
+
$wrapper.css({
|
567
|
+
'position': 'absolute'
|
568
|
+
});
|
569
|
+
|
570
|
+
var $tooltipanchor;
|
571
|
+
if (options.tooltipanchor) {
|
572
|
+
$tooltipanchor = $(options.tooltipanchor);
|
573
|
+
} else if (options.openelement) {
|
574
|
+
$tooltipanchor = $(options.openelement).filter('[data-popup-ordinal="' + ordinal + '"]');
|
575
|
+
} else {
|
576
|
+
$tooltipanchor = $('.' + el.id + opensuffix + '[data-popup-ordinal="' + ordinal + '"]');
|
577
|
+
}
|
578
|
+
|
579
|
+
var linkOffset = $tooltipanchor.offset();
|
580
|
+
|
581
|
+
// Horizontal position for tooltip
|
582
|
+
if (options.horizontal == 'right') {
|
583
|
+
$wrapper.css('left', linkOffset.left + $tooltipanchor.outerWidth() + options.offsetleft);
|
584
|
+
} else if (options.horizontal == 'leftedge') {
|
585
|
+
$wrapper.css('left', linkOffset.left + $tooltipanchor.outerWidth() - $tooltipanchor.outerWidth() + options.offsetleft);
|
586
|
+
} else if (options.horizontal == 'left') {
|
587
|
+
$wrapper.css('right', $window.width() - linkOffset.left - options.offsetleft);
|
588
|
+
} else if (options.horizontal == 'rightedge') {
|
589
|
+
$wrapper.css('right', $window.width() - linkOffset.left - $tooltipanchor.outerWidth() - options.offsetleft);
|
590
|
+
} else {
|
591
|
+
$wrapper.css('left', linkOffset.left + ($tooltipanchor.outerWidth() / 2) - ($el.outerWidth() / 2) - parseFloat($el.css('marginLeft')) + options.offsetleft);
|
592
|
+
}
|
593
|
+
|
594
|
+
// Vertical position for tooltip
|
595
|
+
if (options.vertical == 'bottom') {
|
596
|
+
$wrapper.css('top', linkOffset.top + $tooltipanchor.outerHeight() + options.offsettop);
|
597
|
+
} else if (options.vertical == 'bottomedge') {
|
598
|
+
$wrapper.css('top', linkOffset.top + $tooltipanchor.outerHeight() - $el.outerHeight() + options.offsettop);
|
599
|
+
} else if (options.vertical == 'top') {
|
600
|
+
$wrapper.css('bottom', $window.height() - linkOffset.top - options.offsettop);
|
601
|
+
} else if (options.vertical == 'topedge') {
|
602
|
+
$wrapper.css('bottom', $window.height() - linkOffset.top - $el.outerHeight() - options.offsettop);
|
603
|
+
} else {
|
604
|
+
$wrapper.css('top', linkOffset.top + ($tooltipanchor.outerHeight() / 2) - ($el.outerHeight() / 2) - parseFloat($el.css('marginTop')) + options.offsettop);
|
605
|
+
}
|
606
|
+
|
607
|
+
// Overlay type
|
608
|
+
} else if (options.type == 'overlay') {
|
609
|
+
|
610
|
+
// Horizontal position for overlay
|
611
|
+
if (options.horizontal) {
|
612
|
+
$wrapper.css('text-align', options.horizontal);
|
613
|
+
} else {
|
614
|
+
$wrapper.css('text-align', 'center');
|
615
|
+
}
|
616
|
+
|
617
|
+
// Vertical position for overlay
|
618
|
+
if (options.vertical) {
|
619
|
+
$el.css('vertical-align', options.vertical);
|
620
|
+
} else {
|
621
|
+
$el.css('vertical-align', 'middle');
|
622
|
+
}
|
623
|
+
}
|
624
|
+
},
|
625
|
+
|
626
|
+
/**
|
627
|
+
* Add-close-button method
|
628
|
+
*
|
629
|
+
* @param {object} el - popup instance DOM node
|
630
|
+
*/
|
631
|
+
addclosebutton: function (el) {
|
632
|
+
var genericCloseButton;
|
633
|
+
|
634
|
+
if ($(el).data('popupoptions').closebuttonmarkup) {
|
635
|
+
genericCloseButton = $(options.closebuttonmarkup).addClass(el.id + '_close');
|
636
|
+
} else {
|
637
|
+
genericCloseButton = '<button class="popup_close ' + el.id + '_close" title="Close" aria-label="Close"><span aria-hidden="true">×</span></button>';
|
638
|
+
}
|
639
|
+
|
640
|
+
if ($el.data('popup-initialized')){
|
641
|
+
$el.append(genericCloseButton);
|
642
|
+
}
|
643
|
+
|
644
|
+
}
|
645
|
+
|
646
|
+
};
|
647
|
+
|
648
|
+
/**
|
649
|
+
* Callback event calls
|
650
|
+
*
|
651
|
+
* @param {object} el - popup instance DOM node
|
652
|
+
* @param {number} ordinal - order number of an `open` element
|
653
|
+
* @param {function} func - callback function
|
654
|
+
*/
|
655
|
+
var callback = function (el, ordinal, func) {
|
656
|
+
var options = $(el).data('popupoptions');
|
657
|
+
var openelement = (options.openelement) ? options.openelement : ('.' + el.id + opensuffix);
|
658
|
+
var elementclicked = $(openelement + '[data-popup-ordinal="' + ordinal + '"]');
|
659
|
+
if (typeof func == 'function') {
|
660
|
+
func.call($(el), el, elementclicked);
|
661
|
+
}
|
662
|
+
};
|
663
|
+
|
664
|
+
// Hide popup if ESC key is pressed
|
665
|
+
$(document).on('keydown', function (event) {
|
666
|
+
if(stack.length) {
|
667
|
+
var elementId = stack[stack.length - 1];
|
668
|
+
var el = document.getElementById(elementId);
|
669
|
+
|
670
|
+
if ($(el).data('popupoptions').escape && event.keyCode == 27) {
|
671
|
+
methods.hide(el);
|
672
|
+
}
|
673
|
+
}
|
674
|
+
});
|
675
|
+
|
676
|
+
// Hide popup on click
|
677
|
+
$(document).on('click', function (event) {
|
678
|
+
if(stack.length) {
|
679
|
+
var elementId = stack[stack.length - 1];
|
680
|
+
var el = document.getElementById(elementId);
|
681
|
+
var closeButton = ($(el).data('popupoptions').closeelement) ? $(el).data('popupoptions').closeelement : ('.' + el.id + closesuffix);
|
682
|
+
|
683
|
+
// Click on Close button
|
684
|
+
if ($(event.target).closest(closeButton).length) {
|
685
|
+
event.preventDefault();
|
686
|
+
methods.hide(el);
|
687
|
+
}
|
688
|
+
|
689
|
+
// Click outside of popup
|
690
|
+
if ($(el).data('popupoptions').blur && !$(event.target).closest('#' + elementId).length && event.which !== 2 && $(event.target).is(':visible')) {
|
691
|
+
methods.hide(el);
|
692
|
+
|
693
|
+
if ($(el).data('popupoptions').type === 'overlay') {
|
694
|
+
event.preventDefault(); // iOS will trigger click on the links below the overlay when clicked on the overlay if we don't prevent default action
|
695
|
+
}
|
696
|
+
}
|
697
|
+
}
|
698
|
+
});
|
699
|
+
|
700
|
+
// Keep keyboard focus inside of popup
|
701
|
+
$(document).on('focusin', function(event) {
|
702
|
+
if(stack.length) {
|
703
|
+
var elementId = stack[stack.length - 1];
|
704
|
+
var el = document.getElementById(elementId);
|
705
|
+
|
706
|
+
if ($(el).data('popupoptions').keepfocus) {
|
707
|
+
if (!el.contains(event.target)) {
|
708
|
+
event.stopPropagation();
|
709
|
+
el.focus();
|
710
|
+
}
|
711
|
+
}
|
712
|
+
}
|
713
|
+
});
|
714
|
+
|
715
|
+
/**
|
716
|
+
* Plugin API
|
717
|
+
*/
|
718
|
+
$.fn.popup = function (customoptions) {
|
719
|
+
return this.each(function () {
|
720
|
+
|
721
|
+
$el = $(this);
|
722
|
+
|
723
|
+
if (typeof customoptions === 'object') { // e.g. $('#popup').popup({'color':'blue'})
|
724
|
+
var opt = $.extend({}, $.fn.popup.defaults, customoptions);
|
725
|
+
$el.data('popupoptions', opt);
|
726
|
+
options = $el.data('popupoptions');
|
727
|
+
|
728
|
+
methods._init(this);
|
729
|
+
|
730
|
+
} else if (typeof customoptions === 'string') { // e.g. $('#popup').popup('hide')
|
731
|
+
if (!($el.data('popupoptions'))) {
|
732
|
+
$el.data('popupoptions', $.fn.popup.defaults);
|
733
|
+
options = $el.data('popupoptions');
|
734
|
+
}
|
735
|
+
|
736
|
+
methods[customoptions].call(this, this);
|
737
|
+
|
738
|
+
} else { // e.g. $('#popup').popup()
|
739
|
+
if (!($el.data('popupoptions'))) {
|
740
|
+
$el.data('popupoptions', $.fn.popup.defaults);
|
741
|
+
options = $el.data('popupoptions');
|
742
|
+
}
|
743
|
+
|
744
|
+
methods._init(this);
|
745
|
+
|
746
|
+
}
|
747
|
+
|
748
|
+
});
|
749
|
+
};
|
750
|
+
|
751
|
+
$.fn.popup.defaults = {
|
752
|
+
type: 'overlay',
|
753
|
+
autoopen: false,
|
754
|
+
background: true,
|
755
|
+
backgroundactive: false,
|
756
|
+
color: 'black',
|
757
|
+
opacity: '0.5',
|
758
|
+
horizontal: 'center',
|
759
|
+
vertical: 'middle',
|
760
|
+
offsettop: 0,
|
761
|
+
offsetleft: 0,
|
762
|
+
escape: true,
|
763
|
+
blur: true,
|
764
|
+
setzindex: true,
|
765
|
+
autozindex: false,
|
766
|
+
scrolllock: false,
|
767
|
+
closebutton: false,
|
768
|
+
closebuttonmarkup: null,
|
769
|
+
keepfocus: true,
|
770
|
+
focuselement: null,
|
771
|
+
focusdelay: 50,
|
772
|
+
outline: false,
|
773
|
+
pagecontainer: null,
|
774
|
+
detach: false,
|
775
|
+
openelement: null,
|
776
|
+
closeelement: null,
|
777
|
+
transition: null,
|
778
|
+
tooltipanchor: null,
|
779
|
+
beforeopen: null,
|
780
|
+
onclose: null,
|
781
|
+
onopen: null,
|
782
|
+
opentransitionend: null,
|
783
|
+
closetransitionend: null
|
784
|
+
};
|
785
|
+
|
786
|
+
})(jQuery);
|
metadata
ADDED
@@ -0,0 +1,104 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: popupoverlay-rails
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 1.7.6
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- Prakash Murthy
|
8
|
+
autorequire:
|
9
|
+
bindir: bin
|
10
|
+
cert_chain: []
|
11
|
+
date: 2015-04-27 00:00:00.000000000 Z
|
12
|
+
dependencies:
|
13
|
+
- !ruby/object:Gem::Dependency
|
14
|
+
name: bundler
|
15
|
+
requirement: !ruby/object:Gem::Requirement
|
16
|
+
requirements:
|
17
|
+
- - ~>
|
18
|
+
- !ruby/object:Gem::Version
|
19
|
+
version: '1.9'
|
20
|
+
type: :development
|
21
|
+
prerelease: false
|
22
|
+
version_requirements: !ruby/object:Gem::Requirement
|
23
|
+
requirements:
|
24
|
+
- - ~>
|
25
|
+
- !ruby/object:Gem::Version
|
26
|
+
version: '1.9'
|
27
|
+
- !ruby/object:Gem::Dependency
|
28
|
+
name: rake
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
30
|
+
requirements:
|
31
|
+
- - ~>
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: '10.0'
|
34
|
+
type: :development
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
37
|
+
requirements:
|
38
|
+
- - ~>
|
39
|
+
- !ruby/object:Gem::Version
|
40
|
+
version: '10.0'
|
41
|
+
- !ruby/object:Gem::Dependency
|
42
|
+
name: railties
|
43
|
+
requirement: !ruby/object:Gem::Requirement
|
44
|
+
requirements:
|
45
|
+
- - '>='
|
46
|
+
- !ruby/object:Gem::Version
|
47
|
+
version: 4.0.0
|
48
|
+
type: :runtime
|
49
|
+
prerelease: false
|
50
|
+
version_requirements: !ruby/object:Gem::Requirement
|
51
|
+
requirements:
|
52
|
+
- - '>='
|
53
|
+
- !ruby/object:Gem::Version
|
54
|
+
version: 4.0.0
|
55
|
+
- !ruby/object:Gem::Dependency
|
56
|
+
name: rails
|
57
|
+
requirement: !ruby/object:Gem::Requirement
|
58
|
+
requirements:
|
59
|
+
- - ~>
|
60
|
+
- !ruby/object:Gem::Version
|
61
|
+
version: 4.2.0
|
62
|
+
type: :development
|
63
|
+
prerelease: false
|
64
|
+
version_requirements: !ruby/object:Gem::Requirement
|
65
|
+
requirements:
|
66
|
+
- - ~>
|
67
|
+
- !ruby/object:Gem::Version
|
68
|
+
version: 4.2.0
|
69
|
+
description: |2
|
70
|
+
jQuery Popup Overlay: jQuery plugin for responsive and accessible modal windows and tooltips
|
71
|
+
email:
|
72
|
+
executables: []
|
73
|
+
extensions: []
|
74
|
+
extra_rdoc_files: []
|
75
|
+
files:
|
76
|
+
- MIT-LICENSE
|
77
|
+
- README.md
|
78
|
+
- lib/popupoverlay/rails.rb
|
79
|
+
- lib/popupoverlay/rails/version.rb
|
80
|
+
- vendor/assets/javascripts/popupoverlay.js
|
81
|
+
homepage: https://github.com/prakashmurthy/popupoverlay-rails
|
82
|
+
licenses: []
|
83
|
+
metadata: {}
|
84
|
+
post_install_message:
|
85
|
+
rdoc_options: []
|
86
|
+
require_paths:
|
87
|
+
- lib
|
88
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
89
|
+
requirements:
|
90
|
+
- - '>='
|
91
|
+
- !ruby/object:Gem::Version
|
92
|
+
version: '0'
|
93
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
94
|
+
requirements:
|
95
|
+
- - '>='
|
96
|
+
- !ruby/object:Gem::Version
|
97
|
+
version: '0'
|
98
|
+
requirements: []
|
99
|
+
rubyforge_project:
|
100
|
+
rubygems_version: 2.4.6
|
101
|
+
signing_key:
|
102
|
+
specification_version: 4
|
103
|
+
summary: The jquery popup overlay library ready to play with Rails Asset Pipeline
|
104
|
+
test_files: []
|