diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index 340a34ab..29e1d67e 100644
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -347,6 +347,14 @@
"message": "Changes the padding size for zoomed images. Padding determines how close the image can get to the edge of the viewing window",
"description": "[options] Tooltip for adjust the zoomed image padding size option"
},
+ "optFullZoomHidesDetailsCaptions": {
+ "message": "Full zoom key hides details and captions",
+ "description": "[options] Full zoom key hides details and captions option"
+ },
+ "optFullZoomHidesDetailsCaptionsTooltip": {
+ "message": "When pressing full zoom, details and captions will be hidden, allowing the image able to expand more vertically",
+ "description": "[options] Tooltip for full zoom key hides details and captions option"
+ },
"optStatusBarOverlap": {
"message": "Allow zoomed images to overlap the status bar",
"description": "[options] Allow zoomed images to overlap the status bar option"
diff --git a/html/options.html b/html/options.html
index 9f9e3506..541a0628 100644
--- a/html/options.html
+++ b/html/options.html
@@ -181,6 +181,14 @@
+
diff --git a/js/common.js b/js/common.js
index 276807b9..8a10c1cc 100644
--- a/js/common.js
+++ b/js/common.js
@@ -36,6 +36,7 @@ var factorySettings = {
ambilightBackgroundOpacity : 0.9,
disabledPlugins : [],
imagePaddingSize : 10,
+ fullZoomHidesDetailsCaptions : false,
statusBarOverlap : false,
hScrollBarOverlap : false,
centerImages : false,
@@ -147,6 +148,7 @@ function loadOptions() {
options.ambilightBackgroundOpacity = options.hasOwnProperty('ambilightBackgroundOpacity') ? options.ambilightBackgroundOpacity : factorySettings.ambilightBackgroundOpacity;
options.disabledPlugins = options.hasOwnProperty('disabledPlugins') ? options.disabledPlugins : factorySettings.disabledPlugins;
options.imagePaddingSize = options.hasOwnProperty('imagePaddingSize') ? options.imagePaddingSize : factorySettings.imagePaddingSize;
+ options.fullZoomHidesDetailsCaptions = options.hasOwnProperty('fullZoomHidesDetailsCaptions') ? options.fullZoomHidesDetailsCaptions : factorySettings.fullZoomHidesDetailsCaptions;
options.statusBarOverlap = options.hasOwnProperty('statusBarOverlap') ? options.statusBarOverlap : factorySettings.statusBarOverlap;
options.hScrollBarOverlap = options.hasOwnProperty('hScrollBarOverlap') ? options.hScrollBarOverlap : factorySettings.hScrollBarOverlap;
options.centerImages = options.hasOwnProperty('centerImages') ? options.centerImages : factorySettings.centerImages;
diff --git a/js/hoverzoom.js b/js/hoverzoom.js
index c4637025..ba6c3f6c 100644
--- a/js/hoverzoom.js
+++ b/js/hoverzoom.js
@@ -404,11 +404,23 @@ var hoverZoom = {
if (hzBelow)
hzBelow.css('max-width', 0);
+ // hides caption and details to fill window more with image when fullZoomKey is pressed
+ const fullZoomKey = fullZoomKeyDown;
+ const hideDetailsandCaptions = options.fullZoomHidesDetailsCaptions;
+ const hzAboveHeight = (fullZoomKey && hideDetailsandCaptions) ? padding : hzAbove.height();
+ const hzBelowHeight = (fullZoomKey && hideDetailsandCaptions) ? padding : hzBelow.height();
+
+ // needed so height adjusts properly when fullZoomKey is released
+ if (!fullZoomKey && hideDetailsandCaptions) {
+ if (hzAbove) hzAbove.show();
+ if (hzBelow) hzBelow.show();
+ }
+
// this is looped 10x max just in case something goes wrong, to avoid freezing the process
let i = 0;
while (!viewerLocked && hz.hzViewer.height() > wndHeight - statusBarHeight - scrollBarHeight && i++ < 10) {
- imgFullSize.height(wndHeight - padding - statusBarHeight - scrollBarHeight - (hzAbove ? hzAbove.height() : 0) - (hzBelow ? hzBelow.height() : 0)).width('auto');
+ imgFullSize.height(wndHeight - padding - statusBarHeight - scrollBarHeight - (hzAbove ? hzAboveHeight : 0) - (hzBelow ? hzBelowHeight : 0)).width('auto');
}
if (hzCaptionMiscellaneous) {
@@ -432,8 +444,8 @@ var hoverZoom = {
hzBelow.css('position', 'absolute');
}
- // do not display caption nor details if img is too small
- if (imgFullSize[0].clientWidth < 50) {
+ // do not display caption nor details if img is too small, or if full zoom key is pressed
+ if (imgFullSize[0].clientWidth < 50 || (fullZoomKey && hideDetailsandCaptions)) {
if (hzAbove) hzAbove.hide();
if (hzBelow) hzBelow.hide();
} else {
@@ -531,7 +543,7 @@ var hoverZoom = {
}
// horizontal position adjustment if full zoom
- if (fullZoom) {
+ if (fullZoom || fullZoomKey) {
if (displayOnRight) {
position.left = Math.min(position.left, wndScrollLeft + wndWidth - hz.hzViewer.width() - padding - 2 * scrollBarWidth);
} else {
@@ -540,13 +552,16 @@ var hoverZoom = {
}
// vertical position adjustments
- var maxTop = wndScrollTop + wndHeight - hz.hzViewer.height() - padding - statusBarHeight - scrollBarHeight;
+ const maxTop = wndScrollTop + wndHeight - hz.hzViewer.height() - padding - statusBarHeight - scrollBarHeight;
if (position.top > maxTop) {
position.top = maxTop;
}
if (position.top < wndScrollTop + padding) {
position.top = wndScrollTop + padding;
}
+ if (fullZoomKey && position.top == wndScrollTop + padding) {
+ position.top = wndScrollTop + padding / 1.5;
+ }
if (options.ambilightEnabled) {
updateAmbilight();
diff --git a/js/options.js b/js/options.js
index 90eb317e..91b0cf3b 100644
--- a/js/options.js
+++ b/js/options.js
@@ -108,6 +108,7 @@ function saveOptions(exportSettings = false) {
options.ambilightHaloSize = $('#txtAmbilightHaloSize')[0].value / 100;
options.ambilightBackgroundOpacity = $('#txtAmbilightBackgroundOpacity')[0].value / 100;
options.imagePaddingSize = $('#txtImagePaddingSize')[0].value;
+ options.fullZoomHidesDetailsCaptions = $('#chkFullZoomHidesDetailsCaptions')[0].checked;
options.statusBarOverlap = $('#chkStatusBarOverlap')[0].checked;
options.hScrollBarOverlap = $('#chkHScrollBarOverlap')[0].checked;
options.centerImages = $('#chkCenterImages')[0].checked;
@@ -227,6 +228,7 @@ function restoreOptions(optionsFromFactorySettings) {
$('#txtAmbilightHaloSize').val(parseInt(options.ambilightHaloSize * 100));
$('#rngAmbilightBackgroundOpacity').val(parseInt(options.ambilightBackgroundOpacity * 100));
$('#txtAmbilightBackgroundOpacity').val(parseInt(options.ambilightBackgroundOpacity * 100));
+ $('#chkFullZoomHidesDetailsCaptions').trigger(options.fullZoomHidesDetailsCaptions ? 'gumby.check' : 'gumby.uncheck');
$('#chkStatusBarOverlap').trigger(options.statusBarOverlap ? 'gumby.check' : 'gumby.uncheck');
$('#chkHScrollBarOverlap').trigger(options.hScrollBarOverlap ? 'gumby.check' : 'gumby.uncheck');
$('#chkCenterImages').trigger(options.centerImages ? 'gumby.check' : 'gumby.uncheck');