Exit PreviewMode when all Preview Session are closed + translation
This commit is contained in:
Niels Lyngsø
@@ -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 = `<div class="umbraco-preview-dialog__headline">Preview content?</div>
|
||||
<div class="umbraco-preview-dialog__question">You have ended preview mode, do you want to continue previewing this content?</div>`;
|
||||
modal.innerHTML = `<div class="umbraco-preview-dialog__headline">${$window.umbLocalizedVars.returnToPreviewHeadline}</div>
|
||||
<div class="umbraco-preview-dialog__question">${$window.umbLocalizedVars.returnToPreviewDescription}</div>`;
|
||||
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);
|
||||
|
||||
|
||||
@@ -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 = `<div class="umbraco-preview-dialog__headline">View published version?</div>
|
||||
<div class="umbraco-preview-dialog__question">You are in Preview Mode, do you want exit in order to view the published version of your website?</div>`;
|
||||
modal.innerHTML = `<div class="umbraco-preview-dialog__headline">${jsonLocalization.preview.viewPublishedContentHeadline}</div>
|
||||
<div class="umbraco-preview-dialog__question">${jsonLocalization.preview.viewPublishedContentDescription}</div>`;
|
||||
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();
|
||||
}
|
||||
|
||||
})();
|
||||
|
||||
Reference in New Issue
Block a user