lightbox2 2.10.0.2 → 2.11.0
Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 6ae6009457e3dbd9dd1195c716ef1e73ede567f8fd862b0e6d05fc411aeceaa8
|
4
|
+
data.tar.gz: e569e4ca6890e4cb62199882c3cd71880a47f9e95da58c05f55a6bc953691cc8
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 34101d21e68b4680611c2eccd110a2a81b97b47c3a730a45fbec71d8d32bcdb62b742e2adab9daecc2417f57fc088fa4d2eb7d7d48a2e51a513dc6807f3b211d
|
7
|
+
data.tar.gz: aaff7d3b79aeef857f778c3f88e49c28c9a409bfa61257338703e4f7e61686cdfb6ea6f0d7cca4368cbded0807d2a5f5132d412447d60247595ebd8638e9bb57
|
@@ -1,11 +1,11 @@
|
|
1
1
|
/*!
|
2
|
-
* Lightbox v2.
|
2
|
+
* Lightbox v2.11.0
|
3
3
|
* by Lokesh Dhakar
|
4
4
|
*
|
5
5
|
* More info:
|
6
6
|
* http://lokeshdhakar.com/projects/lightbox2/
|
7
7
|
*
|
8
|
-
* Copyright
|
8
|
+
* Copyright Lokesh Dhakar
|
9
9
|
* Released under the MIT license
|
10
10
|
* https://github.com/lokesh/lightbox2/blob/master/LICENSE
|
11
11
|
*
|
@@ -99,7 +99,7 @@
|
|
99
99
|
}
|
100
100
|
|
101
101
|
var self = this;
|
102
|
-
$('<div id="lightboxOverlay" class="lightboxOverlay"></div><div id="lightbox" class="lightbox"><div class="lb-outerContainer"><div class="lb-container"><img class="lb-image" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" /><div class="lb-nav"><a class="lb-prev" href="" ></a><a class="lb-next" href="" ></a></div><div class="lb-loader"><a class="lb-cancel"></a></div></div></div><div class="lb-dataContainer"><div class="lb-data"><div class="lb-details"><span class="lb-caption"></span><span class="lb-number"></span></div><div class="lb-closeContainer"><a class="lb-close"></a></div></div></div></div>').appendTo($('body'));
|
102
|
+
$('<div id="lightboxOverlay" class="lightboxOverlay"></div><div id="lightbox" class="lightbox"><div class="lb-outerContainer"><div class="lb-container"><img class="lb-image" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt=""/><div class="lb-nav"><a class="lb-prev" aria-label="Previous image" href="" ></a><a class="lb-next" aria-label="Next image" href="" ></a></div><div class="lb-loader"><a class="lb-cancel"></a></div></div></div><div class="lb-dataContainer"><div class="lb-data"><div class="lb-details"><span class="lb-caption"></span><span class="lb-number"></span></div><div class="lb-closeContainer"><a class="lb-close"></a></div></div></div></div>').appendTo($('body'));
|
103
103
|
|
104
104
|
// Cache jQuery objects
|
105
105
|
this.$lightbox = $('#lightbox');
|
@@ -134,7 +134,6 @@
|
|
134
134
|
if ($(event.target).attr('id') === 'lightbox') {
|
135
135
|
self.end();
|
136
136
|
}
|
137
|
-
return false;
|
138
137
|
});
|
139
138
|
|
140
139
|
this.$outerContainer.on('click', function(event) {
|
@@ -201,10 +200,6 @@
|
|
201
200
|
|
202
201
|
$window.on('resize', $.proxy(this.sizeOverlay, this));
|
203
202
|
|
204
|
-
$('select, object, embed').css({
|
205
|
-
visibility: 'hidden'
|
206
|
-
});
|
207
|
-
|
208
203
|
this.sizeOverlay();
|
209
204
|
|
210
205
|
this.album = [];
|
@@ -256,7 +251,7 @@
|
|
256
251
|
|
257
252
|
// Disable scrolling of the page while open
|
258
253
|
if (this.options.disableScrolling) {
|
259
|
-
$('
|
254
|
+
$('body').addClass('lb-disable-scrolling');
|
260
255
|
}
|
261
256
|
|
262
257
|
this.changeImage(imageNumber);
|
@@ -265,15 +260,17 @@
|
|
265
260
|
// Hide most UI elements in preparation for the animated resizing of the lightbox.
|
266
261
|
Lightbox.prototype.changeImage = function(imageNumber) {
|
267
262
|
var self = this;
|
263
|
+
var filename = this.album[imageNumber].link;
|
264
|
+
var filetype = filename.split('.').slice(-1)[0];
|
265
|
+
var $image = this.$lightbox.find('.lb-image');
|
268
266
|
|
267
|
+
// Disable keyboard nav during transitions
|
269
268
|
this.disableKeyboardNav();
|
270
|
-
var $image = this.$lightbox.find('.lb-image');
|
271
269
|
|
270
|
+
// Show loading state
|
272
271
|
this.$overlay.fadeIn(this.options.fadeDuration);
|
273
|
-
|
274
272
|
$('.lb-loader').fadeIn('slow');
|
275
273
|
this.$lightbox.find('.lb-image, .lb-nav, .lb-prev, .lb-next, .lb-dataContainer, .lb-numbers, .lb-caption').hide();
|
276
|
-
|
277
274
|
this.$outerContainer.addClass('animating');
|
278
275
|
|
279
276
|
// When image to show is preloaded, we send the width and height to sizeContainer()
|
@@ -289,22 +286,38 @@
|
|
289
286
|
|
290
287
|
$image.attr({
|
291
288
|
'alt': self.album[imageNumber].alt,
|
292
|
-
'src':
|
289
|
+
'src': filename
|
293
290
|
});
|
294
291
|
|
295
292
|
$preloader = $(preloader);
|
296
293
|
|
297
294
|
$image.width(preloader.width);
|
298
295
|
$image.height(preloader.height);
|
296
|
+
windowWidth = $(window).width();
|
297
|
+
windowHeight = $(window).height();
|
298
|
+
|
299
|
+
// Calculate the max image dimensions for the current viewport.
|
300
|
+
// Take into account the border around the image and an additional 10px gutter on each side.
|
301
|
+
maxImageWidth = windowWidth - self.containerPadding.left - self.containerPadding.right - self.imageBorderWidth.left - self.imageBorderWidth.right - 20;
|
302
|
+
maxImageHeight = windowHeight - self.containerPadding.top - self.containerPadding.bottom - self.imageBorderWidth.top - self.imageBorderWidth.bottom - self.options.positionFromTop - 70;
|
303
|
+
|
304
|
+
/*
|
305
|
+
SVGs that don't have width and height attributes specified are reporting width and height
|
306
|
+
values of 0 in Firefox 47 and IE11 on Windows. To fix, we set the width and height to the max
|
307
|
+
dimensions for the viewport rather than 0 x 0.
|
308
|
+
|
309
|
+
https://github.com/lokesh/lightbox2/issues/552
|
310
|
+
*/
|
311
|
+
|
312
|
+
if (filetype === 'svg') {
|
313
|
+
if ((preloader.width === 0) || preloader.height === 0) {
|
314
|
+
$image.width(maxImageWidth);
|
315
|
+
$image.height(maxImageHeight);
|
316
|
+
}
|
317
|
+
}
|
299
318
|
|
319
|
+
// Fit image inside the viewport.
|
300
320
|
if (self.options.fitImagesInViewport) {
|
301
|
-
// Fit image inside the viewport.
|
302
|
-
// Take into account the border around the image and an additional 10px gutter on each side.
|
303
|
-
|
304
|
-
windowWidth = $(window).width();
|
305
|
-
windowHeight = $(window).height();
|
306
|
-
maxImageWidth = windowWidth - self.containerPadding.left - self.containerPadding.right - self.imageBorderWidth.left - self.imageBorderWidth.right - 20;
|
307
|
-
maxImageHeight = windowHeight - self.containerPadding.top - self.containerPadding.bottom - self.imageBorderWidth.top - self.imageBorderWidth.bottom - 120;
|
308
321
|
|
309
322
|
// Check if image size is larger then maxWidth|maxHeight in settings
|
310
323
|
if (self.options.maxWidth && self.options.maxWidth < maxImageWidth) {
|
@@ -333,18 +346,31 @@
|
|
333
346
|
self.sizeContainer($image.width(), $image.height());
|
334
347
|
};
|
335
348
|
|
336
|
-
|
349
|
+
// Preload image before showing
|
350
|
+
preloader.src = this.album[imageNumber].link;
|
337
351
|
this.currentImageIndex = imageNumber;
|
338
352
|
};
|
339
353
|
|
340
354
|
// Stretch overlay to fit the viewport
|
341
355
|
Lightbox.prototype.sizeOverlay = function() {
|
342
|
-
this
|
343
|
-
|
344
|
-
|
356
|
+
var self = this;
|
357
|
+
/*
|
358
|
+
We use a setTimeout 0 to pause JS execution and let the rendering catch-up.
|
359
|
+
Why do this? If the `disableScrolling` option is set to true, a class is added to the body
|
360
|
+
tag that disables scrolling and hides the scrollbar. We want to make sure the scrollbar is
|
361
|
+
hidden before we measure the document width, as the presence of the scrollbar will affect the
|
362
|
+
number.
|
363
|
+
*/
|
364
|
+
setTimeout(function() {
|
365
|
+
self.$overlay
|
366
|
+
.width($(document).width())
|
367
|
+
.height($(document).height());
|
368
|
+
|
369
|
+
}, 0);
|
345
370
|
};
|
346
371
|
|
347
372
|
// Animate the size of the lightbox to fit the image we are showing
|
373
|
+
// This method also shows the the image.
|
348
374
|
Lightbox.prototype.sizeContainer = function(imageWidth, imageHeight) {
|
349
375
|
var self = this;
|
350
376
|
|
@@ -433,14 +459,7 @@
|
|
433
459
|
} else {
|
434
460
|
$caption.html(this.album[this.currentImageIndex].title);
|
435
461
|
}
|
436
|
-
$caption.fadeIn('fast')
|
437
|
-
.find('a').on('click', function(event) {
|
438
|
-
if ($(this).attr('target') !== undefined) {
|
439
|
-
window.open($(this).attr('href'), $(this).attr('target'));
|
440
|
-
} else {
|
441
|
-
location.href = $(this).attr('href');
|
442
|
-
}
|
443
|
-
});
|
462
|
+
$caption.fadeIn('fast');
|
444
463
|
}
|
445
464
|
|
446
465
|
if (this.album.length > 1 && this.options.showImageNumberLabel) {
|
@@ -483,16 +502,15 @@
|
|
483
502
|
var KEYCODE_RIGHTARROW = 39;
|
484
503
|
|
485
504
|
var keycode = event.keyCode;
|
486
|
-
|
487
|
-
if (keycode === KEYCODE_ESC || key.match(/x|o|c/)) {
|
505
|
+
if (keycode === KEYCODE_ESC) {
|
488
506
|
this.end();
|
489
|
-
} else if (
|
507
|
+
} else if (keycode === KEYCODE_LEFTARROW) {
|
490
508
|
if (this.currentImageIndex !== 0) {
|
491
509
|
this.changeImage(this.currentImageIndex - 1);
|
492
510
|
} else if (this.options.wrapAround && this.album.length > 1) {
|
493
511
|
this.changeImage(this.album.length - 1);
|
494
512
|
}
|
495
|
-
} else if (
|
513
|
+
} else if (keycode === KEYCODE_RIGHTARROW) {
|
496
514
|
if (this.currentImageIndex !== this.album.length - 1) {
|
497
515
|
this.changeImage(this.currentImageIndex + 1);
|
498
516
|
} else if (this.options.wrapAround && this.album.length > 1) {
|
@@ -507,17 +525,17 @@
|
|
507
525
|
$(window).off('resize', this.sizeOverlay);
|
508
526
|
this.$lightbox.fadeOut(this.options.fadeDuration);
|
509
527
|
this.$overlay.fadeOut(this.options.fadeDuration);
|
510
|
-
|
511
|
-
visibility: 'visible'
|
512
|
-
});
|
528
|
+
|
513
529
|
if (this.options.disableScrolling) {
|
514
|
-
$('
|
530
|
+
$('body').removeClass('lb-disable-scrolling');
|
515
531
|
}
|
516
532
|
};
|
517
533
|
|
518
534
|
return new Lightbox();
|
519
535
|
}));
|
520
536
|
|
537
|
+
// The lightbox has to be (re-)initiated, when the 'load' event of Rails Turobolinks gets fired, otherwise
|
538
|
+
// it won't work when navigating to another page
|
521
539
|
$(document).on('turbolinks:load', function(event) {
|
522
540
|
lightbox.init();
|
523
541
|
});
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: lightbox2
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 2.
|
4
|
+
version: 2.11.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Manuel Schnitzer
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2019-
|
11
|
+
date: 2019-04-23 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: jquery-rails
|