kiwix/kiwix-js-pwa
1
0
Fork 0
mirror of https://github.com/kiwix/kiwix-js-pwa.git synced 2025-09-13 14:28:38 -04:00
Code Issues Packages Projects Releases Wiki Activity

Further changes to systemAlert from KJS

Browse Source 
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
www/index.html
View File

@ -171,8 +171,9 @@
<p id="modalText">Modal text goes here.</p> <p id="modalText">Modal text goes here.</p>
</div> </div>
<div class="modal-footer" id="modalFooter"> <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-primary" id="approveConfirm" 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-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> </div>
</div> </div>

14
www/js/app.js
View File

@ -1947,18 +1947,22 @@ define(['jquery', 'zimArchiveLoader', 'uiUtil', 'util', 'cache', 'images', 'sett
refreshAPIStatus(); refreshAPIStatus();
} else if (value === 'serviceworker') { } else if (value === 'serviceworker') {
if (!isServiceWorkerAvailable()) { if (!isServiceWorkerAvailable()) {
uiUtil.systemAlert("The ServiceWorker API is not available on your device. Falling back to JQuery mode"); uiUtil.systemAlert("The ServiceWorker API is not available on your device. Falling back to JQuery mode").then(function () {
setContentInjectionMode('jquery'); setContentInjectionMode('jquery');
});
return; return;
} }
if (!isMessageChannelAvailable()) { if (!isMessageChannelAvailable()) {
uiUtil.systemAlert("The MessageChannel API is not available on your device. Falling back to JQuery mode"); uiUtil.systemAlert("The MessageChannel API is not available on your device. Falling back to JQuery mode").then(function () {
setContentInjectionMode('jquery'); setContentInjectionMode('jquery');
});
return; return;
} }
if (window.nw && nw.process.versions.nw === '0.14.7') { 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...'); 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'); setContentInjectionMode('jquery');
});
return; return;
} }
if (!isServiceWorkerReady()) { 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"; 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:') { } 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/...)"; 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');
} }
uiUtil.systemAlert(message, 'Information').then(function () {
setContentInjectionMode("jquery"); setContentInjectionMode("jquery");
});
return; return;
}); });
} }

39
www/js/lib/uiUtil.js
View File

@ -580,27 +580,36 @@ define(rqDef, function(util) {
* Credit to @gaurav7019 for this code (slightly adapted here) - see Kiwix JS #804 * 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} 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 {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 an alert * @param {Boolean} isConfirm If true, the modal will be a confirm dialog box, otherwise it will be a simple alert message
* @param {String} declineButtonText The text to display on the decline button (optional, Default = "Cancel") * @param {String} declineConfirmLabel The text to display on the decline confirmation button (optional, Default = "Cancel")
* @param {String} approveButtonText The text to display on the approve button (optional, Default = "Confirm") * @param {String} approveConfirmLabel The text to display on the approve confirmation 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} 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) { function systemAlert(message, label, isConfirm, declineConfirmLabel, approveConfirmLabel, closeMessageLabel) {
label = label || (isConfirm ? 'Confirm' : 'Message'); 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) { return new Promise(function (resolve, reject) {
if (!message) reject("Missing parameters"); if (!message) reject("Missing body message");
if (declineButtonText) document.getElementById("declineModal").innerHTML = declineButtonText; // Set the text to the modal and it's buttons
if (approveButtonText) document.getElementById("approveModal").innerHTML = approveButtonText; document.getElementById("approveConfirm").textContent = approveConfirmLabel;
document.getElementById("modalLabel").innerHTML = label; document.getElementById("declineConfirm").textContent = declineConfirmLabel;
document.getElementById("modalText").innerHTML = message; document.getElementById("closeMessage").textContent = closeMessageLabel;
// Displays an additional Confirm button if isConfirm is true document.getElementById("modalLabel").textContent = label;
document.getElementById("approveModal").style.visibility = isConfirm ? "visible" : "hidden"; 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"); $("#alertModal").modal("show");
// When hide model is called, resolve promise with true if hidden using approve button, false otherwise // When hide model is called, resolve promise with true if hidden using approve button, false otherwise
$("#alertModal").on("hide.bs.modal", function () { $("#alertModal").on("hide.bs.modal", function () {
const closeSource = document.activeElement; const closeSource = document.activeElement;
if (closeSource.id === "approveModal") { if (closeSource.id === "approveConfirm") {
resolve(true); resolve(true);
} else { } else {
resolve(false); resolve(false);