Further changes to systemAlert from KJS

Former-commit-id: 797ee22a1baee8efb787efc5da702f5db0015c8b [formerly 13e2a72a6ddf50ff00bd554e697724d019bc09b5] [formerly 8f4c2c3a42131affaa226ad7e049fd73bc29fbd3] [formerly ff8ba0c6027c3adc4f2ac53d170f2b9302cdf4b4 [formerly dccf72e42880bd9fd92d022fe668db4721b3a690 [formerly 175c2431c20f66ff378b1ee39358e1aff14327d2]]]
Former-commit-id: 8fb31307977b0d0f593af360cefdf1c0909d918a [formerly 0a990b11213b386c200bec9c38e99f08068ffb34 [formerly c9fc95479ac35d8f1e9188bb9590e6fbfc4eec66]]
Former-commit-id: 90e695990a855f86bd7b7cfd7dc70ac86f3d2d2d [formerly 86ebf8f88f4e15b11688a3bb7ddb68c015b1bf5a]
Former-commit-id: cd5ff01980ff481a49ffcabe6b1eaa88c5300df0
This commit is contained in:
Jaifroid 2022-02-04 11:30:07 +00:00
parent 09ec62a529
commit 2bff31524f
3 changed files with 41 additions and 27 deletions

View File

@ -171,8 +171,9 @@
<p id="modalText">Modal text goes here.</p>
</div>
<div class="modal-footer" id="modalFooter">
<button type="button" class="btn btn-primary" id="approveModal" data-dismiss="modal">Confirm</button>
<button type="button" class="btn btn-secondary" id="declineModal" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" id="approveConfirm" data-dismiss="modal">Confirm</button>
<button type="button" class="btn btn-secondary" id="declineConfirm" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" id="closeMessage" data-dismiss="modal">Okay</button>
</div>
</div>
</div>

View File

@ -1947,18 +1947,22 @@ define(['jquery', 'zimArchiveLoader', 'uiUtil', 'util', 'cache', 'images', 'sett
refreshAPIStatus();
} else if (value === 'serviceworker') {
if (!isServiceWorkerAvailable()) {
uiUtil.systemAlert("The ServiceWorker API is not available on your device. Falling back to JQuery mode");
setContentInjectionMode('jquery');
uiUtil.systemAlert("The ServiceWorker API is not available on your device. Falling back to JQuery mode").then(function () {
setContentInjectionMode('jquery');
});
return;
}
if (!isMessageChannelAvailable()) {
uiUtil.systemAlert("The MessageChannel API is not available on your device. Falling back to JQuery mode");
setContentInjectionMode('jquery');
uiUtil.systemAlert("The MessageChannel API is not available on your device. Falling back to JQuery mode").then(function () {
setContentInjectionMode('jquery');
});
return;
}
if (window.nw && nw.process.versions.nw === '0.14.7') {
uiUtil.systemAlert('Service Worker mode is not available in the XP version of this app, due to the age of the Chromium build. Falling back to JQuery mode...');
setContentInjectionMode('jquery');
uiUtil.systemAlert('Service Worker mode is not available in the XP version of this app, due to the age of the Chromium build. Falling back to JQuery mode...')
.then(function () {
setContentInjectionMode('jquery');
});
return;
}
if (!isServiceWorkerReady()) {
@ -2011,10 +2015,10 @@ define(['jquery', 'zimArchiveLoader', 'uiUtil', 'util', 'cache', 'images', 'sett
message += "\nPlease vote for https://bugzilla.mozilla.org/show_bug.cgi?id=1344561 so that some future Firefox versions support it";
} else if (protocol === 'file:') {
message += "\n\nYou seem to be opening kiwix-js with the file:// protocol. You should open it through a web server : either through a local one (http://localhost/...) or through a remote one (but you need SSL : https://webserver/...)";
} else {
uiUtil.systemAlert(message, 'Information');
}
setContentInjectionMode("jquery");
uiUtil.systemAlert(message, 'Information').then(function () {
setContentInjectionMode("jquery");
});
return;
});
}

View File

@ -580,27 +580,36 @@ define(rqDef, function(util) {
* Credit to @gaurav7019 for this code (slightly adapted here) - see Kiwix JS #804
*
* @param {String} message The alert message to display in the body of the modal
* @param {String} label The modal's label or title which appears in the header
* @param {Boolean} isConfirm If true, the modal will be a confirm dialog box, otherwise it will be an alert
* @param {String} declineButtonText The text to display on the decline button (optional, Default = "Cancel")
* @param {String} approveButtonText The text to display on the approve button (optional, Default = "Confirm")
* @returns {Promise<Boolean>} A promise which resolves to true if the user clicked Confirm, false if the user clicked Cancel, backdrop or the cross(x) button
* @param {String} label The modal's label or title which appears in the header (optional, Default = "Confirmation" or "Message")
* @param {Boolean} isConfirm If true, the modal will be a confirm dialog box, otherwise it will be a simple alert message
* @param {String} declineConfirmLabel The text to display on the decline confirmation button (optional, Default = "Cancel")
* @param {String} approveConfirmLabel The text to display on the approve confirmation button (optional, Default = "Confirm")
* @param {String} closeMessageLabel The text to display on the close alert message button (optional, Default = "Okay")
* @returns {Promise<Boolean>} A promise which resolves to true if the user clicked Confirm, false if the user clicked Cancel/Okay, backdrop or the cross(x) button
*/
function systemAlert(message, label, isConfirm, declineButtonText, approveButtonText) {
label = label || (isConfirm ? 'Confirm' : 'Message');
function systemAlert(message, label, isConfirm, declineConfirmLabel, approveConfirmLabel, closeMessageLabel) {
declineConfirmLabel = declineConfirmLabel || document.getElementById("declineConfirm").textContent;
approveConfirmLabel = approveConfirmLabel || document.getElementById("approveConfirm").textContent;
closeMessageLabel = closeMessageLabel || document.getElementById("closeMessage").textContent;
label = label || (isConfirm ? "Confirmation" : "Message");
return new Promise(function (resolve, reject) {
if (!message) reject("Missing parameters");
if (declineButtonText) document.getElementById("declineModal").innerHTML = declineButtonText;
if (approveButtonText) document.getElementById("approveModal").innerHTML = approveButtonText;
document.getElementById("modalLabel").innerHTML = label;
document.getElementById("modalText").innerHTML = message;
// Displays an additional Confirm button if isConfirm is true
document.getElementById("approveModal").style.visibility = isConfirm ? "visible" : "hidden";
if (!message) reject("Missing body message");
// Set the text to the modal and it's buttons
document.getElementById("approveConfirm").textContent = approveConfirmLabel;
document.getElementById("declineConfirm").textContent = declineConfirmLabel;
document.getElementById("closeMessage").textContent = closeMessageLabel;
document.getElementById("modalLabel").textContent = label;
document.getElementById("modalText").textContent = message;
// Display buttons acc to the type of alert
document.getElementById("approveConfirm").style.display = isConfirm ? "block" : "none";
document.getElementById("declineConfirm").style.display = isConfirm ? "block" : "none";
document.getElementById("closeMessage").style.display = isConfirm ? "none" : "block";
// Display the modal
$("#alertModal").modal("show");
// When hide model is called, resolve promise with true if hidden using approve button, false otherwise
$("#alertModal").on("hide.bs.modal", function () {
const closeSource = document.activeElement;
if (closeSource.id === "approveModal") {
if (closeSource.id === "approveConfirm") {
resolve(true);
} else {
resolve(false);
@ -608,7 +617,7 @@ define(rqDef, function(util) {
});
});
}
/**
* Checks if a server is accessible by attempting to load a test image from the server
*