diff --git a/libs/editor/libs/editor-common/assets/ZSSRichTextEditor.js b/libs/editor/libs/editor-common/assets/ZSSRichTextEditor.js
index 1c63f1ce7881..d8b14e811d44 100755
--- a/libs/editor/libs/editor-common/assets/ZSSRichTextEditor.js
+++ b/libs/editor/libs/editor-common/assets/ZSSRichTextEditor.js
@@ -919,29 +919,54 @@ ZSSEditor.replaceLocalImageWithRemoteImage = function(imageNodeIdentifier, remot
var image = new Image;
image.onload = function () {
- imageNode.attr('src', image.src);
- imageNode.addClass("wp-image-" + remoteImageId);
- ZSSEditor.markImageUploadDone(imageNodeIdentifier);
- var joinedArguments = ZSSEditor.getJoinedFocusedFieldIdAndCaretArguments();
- ZSSEditor.callback("callback-input", joinedArguments);
-
+ ZSSEditor.finishLocalImageSwap(image, imageNode, imageNodeIdentifier, remoteImageId)
+ image.classList.add("image-loaded");
+ console.log("Image Loaded!");
}
image.onerror = function () {
- // Even on an error, we swap the image for the time being. This is because private
- // blogs are currently failing to download images due to access privilege issues.
- //
- imageNode.attr('src', image.src);
- imageNode.addClass("wp-image-" + remoteImageId);
- ZSSEditor.markImageUploadDone(imageNodeIdentifier);
- var joinedArguments = ZSSEditor.getJoinedFocusedFieldIdAndCaretArguments();
- ZSSEditor.callback("callback-input", joinedArguments);
-
+ // Add a remoteUrl attribute, remoteUrl and src must be swapped before publishing.
+ image.setAttribute('remoteurl', image.src);
+ // Try to reload the image on error.
+ ZSSEditor.tryToReload(image, imageNode, imageNodeIdentifier, remoteImageId, 1);
}
image.src = remoteImageUrl;
};
+ZSSEditor.finishLocalImageSwap = function(image, imageNode, imageNodeIdentifier, remoteImageId) {
+ imageNode.addClass("wp-image-" + remoteImageId);
+ if (image.getAttribute("remoteurl")) {
+ imageNode.attr('remoteurl', image.getAttribute("remoteurl"));
+ }
+ imageNode.attr('src', image.src);
+ ZSSEditor.markImageUploadDone(imageNodeIdentifier);
+ var joinedArguments = ZSSEditor.getJoinedFocusedFieldIdAndCaretArguments();
+ ZSSEditor.callback("callback-input", joinedArguments);
+ image.onerror = null;
+}
+
+ZSSEditor.reloadImage = function(image, imageNode, imageNodeIdentifier, remoteImageId, nCall) {
+ if (image.classList.contains("image-loaded")) {
+ return;
+ }
+ image.onerror = ZSSEditor.tryToReload(image, imageNode, imageNodeIdentifier, remoteImageId, nCall + 1);
+ // Force reloading by updating image src
+ image.src = image.getAttribute("remoteurl") + "?retry=" + nCall;
+ console.log("Reloading image:" + nCall + " - " + image.src);
+}
+
+ZSSEditor.tryToReload = function (image, imageNode, imageNodeIdentifier, remoteImageId, nCall) {
+ if (nCall > 8) { // 7 tries: 22500 ms total
+ ZSSEditor.finishLocalImageSwap(image, imageNode, imageNodeIdentifier, remoteImageId);
+ return;
+ }
+ image.onerror = null;
+ console.log("Image not loaded");
+ // reload the image with a variable delay: 500ms, 1000ms, 1500ms, 2000ms, etc.
+ setTimeout(ZSSEditor.reloadImage, nCall * 500, image, imageNode, imageNodeIdentifier, remoteImageId, nCall);
+}
+
/**
* @brief Update the progress indicator for the image identified with the value in progress.
*
@@ -992,9 +1017,10 @@ ZSSEditor.markImageUploadDone = function(imageNodeIdentifier) {
imageNode.parent().replaceWith(imageNode);
}
// Wrap link around image
- var linkTag = '';
- imageNode.wrap(linkTag);
-
+ var link = $('', { href: imageNode.attr("src") } );
+ imageNode.wrap(link);
+ // We invoke the sendImageReplacedCallback with a delay to avoid for
+ // it to be ignored by the webview because of the previous callback being done.
var thisObj = this;
setTimeout(function() { thisObj.sendImageReplacedCallback(imageNodeIdentifier);}, 500);
};
@@ -1630,6 +1656,28 @@ ZSSEditor.removeImageSelectionFormattingFromHTML = function( html ) {
return tmpDom.html();
}
+ZSSEditor.removeImageRemoteUrl = function(html) {
+ var tmp = document.createElement("div");
+ var tmpDom = $(tmp).html(html);
+
+ var matches = tmpDom.find("img");
+ if (matches.length == 0) {
+ return html;
+ }
+
+ for (var i = 0; i < matches.length; i++) {
+ if (matches[i].getAttribute('remoteurl')) {
+ if (matches[i].parentNode && matches[i].parentNode.href === matches[i].src) {
+ matches[i].parentNode.href = matches[i].getAttribute('remoteurl')
+ }
+ matches[i].src = matches[i].getAttribute('remoteurl');
+ matches[i].removeAttribute('remoteurl');
+ }
+ }
+
+ return tmpDom.html();
+}
+
/**
* @brief Finds all related caption nodes for the specified image node.
*
@@ -2070,6 +2118,7 @@ ZSSEditor.applyVisualFormatting = function( html ) {
*/
ZSSEditor.removeVisualFormatting = function( html ) {
var str = html;
+ str = ZSSEditor.removeImageRemoteUrl( str );
str = ZSSEditor.removeImageSelectionFormattingFromHTML( str );
str = ZSSEditor.removeCaptionFormatting( str );
str = ZSSEditor.replaceVideoPressVideosForShortcode( str );