diff --git a/src/Umbraco.Web.UI.Client/src/preview/preview.controller.js b/src/Umbraco.Web.UI.Client/src/preview/preview.controller.js
index 056ade090e..7a005298c1 100644
--- a/src/Umbraco.Web.UI.Client/src/preview/preview.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/preview/preview.controller.js
@@ -144,6 +144,10 @@ var app = angular.module("umbraco.preview", ['umbraco.resources', 'umbraco.servi
window.addEventListener("blur", windowBlurHandler);
function windowVisibilityHandler(e) {
+
+ var amountOfPreviewSessions = localStorage.getItem('UmbPreviewSessionAmount');
+ console.log("windowVisibilityHandler", amountOfPreviewSessions)
+
// When tab is visible again:
if(document.hidden === false) {
checkPreviewState();
@@ -151,9 +155,15 @@ var app = angular.module("umbraco.preview", ['umbraco.resources', 'umbraco.servi
}
document.addEventListener("visibilitychange", windowVisibilityHandler);
+ function beforeUnloadHandler(e) {
+ endPreviewSession();
+ }
+ window.addEventListener("beforeunload", beforeUnloadHandler, false);
+
$scope.$on("$destroy", function () {
window.removeEventListener("blur", windowBlurHandler);
- window.removeEventListener("visibilitychange", windowVisibilityHandler);
+ document.removeEventListener("visibilitychange", windowVisibilityHandler);
+ window.removeEventListener("beforeunload", beforeUnloadHandler);
});
@@ -291,14 +301,14 @@ var app = angular.module("umbraco.preview", ['umbraco.resources', 'umbraco.servi
var modal = document.createElement("div");
modal.className = "umbraco-preview-dialog__modal";
- modal.innerHTML = `Preview content?
- You have ended preview mode, do you want to continue previewing this content?
`;
+ modal.innerHTML = `${$window.umbLocalizedVars.returnToPreviewHeadline}
+ ${$window.umbLocalizedVars.returnToPreviewDescription}
`;
con.appendChild(modal);
var continueButton = document.createElement("button");
continueButton.type = "button";
continueButton.className = "umbraco-preview-dialog__continue";
- continueButton.innerHTML = "Preview content";
+ continueButton.innerHTML = $window.umbLocalizedVars.returnToPreviewButton;
continueButton.addEventListener("click", () => {
bodyEl.removeChild(fragment);
reenterPreviewMode();
@@ -320,6 +330,7 @@ var app = angular.module("umbraco.preview", ['umbraco.resources', 'umbraco.servi
id: $scope.pageId
}
})
+ startPreviewSession();
}
function getPageURL() {
var culture = $location.search().culture || getParameterByName("culture");
@@ -330,6 +341,29 @@ var app = angular.module("umbraco.preview", ['umbraco.resources', 'umbraco.servi
return relativeUrl;
}
+ function startPreviewSession() {
+ // lets registrer this preview session.
+ var amountOfPreviewSessions = Math.max(localStorage.getItem('UmbPreviewSessionAmount') || 0, 0);
+ amountOfPreviewSessions++;
+ localStorage.setItem('UmbPreviewSessionAmount', amountOfPreviewSessions);
+ console.log("UmbPreviewSessionAmount", amountOfPreviewSessions)
+ }
+ function resetPreviewSessions() {
+ localStorage.setItem('UmbPreviewSessionAmount', 0);
+ }
+ function endPreviewSession() {
+ var amountOfPreviewSessions = localStorage.getItem('UmbPreviewSessionAmount') || 0;
+ amountOfPreviewSessions--;
+ localStorage.setItem('UmbPreviewSessionAmount', amountOfPreviewSessions);
+ console.log("ENDDDD", amountOfPreviewSessions)
+
+ if(amountOfPreviewSessions <= 0) {
+ // We are good to secretly end preview mode.
+ navigator.sendBeacon("../preview/end");
+ }
+ }
+ startPreviewSession();
+
/*****************************************************************************/
/* Preview devices */
/*****************************************************************************/
@@ -353,10 +387,12 @@ var app = angular.module("umbraco.preview", ['umbraco.resources', 'umbraco.servi
/*****************************************************************************/
$scope.exitPreview = function () {
+ resetPreviewSessions();
window.top.location.href = "../preview/end?redir=" + encodeURIComponent(getPageURL());
};
$scope.onFrameLoaded = function (iframe) {
+
$scope.frameLoaded = true;
configureSignalR(iframe);
diff --git a/src/Umbraco.Web.UI.Client/src/websitepreview/websitepreview.js b/src/Umbraco.Web.UI.Client/src/websitepreview/websitepreview.js
index 43fd152e61..fed177fd7b 100644
--- a/src/Umbraco.Web.UI.Client/src/websitepreview/websitepreview.js
+++ b/src/Umbraco.Web.UI.Client/src/websitepreview/websitepreview.js
@@ -5,6 +5,7 @@
(function() {
+
if ( window.location !== window.parent.location ) {
//we are in an iFrame, so lets skip the dialog.
return;
@@ -33,7 +34,37 @@
return null;
}
- function exitPreviewMode() {
+
+ function beforeUnloadHandler(e) {
+ endPreviewSession();
+ }
+ window.addEventListener("beforeunload", beforeUnloadHandler, false);
+
+ function startPreviewSession() {
+ // lets registrer this preview session.
+ var amountOfPreviewSessions = Math.max(localStorage.getItem('UmbPreviewSessionAmount') || 0, 0);
+ amountOfPreviewSessions++;
+ localStorage.setItem('UmbPreviewSessionAmount', amountOfPreviewSessions);
+ console.log("UmbPreviewSessionAmount", amountOfPreviewSessions)
+ }
+ function resetPreviewSessions() {
+ localStorage.setItem('UmbPreviewSessionAmount', 0);
+ }
+ function endPreviewSession() {
+ var amountOfPreviewSessions = localStorage.getItem('UmbPreviewSessionAmount') || 0;
+ amountOfPreviewSessions--;
+ localStorage.setItem('UmbPreviewSessionAmount', amountOfPreviewSessions);
+ console.log("ENDDDD", amountOfPreviewSessions)
+
+ if(amountOfPreviewSessions <= 0) {
+ // We are good to secretly end preview mode.
+ navigator.sendBeacon(scriptElement.getAttribute("data-umbraco-path")+"/preview/end");
+ }
+ }
+ startPreviewSession();
+
+ function endPreviewMode() {
+ resetPreviewSessions();
window.top.location.href = scriptElement.getAttribute("data-umbraco-path")+"/preview/end?redir=" + encodeURIComponent(window.location.pathname+window.location.search);
}
function continuePreviewMode(minutsToExpire) {
@@ -42,6 +73,28 @@
var user = getCookie("UMB-WEBSITE-PREVIEW-ACCEPT");
if (user != "true") {
+ askToViewPublishedVersion();
+ } else {
+ continuePreviewMode();
+ }
+
+ function askToViewPublishedVersion() {
+
+ scriptElement.getAttribute("data-umbraco-path");
+
+ const request = new XMLHttpRequest();
+ request.open("GET", scriptElement.getAttribute("data-umbraco-path") + "/LocalizedText");
+ request.send();
+
+ request.onreadystatechange = (e) => {
+ if (request.readyState == 4 && request.status == 200) {
+ const jsonLocalization = JSON.parse(request.responseText);
+ createAskUserAboutVersionDialog(jsonLocalization);
+ }
+ }
+
+ }
+ function createAskUserAboutVersionDialog(jsonLocalization) {
// This modal is also used in preview.js
var modelStyles = `
@@ -137,20 +190,20 @@
var modal = document.createElement("div");
modal.className = "umbraco-preview-dialog__modal";
- modal.innerHTML = `View published version?
- You are in Preview Mode, do you want exit in order to view the published version of your website?
`;
+ modal.innerHTML = `${jsonLocalization.preview.viewPublishedContentHeadline}
+ ${jsonLocalization.preview.viewPublishedContentDescription}
`;
con.appendChild(modal);
var continueButton = document.createElement("button");
continueButton.type = "button";
continueButton.className = "umbraco-preview-dialog__continue";
- continueButton.innerHTML = "View published version";
- continueButton.addEventListener("click", exitPreviewMode);
+ continueButton.innerHTML = jsonLocalization.preview.viewPublishedContentAcceptButton;
+ continueButton.addEventListener("click", endPreviewMode);
modal.appendChild(continueButton);
var exitButton = document.createElement("button");
exitButton.type = "button";
- exitButton.innerHTML = "Stay in preview mode";
+ exitButton.innerHTML = jsonLocalization.preview.viewPublishedContentDeclineButton;
exitButton.addEventListener("click", function() {
bodyEl.removeChild(fragment);
continuePreviewMode(5);
@@ -159,8 +212,6 @@
bodyEl.appendChild(fragment);
continueButton.focus();
- } else {
- continuePreviewMode();
}
})();
diff --git a/src/Umbraco.Web.UI/Umbraco/Views/Preview/Index.cshtml b/src/Umbraco.Web.UI/Umbraco/Views/Preview/Index.cshtml
index 912470eb65..c3365f06fc 100644
--- a/src/Umbraco.Web.UI/Umbraco/Views/Preview/Index.cshtml
+++ b/src/Umbraco.Web.UI/Umbraco/Views/Preview/Index.cshtml
@@ -4,12 +4,25 @@
@using Umbraco.Core.IO
@using Umbraco.Web
@using Umbraco.Core.Configuration
+@using Umbraco.Core.Composing
+@using Umbraco.Core.Services
@inherits System.Web.Mvc.WebViewPage
@{
var disableDevicePreview = Model.DisableDevicePreview.ToString().ToLowerInvariant();
Html.RequiresCss("assets/css/canvasdesigner.css", "Umbraco");
+
+ // See if we can get without using Current
+ var textService = Current.Services.TextService;
+
+ var EndLabel = textService.Localize("preview", "endLabel");
+ var EndTitle = textService.Localize("preview", "endTitle");
+ var OpenWebsiteLabel = textService.Localize("preview", "openWebsiteLabel");
+ var OpenWebsiteTitle = textService.Localize("preview", "openWebsiteTitle");
+ var returnToPreviewHeadline = textService.Localize("preview", "returnToPreviewHeadline");
+ var returnToPreviewDescription = textService.Localize("preview", "returnToPreviewDescription");
+ var returnToPreviewButton = textService.Localize("preview", "returnToPreviewButton");
}
@@ -22,6 +35,13 @@
@Html.RenderCssHere(
new BasicPath("Umbraco", IOHelper.ResolveUrl(SystemDirectories.Umbraco)))
+
@@ -68,7 +88,7 @@
-