Apple PWA fixes

This commit is contained in:
Joey Kimsey
2025-02-07 16:14:00 -05:00
parent 4dd66c6f56
commit c40b29e812
8 changed files with 53 additions and 9 deletions

View File

@ -8,25 +8,48 @@
* @link https://TheTempusProject.com
* @license https://opensource.org/licenses/MIT [MIT LICENSE]
*/
/**
* Progressive Web-App
**/
let deferredPrompt;
const installPrompt = document.getElementById("install-prompt");
const chromeMessage = document.getElementById("chrome-install-message");
const iosMessage = document.getElementById("ios-install-message");
const installButton = document.getElementById("install-button");
const dismissButton = document.querySelector("#install-prompt .btn-close");
// Check if the user previously dismissed the prompt
if (!localStorage.getItem("pwaInstallDismissed")) {
if ( ! localStorage.getItem("pwaInstallDismissed") ) {
window.addEventListener("beforeinstallprompt", (event) => {
event.preventDefault();
deferredPrompt = event;
installPrompt.classList.remove("d-none");
installPrompt.classList.add("d-block"); // Show the prompt
installPrompt.classList.add("d-block"); // Show the alert
chromeMessage.classList.remove("d-none");
chromeMessage.classList.add("d-block"); // Show the prompt
});
if ( isIos() && ! isInStandaloneMode() ) {
installPrompt.classList.remove("d-none");
installPrompt.classList.add("d-block"); // Show the alert
iosMessage.classList.remove("d-none");
iosMessage.classList.add("d-block"); // Show the prompt
}
}
// ios REQUIRES a service worker
if ( 'serviceWorker' in navigator ) {
navigator.serviceWorker.register('app/js/sw.js')
.then(() => console.log('Service Worker Registered'));
}
// self.addEventListener('install', () => self.skipWaiting());
// self.addEventListener('activate', () => self.clients.claim());
// self.addEventListener('fetch', () => {}); // No file interception
// Handle Install Button Click
if ( installButton ) {
installButton.addEventListener("click", async () => {
if (deferredPrompt) {
if ( deferredPrompt ) {
deferredPrompt.prompt();
const { outcome } = await deferredPrompt.userChoice;
@ -65,6 +88,14 @@ if (localStorage.getItem("pwaInstallDismissed")) {
}
}
function isIos() {
return /iphone|ipad|ipod/i.test(navigator.userAgent);
}
function isInStandaloneMode() {
return window.matchMedia('(display-mode: standalone)').matches || window.navigator.standalone;
}
/**
* Automatically selects/de-selects all check boxes associated with that field
**/

1
app/js/sw.js Normal file
View File

@ -0,0 +1 @@
self.addEventListener('fetch', () => {});

View File

@ -59,7 +59,7 @@ class Sessions extends DatabaseModel {
public function checkSession( $sessionID ) {
$user = new User;
// @todo lets put this on some sort of realistic checking regime other than check everything every time
if ( $sessionID == false ) {
if ( empty( $sessionID ) ) {
Debug::log( 'sessionID false' );
return false;
}

View File

@ -28,7 +28,12 @@
{AUTHOR}
{ROBOT}
<link rel="icon" href="{ROOT_URL}images/favicon.ico" sizes="32x32">
<!-- Apple PWA -->
<link rel="apple-touch-icon" href="{ROOT_URL}images/apple-touch-icon.png"><!-- 180×180 -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="{SITENAME}">
<!-- PWA -->
<link rel="manifest" href="{ROOT_URL}manifest.webmanifest">
<!-- Required CSS -->
<!-- <link rel="stylesheet" href="{FONT_AWESOME_URL}fontawesome.min.css" crossorigin="anonymous"> -->

View File

@ -56,8 +56,8 @@
<div id="collapse3" class="accordion-collapse collapse" aria-labelledby="generalHeading3" data-bs-parent="#generalAccordion">
<div class="accordion-body context-main context-other-bg" id="general3">
<span class="text-lead text-primary">
{SITENAME} is open source and available free of charge through <a href="{ROOT_URL}libraries/ttp/git" class="text-decoration-none">GitLab</a> and <a href="{ROOT_URL}libraries/ttp/packagist" class="text-decoration-none">Packagist</a>.
The developer behind the project is <a href="https://joeykimsey.com/" class="text-decoration-none">Joey Kimsey</a> and he can be contacted through his website for development services.
{SITENAME} is open source and available free of charge through <a href="{ROOT_URL}libraries/ttp/git" class="text-decoration-none context-main">GitLab</a> and <a href="{ROOT_URL}libraries/ttp/packagist" class="text-decoration-none context-main">Packagist</a>.
The developer behind the project is <a href="https://joeykimsey.com/" class="text-decoration-none context-main">Joey Kimsey</a> and he can be contacted through his website for development services.
</span>
</div>
</div>

View File

@ -1,11 +1,18 @@
<div class="container pt-4 d-none" id="install-prompt">
<div class="row">
<div class="alert alert-success alert-dismissible w-100" role="alert">
<div class="alert alert-success alert-dismissible w-100 d-none" role="alert" id="chrome-install-message">
<div class="d-flex justify-content-between align-items-center">
{SITENAME} is now available as a Progressive Web App, click the button to install now.
<button class="btn btn-md btn-outline-primary mx-2" id="install-button">Install App</button>
{SITENAME} is now available as a Progressive Web App, click the button to install now.
<button class="btn btn-md btn-outline-primary mx-2" id="install-button">Install App</button>
</div>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
<div class="alert alert-success alert-dismissible w-100 d-none" role="alert" id="ios-install-message">
<div class="d-flex justify-content-between align-items-center">
{SITENAME} is now available as a Progressive-Web-App, tap the share icon and then "Add to Home Screen".
</div>
<img src="/images/share-icon.png" class="iimg-fluid">
</div>
</div>
</div>