mirror of
https://github.com/Azgaar/Fantasy-Map-Generator.git
synced 2025-12-17 09:41:24 +01:00
commit
529444f58f
14 changed files with 143 additions and 24 deletions
73
modules/dynamic/installation.js
Normal file
73
modules/dynamic/installation.js
Normal file
|
|
@ -0,0 +1,73 @@
|
|||
// module to prompt PWA installation
|
||||
let installButton = null;
|
||||
let deferredPrompt = null;
|
||||
|
||||
export function init(event) {
|
||||
const dontAskforInstallation = localStorage.getItem("installationDontAsk");
|
||||
if (dontAskforInstallation) return;
|
||||
|
||||
installButton = createButton();
|
||||
deferredPrompt = event;
|
||||
|
||||
window.addEventListener("appinstalled", () => {
|
||||
tip("Application is installed", false, "success", 8000);
|
||||
cleanup();
|
||||
});
|
||||
}
|
||||
|
||||
function createButton() {
|
||||
const button = document.createElement("button");
|
||||
button.style = `
|
||||
position: fixed;
|
||||
top: 1em;
|
||||
right: 1em;
|
||||
padding: 0.6em 0.8em;
|
||||
width: auto;
|
||||
`;
|
||||
button.className = "options glow";
|
||||
button.innerHTML = "Install";
|
||||
button.onclick = openDialog;
|
||||
button.onmouseenter = () => tip("Install the Application");
|
||||
document.querySelector("body").appendChild(button);
|
||||
return button;
|
||||
}
|
||||
|
||||
function openDialog() {
|
||||
alertMessage.innerHTML = /* html */ `You can install the tool so that it will look and feel like desktop application:
|
||||
have its own icon on your home screen and work offline with some limitations
|
||||
`;
|
||||
$("#alert").dialog({
|
||||
resizable: false,
|
||||
title: "Install the Application",
|
||||
width: "38em",
|
||||
buttons: {
|
||||
Install: function () {
|
||||
$(this).dialog("close");
|
||||
deferredPrompt.prompt();
|
||||
},
|
||||
Cancel: function () {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
},
|
||||
open: function () {
|
||||
const checkbox =
|
||||
'<span><input id="dontAsk" class="checkbox" type="checkbox"><label for="dontAsk" class="checkbox-label dontAsk"><i>do not ask again</i></label><span>';
|
||||
const pane = this.parentElement.querySelector(".ui-dialog-buttonpane");
|
||||
pane.insertAdjacentHTML("afterbegin", checkbox);
|
||||
},
|
||||
close: function () {
|
||||
const box = this.parentElement.querySelector(".checkbox");
|
||||
if (box?.checked) {
|
||||
localStorage.setItem("installationDontAsk", true);
|
||||
cleanup();
|
||||
}
|
||||
$(this).dialog("destroy");
|
||||
}
|
||||
});
|
||||
|
||||
function cleanup() {
|
||||
installButton.remove();
|
||||
installButton = null;
|
||||
deferredPrompt = null;
|
||||
}
|
||||
}
|
||||
|
|
@ -2,10 +2,7 @@
|
|||
// module to control the Tools options (click to edit, to re-geenerate, tp add)
|
||||
|
||||
toolsContent.addEventListener("click", function (event) {
|
||||
if (customization) {
|
||||
tip("Please exit the customization mode first", false, "warning");
|
||||
return;
|
||||
}
|
||||
if (customization) return tip("Please exit the customization mode first", false, "warning");
|
||||
if (!["BUTTON", "I"].includes(event.target.tagName)) return;
|
||||
const button = event.target.id;
|
||||
|
||||
|
|
@ -30,10 +27,8 @@ toolsContent.addEventListener("click", function (event) {
|
|||
|
||||
// click on Regenerate buttons
|
||||
if (event.target.parentNode.id === "regenerateFeature") {
|
||||
if (sessionStorage.getItem("regenerateFeatureDontAsk")) {
|
||||
processFeatureRegeneration(event, button);
|
||||
return;
|
||||
}
|
||||
const dontAsk = sessionStorage.getItem("regenerateFeatureDontAsk");
|
||||
if (dontAsk) return processFeatureRegeneration(event, button);
|
||||
|
||||
alertMessage.innerHTML = /* html */ `Regeneration will remove all the custom changes for the element.<br /><br />Are you sure you want to proceed?`;
|
||||
$("#alert").dialog({
|
||||
|
|
@ -49,15 +44,14 @@ toolsContent.addEventListener("click", function (event) {
|
|||
}
|
||||
},
|
||||
open: function () {
|
||||
const pane = $(this).dialog("widget").find(".ui-dialog-buttonpane");
|
||||
$(
|
||||
'<span><input id="dontAsk" class="checkbox" type="checkbox"><label for="dontAsk" class="checkbox-label dontAsk"><i>do not ask again</i></label><span>'
|
||||
).prependTo(pane);
|
||||
const checkbox =
|
||||
'<span><input id="dontAsk" class="checkbox" type="checkbox"><label for="dontAsk" class="checkbox-label dontAsk"><i>do not ask again</i></label><span>';
|
||||
const pane = this.parentElement.querySelector(".ui-dialog-buttonpane");
|
||||
pane.insertAdjacentHTML("afterbegin", checkbox);
|
||||
},
|
||||
close: function () {
|
||||
const box = $(this).dialog("widget").find(".checkbox")[0];
|
||||
if (!box) return;
|
||||
if (box.checked) sessionStorage.setItem("regenerateFeatureDontAsk", true);
|
||||
const box = this.parentElement.querySelector(".checkbox");
|
||||
if (box?.checked) sessionStorage.setItem("regenerateFeatureDontAsk", true);
|
||||
$(this).dialog("destroy");
|
||||
}
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue