extesy · GrosPoulet · Jan 17, 2021 · Jan 17, 2021
diff --git a/_locales/en/messages.json b/_locales/en/messages.json
@@ -367,6 +367,22 @@
         "message": "%",
         "description": "[options] Unit name (percentage) for opacity option"
     },
+    "optUseSeparateTabOrWindowForUnloadableUrlsTooltip": {
+        "message": "Useful for HTTPS sites such as Google Images that prevent loading of HTTP images",
+        "description": "[options] Tooltip for using separate tab or window for unloadable urls option"
+    },
+    "optUseSeparateTabOrWindowForUnloadableUrls": {
+        "message": "Try to open unloadable urls in separate:",
+        "description": "[options] Use separate tab or window for unloadable urls option"
+    },
+    "optUseSeparateTabForUnloadableUrls": {
+        "message": "Tab",
+        "description": "[options] Use separate tab for unloadable urls option"
+    },
+    "optUseSeparateWindowForUnloadableUrls": {
+        "message": "Window",
+        "description": "[options] Use separate window for unloadable urls option"
+    },
     "optDownloadFolderTooltip": {
         "message": "Subfolder(s) will be created if needed",
         "description": "[options] Tooltip for download folder option"

diff --git a/html/options.html b/html/options.html
@@ -138,6 +138,20 @@ <h1 class="ten columns text-center" data-i18n="optTitle"></h1>
                                         </label>
                                     </li>
                                 </div>
+                                <div class="ttip" data-i18n-tooltip="optUseSeparateTabOrWindowForUnloadableUrlsTooltip">
+                                    <li class="field">
+                                        <label class="checkbox inline" style="padding-right:0px" for="chkUseSeparateTabOrWindowForUnloadableUrlsEnabled">
+                                            <input type="checkbox" id="chkUseSeparateTabOrWindowForUnloadableUrlsEnabled"><span></span>
+                                            <div style="display:inline" data-i18n="optUseSeparateTabOrWindowForUnloadableUrls"></div>
+                                        </label>
+                                        <div id="divUseSeparateTabOrWindowForUnloadableUrls" style="display:inline">
+                                            <select id="selectUseSeparateTabOrWindowForUnloadableUrls" class="picker">
+                                                <option value="tab" data-i18n="optUseSeparateTabForUnloadableUrls"></option>
+                                                <option value="window" data-i18n="optUseSeparateWindowForUnloadableUrls"></option>
+                                            </select>
+                                        </div>
+                                    </li>
+                                </div>
                             </ul>
                         </fieldset>
                         <fieldset>

diff --git a/js/background.js b/js/background.js
@@ -106,6 +106,9 @@ function onMessage(message, sender, callback) {
                 });
             });
             break;
+        case 'updateViewWindow':
+            chrome.windows.getCurrent(window => { chrome.windows.update(window.id, { width:message.updateData.width, height:message.updateData.height, top:message.updateData.top, left:message.updateData.left }) });
+            break;
     }
 }
 

diff --git a/js/common.js b/js/common.js
@@ -36,6 +36,8 @@ var factorySettings = {
     zoomedSizeThresholdEnabled : true,
     zoomedSizeThreshold : 100,
     downloadFolder : '',
+    useSeparateTabOrWindowForUnloadableUrlsEnabled: false,
+    useSeparateTabOrWindowForUnloadableUrls: 'window',
     captionLocation : 'below',
     actionKey : 0,
     fullZoomKey : 90,
@@ -98,6 +100,8 @@ function loadOptions() {
     options.zoomedSizeThresholdEnabled = options.hasOwnProperty('zoomedSizeThresholdEnabled') ? options.zoomedSizeThresholdEnabled : factorySettings.zoomedSizeThresholdEnabled;
     options.zoomedSizeThreshold = options.hasOwnProperty('zoomedSizeThreshold') ? options.zoomedSizeThreshold : factorySettings.zoomedSizeThreshold;
     options.downloadFolder = options.hasOwnProperty('downloadFolder') ? options.downloadFolder : factorySettings.downloadFolder;
+    options.useSeparateTabOrWindowForUnloadableUrlsEnabled = options.hasOwnProperty('useSeparateTabOrWindowForUnloadableUrlsEnabled') ? options.useSeparateTabOrWindowForUnloadableUrlsEnabled : factorySettings.useSeparateTabOrWindowForUnloadableUrlsEnabled;
+    options.useSeparateTabOrWindowForUnloadableUrls = options.hasOwnProperty('useSeparateTabOrWindowForUnloadableUrls') ? options.useSeparateTabOrWindowForUnloadableUrls : factorySettings.useSeparateTabOrWindowForUnloadableUrls;
 
     // Used old showCaptions option for backwards compatibility
     var showCaptions = options.hasOwnProperty('showCaptions') ? options.showCaptions : true;

diff --git a/js/hoverzoom.js b/js/hoverzoom.js
@@ -840,32 +840,36 @@ var hoverZoom = {
         }
 
         function imgFullSizeOnError() {
-            let src = imgDetails.url;
-            if (src === $(this).attr('src')) {
+
+            if (imgDetails.url === $(this).prop('src')) {
                 let hoverZoomSrcIndex = hz.currentLink ? hz.currentLink.data().hoverZoomSrcIndex : 0;
-                if (window.location.protocol === 'https:' && src.indexOf('http:') === 0) {
-                    // try switching to https if the main site is loaded using https protocol and image is using http
-                    src = 'https' + src.substr(src.indexOf(':'));
-                } else if (hz.currentLink && hoverZoomSrcIndex < hz.currentLink.data().hoverZoomSrc.length - 1) {
+
+                if (hz.currentLink && hoverZoomSrcIndex < hz.currentLink.data().hoverZoomSrc.length - 1) {
                     // If the link has several possible sources, we try to load the next one
+                    if (imgFullSize) {
+                        imgFullSize.remove();
+                        imgFullSize = null;
+                    }
                     hoverZoomSrcIndex++;
                     hz.currentLink.data().hoverZoomSrcIndex = hoverZoomSrcIndex;
-                    src = hz.currentLink.data().hoverZoomSrc[hoverZoomSrcIndex];
-                } else {
-                    src = null;
-                }
-
-                if (src) {
-                    imgFullSize.remove();
-                    imgFullSize = null;
-                    console.info('[HoverZoom] Failed to load image: ' + imgDetails.url + '\nTrying next one: ' + src);
-                    imgDetails.url = src;
+                    let nextSrc = hz.currentLink.data().hoverZoomSrc[hoverZoomSrcIndex];
+                    console.info('[HoverZoom] Failed to load image: ' + imgDetails.url + '\nTrying next one: ' + nextSrc);
+                    imgDetails.url = nextSrc;
                     clearTimeout(loadFullSizeImageTimeout);
                     loadFullSizeImageTimeout = setTimeout(loadFullSizeImage, 10);
                 } else {
                     hideHoverZoomImg();
-                    //hz.currentLink.removeClass('hoverZoomLink').removeData();
-                    console.warn('[HoverZoom] Failed to load image: ' + src);
+                    if (options.useSeparateTabOrWindowForUnloadableUrlsEnabled) {
+                        // last attempt to display image
+                        console.info('[HoverZoom] Failed to load image: ' + imgDetails.url + ' in current window.\nTrying to load image in separate window or tab...');
+                        if (options.useSeparateTabOrWindowForUnloadableUrls == 'window') {
+                            openImageInWindow();
+                        } else if (options.useSeparateTabOrWindowForUnloadableUrls == 'tab') {
+                            openImageInTab(true); // do not focus tab
+                        }
+                    } else {
+                        console.warn('[HoverZoom] Failed to load image: ' + imgDetails.url);
+                    }
                 }
             }
         }

diff --git a/js/options.js b/js/options.js
@@ -115,6 +115,8 @@ function saveOptions() {
     options.picturesOpacity = $('#txtPicturesOpacity')[0].value / 100;
     options.captionLocation = $('#selectCaptionLocation').val();
     options.downloadFolder = $('#txtDownloadFolder')[0].value;
+    options.useSeparateTabOrWindowForUnloadableUrlsEnabled = $('#chkUseSeparateTabOrWindowForUnloadableUrlsEnabled')[0].checked;
+    options.useSeparateTabOrWindowForUnloadableUrls = $('#selectUseSeparateTabOrWindowForUnloadableUrls').val();
 
     localStorage.options = JSON.stringify(options);
     sendOptions(options);
@@ -200,6 +202,8 @@ function restoreOptions(optionsFromFactorySettings) {
     $('#chkZoomedSizeThresholdEnabled').trigger(options.zoomedSizeThresholdEnabled ? 'gumby.check' : 'gumby.uncheck');
     $('#txtZoomedSizeThreshold').val(parseInt(options.zoomedSizeThreshold));
     $('#txtDownloadFolder').val(options.downloadFolder);
+    $('#chkUseSeparateTabOrWindowForUnloadableUrlsEnabled').trigger(options.useSeparateTabOrWindowForUnloadableUrlsEnabled ? 'gumby.check' : 'gumby.uncheck');
+    $('#selectUseSeparateTabOrWindowForUnloadableUrls').val(options.useSeparateTabOrWindowForUnloadableUrls);
 
     return false;
 }
@@ -307,6 +311,13 @@ function updateDivAmbilight() {
     }
 }
 
+function updateUseSeparateTabOrWindowForUnloadableUrls() {
+    if ($('#chkUseSeparateTabOrWindowForUnloadableUrlsEnabled')[0].checked) {
+        $('#selectUseSeparateTabOrWindowForUnloadableUrls').removeClass('disabled');
+    } else {
+        $('#selectUseSeparateTabOrWindowForUnloadableUrls').addClass('disabled');
+    }
+}
 function updateTxtAmbilightBackgroundOpacity() {
     $('#txtAmbilightBackgroundOpacity')[0].value = this.value;
 }
@@ -376,7 +387,7 @@ function loadPlugins() {
 }
 
 function populatePluginsTable() {
-    var plugins = $.unique(hoverZoomPlugins.map(function(plugin) {return plugin.name}));
+    var plugins = $.unique(hoverZoomPlugins.map(function(plugin) {return plugin.name})).sort(Intl.Collator().compare);
     plugins.forEach(function(plugin) {
         var chkName = 'chkPlugin' + plugin.replace(/[^\w]/g, '').toLowerCase();
         $('<div class="field"><label class="checkbox" for="' + chkName + '"><input type="checkbox" id="' + chkName + '" class="chkPlugin"><span></span>&nbsp;<div style="display:inline">' + plugin + '</div></label></div>').appendTo('#tblPlugins');
@@ -421,6 +432,7 @@ $(function () {
     $('#btnAddExcludedSite').click(btnAddExcludedSiteOnClick);
     $('#btnRemoveExcludedSite').click(btnRemoveExcludedSiteOnClick);
     $('#txtDownloadFolder').change(downloadFolderOnChange);
+    $('#chkUseSeparateTabOrWindowForUnloadableUrlsEnabled').parent().on('gumby.onChange', updateUseSeparateTabOrWindowForUnloadableUrls);
 
     restoreOptions();
     loadPlugins();

diff --git a/js/viewWindow.js b/js/viewWindow.js
@@ -7,4 +7,39 @@ chrome.runtime.sendMessage({action:'getOptions'}, function (options) {
             window.close();
         }
     });
-});
+});
+
+// one and only one image should be displayed
+if (document.images.length == 1) {
+    var naturalWidth = document.images[0].naturalWidth;
+    var naturalHeight = document.images[0].naturalHeight;
+
+    //resize window according to image dimensionsw
+    var popupBorder = {width:16, height:38};
+    var updateData = {};
+
+    updateData.width = naturalWidth + popupBorder.width;
+    updateData.height = naturalHeight + popupBorder.height;
+
+    // if image is bigger than screen, adjust window dimensions to match image's aspect ratio
+    if (updateData.height > screen.availHeight) {
+        updateData.height = screen.availHeight;
+        updateData.width = Math.round(popupBorder.width + (screen.availHeight - popupBorder.height) * naturalWidth / naturalHeight);
+    }
+    if (updateData.width > screen.availWidth) {
+        updateData.width = screen.availWidth;
+        updateData.height = Math.round(popupBorder.height + (screen.availWidth - popupBorder.width) * naturalHeight / naturalWidth);
+    }
+
+    // center window
+    updateData.top = Math.round(screen.availHeight / 2 - updateData.height / 2);
+    updateData.left = Math.round(screen.availWidth / 2 - updateData.width / 2);
+
+    // update window only if needed
+    if (updateData.width != window.outerWidth || updateData.height != window.outerHeight || updateData.top != window.screenTop || updateData.left != window.screenLeft) {
+        chrome.runtime.sendMessage({action:'updateViewWindow', updateData:updateData});
+    }
+
+} else {
+    window.close();
+}
-Original file line number
+Diff line change
@@ Expand Up / @@ -106,6 +106,9 @@ function onMessage(message, sender, callback) { @@
                     });
                 });
                 break;
+            case 'updateViewWindow':
+                chrome.windows.getCurrent(window => { chrome.windows.update(window.id, { width:message.updateData.width, height:message.updateData.height, top:message.updateData.top, left:message.updateData.left }) });
+                break;
         }
     }
@@ Expand Down @@