diff --git a/.travis.yml b/.travis.yml
index 46b9736..8ee916e 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,30 +1,24 @@
language: php
-dist: trusty
+dist: xenial
matrix:
include:
- - php: 5.5
+ - php: 7.1
env: DB=none;NOTESTS=1
- - php: 5.4
- env: DB=mysqli #myisam
- - php: 5.4
- env: DB=mysql
- - php: 5.4
+ - php: 7.1
env: DB=mariadb
- - php: 5.4
+ - php: 7.1
env: DB=postgres
- - php: 5.4
+ - php: 7.1
env: DB=sqlite3
- - php: 5.5
- env: DB=mysqli
- - php: 5.6
- env: DB=mysqli
- - php: 7.0
- env: DB=mysqli
- php: 7.1
- env: DB=mysqli
+ env: DB=mysqli # MyISAM
- php: 7.2
env: DB=mysqli
+ - php: 7.3
+ env: DB=mysqli
+ - php: 7.4snapshot
+ env: DB=mysqli
- php: nightly
env: DB=mysqli
allow_failures:
@@ -38,7 +32,7 @@ env:
- SNIFF="1" # Should we run code sniffer on your code?
- IMAGE_ICC="1" # Should we run icc profile sniffer on your images?
- EPV="1" # Should we run EPV (Extension Pre Validator) on your code?
- - PHPBB_BRANCH="3.2.x"
+ - PHPBB_BRANCH="3.3.x"
branches:
only:
@@ -47,8 +41,12 @@ branches:
- /^develop-.*$/
- /^\d+(\.\d+)?\.x$/
+services:
+ - postgresql
+ - mysql
+
install:
- - travis/prepare-phpbb.sh $EXTNAME $PHPBB_BRANCH
+ - travis/prepare-phpbb.sh $PHPBB_BRANCH
- cd ../../phpBB3
- travis/prepare-extension.sh $EXTNAME $PHPBB_BRANCH
- travis/setup-phpbb.sh $DB $TRAVIS_PHP_VERSION $NOTESTS
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2b7f408..63923a3 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,13 @@
## Changelog
+### 2.0.2 - 2020-01-16
+
+- Updated Lightbox2 library to 2.11.1
+- jQuery v3 / phpBB v3.3 compatibility fixes
+- Eliminated visible image resizing by setting max-width/height in CSS now instead of JavaScript
+- Resized user signature images will no longer be included in Lightbox gallery mode
+- Added Slovenian translation
+
### 2.0.1 - 2019-05-24
- Updated Lightbox2 library to 2.11.0
diff --git a/composer.json b/composer.json
index ce60551..36f3ef1 100644
--- a/composer.json
+++ b/composer.json
@@ -3,7 +3,7 @@
"type": "phpbb-extension",
"description": "Lightbox for phpBB can resize posted images to a maximum set height/width and display them full-screen in an elegant Lightbox overlay effect.",
"homepage": "https://github.com/VSEphpbb/lightbox",
- "version": "2.0.1",
+ "version": "2.0.2",
"keywords": ["phpbb", "extension", "lightbox", "image", "resizer"],
"license": "GPL-2.0-only",
"authors": [
diff --git a/event/listener.php b/event/listener.php
index cf3821e..3b91ab6 100644
--- a/event/listener.php
+++ b/event/listener.php
@@ -103,7 +103,7 @@ public function add_lightbox_acp_config($event)
'lightbox_max_width' => array('lang' => 'LIGHTBOX_MAX_WIDTH', 'validate' => 'int:0:99999', 'type' => 'number:0:99999', 'explain' => true, 'append' => ' ' . $this->language->lang('PIXEL') . ' ' . $l_append),
'lightbox_max_height' => array('lang' => 'LIGHTBOX_MAX_HEIGHT', 'validate' => 'int:0:99999', 'type' => 'number:0:99999', 'explain' => true, 'append' => ' ' . $this->language->lang('PIXEL') . ' ' . $l_append),
'lightbox_all_images' => array('lang' => 'LIGHTBOX_ALL_IMAGES', 'validate' => 'bool', 'type' => 'radio:yes_no', 'explain' => true),
- 'lightbox_gallery' => array('lang' => 'LIGHTBOX_GALLERY', 'validate' => 'int', 'type' => 'select', 'function' => array($this, 'select_gallery_mode'), 'explain' => true),
+ 'lightbox_gallery' => array('lang' => 'LIGHTBOX_GALLERY', 'validate' => 'int', 'type' => 'select', 'function' => 'build_select', 'params' => array(array(0 => 'DISABLED', 1 => 'LIGHTBOX_GALLERY_ALL', 2 => 'LIGHTBOX_GALLERY_POSTS'), '{CONFIG_VALUE}'), 'explain' => true),
'lightbox_signatures' => array('lang' => 'LIGHTBOX_SIGNATURES', 'validate' => 'bool', 'type' => 'radio:yes_no', 'explain' => true),
'lightbox_img_titles' => array('lang' => 'LIGHTBOX_IMG_TITLES', 'validate' => 'bool', 'type' => 'radio:yes_no', 'explain' => true),
);
@@ -114,31 +114,6 @@ public function add_lightbox_acp_config($event)
}
}
- /**
- * Create options for the gallery mode select setting
- *
- * @param int $selected The current value of the config setting
- * @param string $cfg_key The name of the config key
- * @return string The HTML option tags
- * @access public
- */
- public function select_gallery_mode($selected, $cfg_key = '')
- {
- $options = '';
- $opt_ary = array(
- 0 => 'DISABLED',
- 1 => 'LIGHTBOX_GALLERY_ALL',
- 2 => 'LIGHTBOX_GALLERY_POSTS',
- );
-
- foreach ($opt_ary as $opt_key => $opt_value)
- {
- $options .= '';
- }
-
- return $options;
- }
-
/**
* Find lowest value that is not 0
* Accepts variable number of comparable parameters
diff --git a/language/ar/common.php b/language/ar/common.php
index 700fd7c..9a9377b 100644
--- a/language/ar/common.php
+++ b/language/ar/common.php
@@ -2,7 +2,7 @@
/**
*
* Lightbox extension for the phpBB Forum Software package.
- * [Arabic] Translated By : Bassel Taha Alhitary - www.alhitary.net
+ * [Arabic] Translated By : Bassel Taha Alhitary
*
* @copyright (c) 2015 Matt Friedman
* @license GNU General Public License, version 2 (GPL-2.0)
@@ -23,5 +23,5 @@
}
$lang = array_merge($lang, array(
- 'LIGHTBOX_GALLERY_LABEL' => 'Image %1 of %2',
+ 'LIGHTBOX_GALLERY_LABEL' => 'الصورة %1 من %2',
));
diff --git a/language/ar/lightbox.php b/language/ar/lightbox.php
index 26afe53..e808712 100644
--- a/language/ar/lightbox.php
+++ b/language/ar/lightbox.php
@@ -2,7 +2,7 @@
/**
*
* Lightbox extension for the phpBB Forum Software package.
- * [Arabic] Translated By : Bassel Taha Alhitary - www.alhitary.net
+ * [Arabic] Translated By : Bassel Taha Alhitary
*
* @copyright (c) 2015 Matt Friedman
* @license GNU General Public License, version 2 (GPL-2.0)
@@ -23,20 +23,20 @@
}
$lang = array_merge($lang, array(
- 'LIGHTBOX_SETTINGS' => 'إعدادات تصغير الصور',
- 'LIGHTBOX_MAX_WIDTH' => 'الحد الأقصى لعرض الصورة بالبكسل ',
+ 'LIGHTBOX_SETTINGS' => 'إعدادات تصغير الصور Lightbox',
+ 'LIGHTBOX_MAX_WIDTH' => 'الحد الأقصى لعرض الصورة',
'LIGHTBOX_MAX_WIDTH_EXPLAIN' => 'سيتم تصغير الصور التي تتجاوز هذه القيمة ويمكن تكبيرها بإستخدام تقنية النافذة المضيئة Lightbox. القيمة صفر يعني تعطيل هذا الخيار.',
'LIGHTBOX_MAX_WIDTH_APPEND' => 'التوصية تعتمد على إعدادات الصورة المُرفقة : %spx',
- 'LIGHTBOX_MAX_HEIGHT' => 'Maximum image height',
- 'LIGHTBOX_MAX_HEIGHT_EXPLAIN' => 'Images that exceed this height will be resized and can be enlarged using the Lightbox effect. Set this value to 0 to disable Lightbox image resizing by height.',
- 'LIGHTBOX_ALL_IMAGES' => 'Include all images in Lightbox effect',
- 'LIGHTBOX_ALL_IMAGES_EXPLAIN' => 'With this setting enabled, all posted images can be opened in the Lightbox effect even if they are not being resized.',
- 'LIGHTBOX_GALLERY' => 'السماح بالتنقل بين الصور ',
+ 'LIGHTBOX_MAX_HEIGHT' => 'الحد الأقصى لارتفاع الصورة',
+ 'LIGHTBOX_MAX_HEIGHT_EXPLAIN' => 'سيتم تصغير الصور التي تتجاوز هذه القيمة ويمكن تكبيرها بإستخدام تقنية النافذة المضيئة Lightbox. القيمة صفر تعني تعطيل هذا الخيار.',
+ 'LIGHTBOX_ALL_IMAGES' => 'التطبيق على جميع الصور ',
+ 'LIGHTBOX_ALL_IMAGES_EXPLAIN' => 'عند اختيارك “نعم”, سيكون بالامكان فتح جميع صور المشاركات بواسطة تقنية النافذة المضيئة Lightbox حتى إذا لم يتم تصغير حجمها.',
+ 'LIGHTBOX_GALLERY' => 'السماح بالتنقل بين الصور',
'LIGHTBOX_GALLERY_EXPLAIN' => 'السماح بسهولة التنقل بين جميع الصور المُصغرة في الصفحة بإستخدام تقنية النافذة المضيئة.',
- 'LIGHTBOX_GALLERY_ALL' => 'All resized images on page',
- 'LIGHTBOX_GALLERY_POSTS' => 'All resized images per post',
- 'LIGHTBOX_SIGNATURES' => 'تصغير صور التواقيع ',
+ 'LIGHTBOX_GALLERY_ALL' => 'جميع الصور المُصغرة في الصفحة',
+ 'LIGHTBOX_GALLERY_POSTS' => 'جميع الصور المُصغرة بكل مشاركة',
+ 'LIGHTBOX_SIGNATURES' => 'تصغير صور التواقيع',
'LIGHTBOX_SIGNATURES_EXPLAIN' => 'السماح بتصغير الصور الموجودة في تواقيع الأعضاء.',
- 'LIGHTBOX_IMG_TITLES' => 'إظهار أسماء الصور ',
+ 'LIGHTBOX_IMG_TITLES' => 'إظهار أسماء الصور',
'LIGHTBOX_IMG_TITLES_EXPLAIN' => 'سيتم عرض أسماء الصور كعنوان في خانة التفاصيل للصورة.',
));
diff --git a/language/fr/common.php b/language/fr/common.php
index 495ee57..3682db1 100644
--- a/language/fr/common.php
+++ b/language/fr/common.php
@@ -23,5 +23,5 @@
}
$lang = array_merge($lang, array(
- 'LIGHTBOX_GALLERY_LABEL' => 'Image %1 de %2',
+ 'LIGHTBOX_GALLERY_LABEL' => 'Image %1 sur %2',
));
diff --git a/language/sl/common.php b/language/sl/common.php
new file mode 100644
index 0000000..0d7ccc6
--- /dev/null
+++ b/language/sl/common.php
@@ -0,0 +1,27 @@
+ 'Slika %1 od %2',
+));
diff --git a/language/sl/lightbox.php b/language/sl/lightbox.php
new file mode 100644
index 0000000..007cfe2
--- /dev/null
+++ b/language/sl/lightbox.php
@@ -0,0 +1,42 @@
+ 'Lightbox spreminjanje velikosti slike',
+ 'LIGHTBOX_MAX_WIDTH' => 'Največja širina slike',
+ 'LIGHTBOX_MAX_WIDTH_EXPLAIN' => 'Slike, ki presegajo to širino, bodo spremenjene velikosti in jih je mogoče povečati z učinkom Lightbox. To vrednost nastavite na 0, če želite onemogočiti spreminjanje velikosti slike Lightbox po širini.',
+ 'LIGHTBOX_MAX_WIDTH_APPEND' => 'Priporočilo, ki temelji na nastavitvah priloge slike: %spx',
+ 'LIGHTBOX_MAX_HEIGHT' => 'Največja višina slike',
+ 'LIGHTBOX_MAX_HEIGHT_EXPLAIN' => 'Slike, ki presegajo to višino, bodo spremenjene velikosti in jih lahko povečate z učinkom Lightbox. To vrednost nastavite na 0, če želite onemogočiti spreminjanje velikosti slike Lightbox po višini.',
+ 'LIGHTBOX_ALL_IMAGES' => 'V učinek Lightbox vključi vse slike',
+ 'LIGHTBOX_ALL_IMAGES_EXPLAIN' => 'Če je omogočena ta nastavitev, se lahko vse objavljene slike odprejo v učinku Lightbox, tudi če jih ne spremenite v velikost.',
+ 'LIGHTBOX_GALLERY' => 'Način galerije',
+ 'LIGHTBOX_GALLERY_EXPLAIN' => 'Omogoča enostavno navigacijo med spremenjenimi slikami z učinkom Lightbox.',
+ 'LIGHTBOX_GALLERY_ALL' => 'Vse spremenjene slike na strani',
+ 'LIGHTBOX_GALLERY_POSTS' => 'se spremenjene slike na objavo',
+ 'LIGHTBOX_SIGNATURES' => 'Spremeni velikost slik v podpisu',
+ 'LIGHTBOX_SIGNATURES_EXPLAIN' => 'Slikam v podpisu dovoli spremembo velikosti.',
+ 'LIGHTBOX_IMG_TITLES' => 'Prikaži imena slikovnih datotek',
+ 'LIGHTBOX_IMG_TITLES_EXPLAIN' => 'Imena slik bodo prikazana kot napis v učinku Lightbox.',
+));
diff --git a/phpunit.xml.dist b/phpunit.xml.dist
index 289449d..574c6b9 100644
--- a/phpunit.xml.dist
+++ b/phpunit.xml.dist
@@ -8,7 +8,6 @@
convertWarningsToExceptions="true"
processIsolation="false"
stopOnFailure="false"
- syntaxCheck="false"
verbose="true"
bootstrap="../../../../tests/bootstrap.php"
>
@@ -18,14 +17,11 @@
./tests/functional
- ./tests/functional/
+ ./tests/functional/
-
- ./tests/
- ./
diff --git a/styles/all/template/event/overall_header_stylesheets_after.html b/styles/all/template/event/overall_header_stylesheets_after.html
new file mode 100644
index 0000000..3392239
--- /dev/null
+++ b/styles/all/template/event/overall_header_stylesheets_after.html
@@ -0,0 +1,11 @@
+{% if LIGHTBOX_RESIZE_HEIGHT || LIGHTBOX_RESIZE_WIDTH %}
+
+{% endif %}
diff --git a/styles/all/template/js/resizer.js b/styles/all/template/js/resizer.js
index 9d212bb..4efbd0b 100644
--- a/styles/all/template/js/resizer.js
+++ b/styles/all/template/js/resizer.js
@@ -11,9 +11,9 @@
borderRadius: '6px',
transition: 'border-color 0.1s ease-out',
cursor: 'pointer'
- }).hover(function() {
+ }).on('mouseenter', function() {
$(this).css('border-color', '#4ae');
- }, function() {
+ }).on('mouseleave', function() {
$(this).css('border-color', 'transparent');
});
});
@@ -38,6 +38,9 @@
}
function lightboxResizer(elements) {
+ if (isMobile() || (!resizeWideImages() && !resizeTallImages() && !vseLightbox.lightboxAll)) {
+ return;
+ }
var $targetImage = elements.find('.postimage'),
galleryName = 'post-gallery';
if (!vseLightbox.lightboxSig) {
@@ -45,14 +48,6 @@
return $(this).closest('.signature').length > 0;
});
}
- if (!isMobile() && (resizeWideImages() || resizeTallImages())) {
- $targetImage.css({
- 'max-width': (resizeWideImages() ? vseLightbox.resizeWidth + 'px' : 'none'),
- 'max-height': (resizeTallImages() ? vseLightbox.resizeHeight + 'px' : 'none')
- });
- } else if (!vseLightbox.lightboxAll || isMobile()) {
- return;
- }
// enclosing the following in a setTimeout seems to solve issues with
// images not being ready and causing $(this).width() to return 0.
setTimeout(function() {
@@ -89,14 +84,14 @@
var url = $(this).attr('src');
return $('').attr({
href: url,
- 'data-lightbox': galleryName + img.index,
+ 'data-lightbox': (vseLightbox.lightboxSig && $(this).closest('.signature').length > 0) ? $targetImage.index(this) : galleryName + img.index,
'data-title': (vseLightbox.imageTitles) ? ((url.indexOf(vseLightbox.downloadFile) !== -1) ? $(this).attr('alt') : url.split('/').pop()) : ''
});
}).borderHover();
}
}).each(function() {
if (this.complete) {
- $(this).load();
+ $(this).trigger('load');
}
});
}, 0);
diff --git a/styles/all/template/lightbox/css/lightbox.css b/styles/all/template/lightbox/css/lightbox.css
index 99a025f..b3b0beb 100755
--- a/styles/all/template/lightbox/css/lightbox.css
+++ b/styles/all/template/lightbox/css/lightbox.css
@@ -21,6 +21,7 @@ body.lb-disable-scrolling {
text-align: center;
line-height: 0;
font-weight: normal;
+ outline: none;
}
.lightbox .lb-image {
diff --git a/styles/all/template/lightbox/css/lightbox.min.css b/styles/all/template/lightbox/css/lightbox.min.css
index 2ca46cd..adbaa83 100755
--- a/styles/all/template/lightbox/css/lightbox.min.css
+++ b/styles/all/template/lightbox/css/lightbox.min.css
@@ -1 +1 @@
-.lb-loader,.lightbox{text-align:center;line-height:0}.lb-dataContainer:after,.lb-outerContainer:after{content:"";clear:both}body.lb-disable-scrolling{overflow:hidden}.lightboxOverlay{position:absolute;top:0;left:0;z-index:9999;background-color:#000;filter:alpha(Opacity=80);opacity:.8;display:none}.lightbox{position:absolute;left:0;width:100%;z-index:10000;font-weight:400}.lightbox .lb-image{display:block;height:auto;max-width:inherit;max-height:none;border-radius:3px;border:4px solid #fff}.lightbox a img{border:none}.lb-outerContainer{position:relative;width:250px;height:250px;margin:0 auto;border-radius:4px;background-color:#fff}.lb-loader,.lb-nav{position:absolute;left:0}.lb-outerContainer:after{display:table}.lb-loader{top:43%;height:25%;width:100%}.lb-cancel{display:block;width:32px;height:32px;margin:0 auto;background:url(../images/loading.gif) no-repeat}.lb-nav{top:0;height:100%;width:100%;z-index:10}.lb-container>.nav{left:0}.lb-nav a{outline:0;background-image:url(data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==)}.lb-next,.lb-prev{height:100%;cursor:pointer;display:block}.lb-nav a.lb-prev{width:34%;left:0;float:left;background:url(../images/prev.png) left 48% no-repeat;filter:alpha(Opacity=0);opacity:0;-webkit-transition:opacity .6s;-moz-transition:opacity .6s;-o-transition:opacity .6s;transition:opacity .6s}.lb-nav a.lb-prev:hover{filter:alpha(Opacity=100);opacity:1}.lb-nav a.lb-next{width:64%;right:0;float:right;background:url(../images/next.png) right 48% no-repeat;filter:alpha(Opacity=0);opacity:0;-webkit-transition:opacity .6s;-moz-transition:opacity .6s;-o-transition:opacity .6s;transition:opacity .6s}.lb-nav a.lb-next:hover{filter:alpha(Opacity=100);opacity:1}.lb-dataContainer{margin:0 auto;padding-top:5px;width:100%;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.lb-dataContainer:after{display:table}.lb-data{padding:0 4px;color:#ccc}.lb-data .lb-details{width:85%;float:left;text-align:left;line-height:1.1em}.lb-data .lb-caption{font-size:13px;font-weight:700;line-height:1em}.lb-data .lb-caption a{color:#4ae}.lb-data .lb-number{display:block;clear:left;padding-bottom:1em;font-size:12px;color:#999}.lb-data .lb-close{display:block;float:right;width:30px;height:30px;background:url(../images/close.png) top right no-repeat;text-align:right;outline:0;filter:alpha(Opacity=70);opacity:.7;-webkit-transition:opacity .2s;-moz-transition:opacity .2s;-o-transition:opacity .2s;transition:opacity .2s}.lb-data .lb-close:hover{cursor:pointer;filter:alpha(Opacity=100);opacity:1}
\ No newline at end of file
+.lb-loader,.lightbox{text-align:center;line-height:0;position:absolute;left:0}body.lb-disable-scrolling{overflow:hidden}.lightboxOverlay{position:absolute;top:0;left:0;z-index:9999;background-color:#000;filter:alpha(Opacity=80);opacity:.8;display:none}.lightbox{width:100%;z-index:10000;font-weight:400;outline:0}.lightbox .lb-image{display:block;height:auto;max-width:inherit;max-height:none;border-radius:3px;border:4px solid #fff}.lightbox a img{border:none}.lb-outerContainer{position:relative;width:250px;height:250px;margin:0 auto;border-radius:4px;background-color:#fff}.lb-outerContainer:after{content:"";display:table;clear:both}.lb-loader{top:43%;height:25%;width:100%}.lb-cancel{display:block;width:32px;height:32px;margin:0 auto;background:url(../images/loading.gif) no-repeat}.lb-nav{position:absolute;top:0;left:0;height:100%;width:100%;z-index:10}.lb-container>.nav{left:0}.lb-nav a{outline:0;background-image:url(data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==)}.lb-next,.lb-prev{height:100%;cursor:pointer;display:block}.lb-nav a.lb-prev{width:34%;left:0;float:left;background:url(../images/prev.png) left 48% no-repeat;filter:alpha(Opacity=0);opacity:0;-webkit-transition:opacity .6s;-moz-transition:opacity .6s;-o-transition:opacity .6s;transition:opacity .6s}.lb-nav a.lb-prev:hover{filter:alpha(Opacity=100);opacity:1}.lb-nav a.lb-next{width:64%;right:0;float:right;background:url(../images/next.png) right 48% no-repeat;filter:alpha(Opacity=0);opacity:0;-webkit-transition:opacity .6s;-moz-transition:opacity .6s;-o-transition:opacity .6s;transition:opacity .6s}.lb-nav a.lb-next:hover{filter:alpha(Opacity=100);opacity:1}.lb-dataContainer{margin:0 auto;padding-top:5px;width:100%;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.lb-dataContainer:after{content:"";display:table;clear:both}.lb-data{padding:0 4px;color:#ccc}.lb-data .lb-details{width:85%;float:left;text-align:left;line-height:1.1em}.lb-data .lb-caption{font-size:13px;font-weight:700;line-height:1em}.lb-data .lb-caption a{color:#4ae}.lb-data .lb-number{display:block;clear:left;padding-bottom:1em;font-size:12px;color:#999}.lb-data .lb-close{display:block;float:right;width:30px;height:30px;background:url(../images/close.png) top right no-repeat;text-align:right;outline:0;filter:alpha(Opacity=70);opacity:.7;-webkit-transition:opacity .2s;-moz-transition:opacity .2s;-o-transition:opacity .2s;transition:opacity .2s}.lb-data .lb-close:hover{cursor:pointer;filter:alpha(Opacity=100);opacity:1}
\ No newline at end of file
diff --git a/styles/all/template/lightbox/js/lightbox.js b/styles/all/template/lightbox/js/lightbox.js
index a1bb308..8d8ea06 100755
--- a/styles/all/template/lightbox/js/lightbox.js
+++ b/styles/all/template/lightbox/js/lightbox.js
@@ -1,5 +1,5 @@
/*!
- * Lightbox v2.11.0
+ * Lightbox v2.11.1
* by Lokesh Dhakar
*
* More info:
@@ -99,7 +99,19 @@
}
var self = this;
- $('
').appendTo($('body'));
+
+ // The two root notes generated, #lightboxOverlay and #lightbox are given
+ // tabindex attrs so they are focusable. We attach our keyboard event
+ // listeners to these two elements, and not the document. Clicking anywhere
+ // while Lightbox is opened will keep the focus on or inside one of these
+ // two elements.
+ //
+ // We do this so we can prevent propogation of the Esc keypress when
+ // Lightbox is open. This prevents it from intefering with other components
+ // on the page below.
+ //
+ // Github issue: https://github.com/lokesh/lightbox2/issues/663
+ $('
').appendTo($('body'));
// Cache jQuery objects
this.$lightbox = $('#lightbox');
@@ -323,24 +335,28 @@
if (self.options.maxWidth && self.options.maxWidth < maxImageWidth) {
maxImageWidth = self.options.maxWidth;
}
- if (self.options.maxHeight && self.options.maxHeight < maxImageWidth) {
+ if (self.options.maxHeight && self.options.maxHeight < maxImageHeight) {
maxImageHeight = self.options.maxHeight;
}
- // Is the current image's width or height is greater than the maxImageWidth or maxImageHeight
- // option than we need to size down while maintaining the aspect ratio.
- if ((preloader.width > maxImageWidth) || (preloader.height > maxImageHeight)) {
- if ((preloader.width / maxImageWidth) > (preloader.height / maxImageHeight)) {
- imageWidth = maxImageWidth;
- imageHeight = parseInt(preloader.height / (preloader.width / imageWidth), 10);
- $image.width(imageWidth);
- $image.height(imageHeight);
- } else {
- imageHeight = maxImageHeight;
- imageWidth = parseInt(preloader.width / (preloader.height / imageHeight), 10);
- $image.width(imageWidth);
- $image.height(imageHeight);
- }
+ } else {
+ maxImageWidth = self.options.maxWidth || preloader.width || maxImageWidth;
+ maxImageHeight = self.options.maxHeight || preloader.height || maxImageHeight;
+ }
+
+ // Is the current image's width or height is greater than the maxImageWidth or maxImageHeight
+ // option than we need to size down while maintaining the aspect ratio.
+ if ((preloader.width > maxImageWidth) || (preloader.height > maxImageHeight)) {
+ if ((preloader.width / maxImageWidth) > (preloader.height / maxImageHeight)) {
+ imageWidth = maxImageWidth;
+ imageHeight = parseInt(preloader.height / (preloader.width / imageWidth), 10);
+ $image.width(imageWidth);
+ $image.height(imageHeight);
+ } else {
+ imageHeight = maxImageHeight;
+ imageWidth = parseInt(preloader.width / (preloader.height / imageHeight), 10);
+ $image.width(imageWidth);
+ $image.height(imageHeight);
}
}
self.sizeContainer($image.width(), $image.height());
@@ -383,6 +399,10 @@
self.$lightbox.find('.lb-dataContainer').width(newWidth);
self.$lightbox.find('.lb-prevLink').height(newHeight);
self.$lightbox.find('.lb-nextLink').height(newHeight);
+
+ // Set focus on one of the two root nodes so keyboard events are captured.
+ self.$overlay.focus();
+
self.showImage();
}
@@ -489,11 +509,13 @@
};
Lightbox.prototype.enableKeyboardNav = function() {
- $(document).on('keyup.keyboard', $.proxy(this.keyboardAction, this));
+ this.$lightbox.on('keyup.keyboard', $.proxy(this.keyboardAction, this));
+ this.$overlay.on('keyup.keyboard', $.proxy(this.keyboardAction, this));
};
Lightbox.prototype.disableKeyboardNav = function() {
- $(document).off('.keyboard');
+ this.$lightbox.off('.keyboard');
+ this.$overlay.off('.keyboard');
};
Lightbox.prototype.keyboardAction = function(event) {
@@ -503,6 +525,8 @@
var keycode = event.keyCode;
if (keycode === KEYCODE_ESC) {
+ // Prevent bubbling so as to not affect other components on the page.
+ event.stopPropagation();
this.end();
} else if (keycode === KEYCODE_LEFTARROW) {
if (this.currentImageIndex !== 0) {
diff --git a/styles/all/template/lightbox/js/lightbox.min.js b/styles/all/template/lightbox/js/lightbox.min.js
index bfde902..9218739 100755
--- a/styles/all/template/lightbox/js/lightbox.min.js
+++ b/styles/all/template/lightbox/js/lightbox.min.js
@@ -1,5 +1,5 @@
/*!
- * Lightbox v2.11.0
+ * Lightbox v2.11.1
* by Lokesh Dhakar
*
* More info:
@@ -11,5 +11,5 @@
*
* @preserve
*/
-!function(a,b){"function"==typeof define&&define.amd?define(["jquery"],b):"object"==typeof exports?module.exports=b(require("jquery")):a.lightbox=b(a.jQuery)}(this,function(a){function b(b){this.album=[],this.currentImageIndex=void 0,this.init(),this.options=a.extend({},this.constructor.defaults),this.option(b)}return b.defaults={albumLabel:"Image %1 of %2",alwaysShowNavOnTouchDevices:!1,fadeDuration:600,fitImagesInViewport:!0,imageFadeDuration:600,positionFromTop:50,resizeDuration:700,showImageNumberLabel:!0,wrapAround:!1,disableScrolling:!1,sanitizeTitle:!1},b.prototype.option=function(b){a.extend(this.options,b)},b.prototype.imageCountLabel=function(a,b){return this.options.albumLabel.replace(/%1/g,a).replace(/%2/g,b)},b.prototype.init=function(){var b=this;a(document).ready(function(){b.enable(),b.build()})},b.prototype.enable=function(){var b=this;a("body").on("click","a[rel^=lightbox], area[rel^=lightbox], a[data-lightbox], area[data-lightbox]",function(c){return b.start(a(c.currentTarget)),!1})},b.prototype.build=function(){if(!(a("#lightbox").length>0)){var b=this;a('