Files
qds/public/js/pwa-install.js
dhanabalan 9b965d5a2b
Some checks failed
Scan for leaked secrets using Kingfisher / kingfisher-secrets-scan (push) Successful in 9s
Scan for leaked secrets using Kingfisher / kingfisher-secrets-scan (pull_request) Successful in 9s
Gemini PR Review / Gemini PR Review (pull_request) Successful in 16s
Laravel Larastan / larastan (pull_request) Failing after 2m7s
Laravel Pint / pint (pull_request) Failing after 2m15s
changed logic for safari browser pwa
2026-01-01 14:04:46 +05:30

108 lines
3.2 KiB
JavaScript

let deferredPrompt;
/* -----------------------------
ANDROID / CHROME INSTALL FLOW
------------------------------*/
window.addEventListener("beforeinstallprompt", (e) => {
e.preventDefault();
deferredPrompt = e;
// Prevent duplicate banner
if (document.getElementById("install-banner")) return;
showInstallBanner({
message: '📱 Install <b>Quality</b> App?',
buttonText: 'Install',
onClick: async () => {
deferredPrompt.prompt();
const { outcome } = await deferredPrompt.userChoice;
console.log("User install choice:", outcome);
deferredPrompt = null;
}
});
});
/* -----------------------------
IOS SAFARI MANUAL INSTALL
------------------------------*/
function isIosSafari() {
return (
/iP(ad|hone|od)/.test(navigator.userAgent) &&
/Safari/.test(navigator.userAgent) &&
!/CriOS|FxiOS|OPiOS/.test(navigator.userAgent)
);
}
function isInStandaloneMode() {
return window.navigator.standalone === true;
}
document.addEventListener("DOMContentLoaded", () => {
if (
isIosSafari() &&
!isInStandaloneMode() &&
!localStorage.getItem("iosInstallShown")
) {
showInstallBanner({
message: '📱 Install <b>Quality</b> App<br><small>Tap Share ⬆️ → Add to Home Screen</small>',
buttonText: 'Got it',
onClick: () => {
localStorage.setItem("iosInstallShown", "1");
}
});
}
});
/* -----------------------------
COMMON INSTALL BANNER UI
------------------------------*/
function showInstallBanner({ message, buttonText, onClick }) {
if (document.getElementById("install-banner")) return;
const banner = document.createElement("div");
banner.id = "install-banner";
banner.innerHTML = `
<div style="
position: fixed;
bottom: 20px;
left: 20px;
right: 20px;
background: var(--fi-color-primary, #007bff);
color: white;
padding: 15px;
border-radius: 10px;
text-align: center;
font-family: system-ui, sans-serif;
box-shadow: 0 4px 10px rgba(0,0,0,0.3);
z-index: 99999;
">
<span style="font-size: 16px;">${message}</span><br>
<button id="installBtn" style="
margin-top: 10px;
background: white;
color: var(--fi-color-primary, #007bff);
border: none;
padding: 8px 16px;
border-radius: 6px;
font-weight: 600;
cursor: pointer;
">${buttonText}</button>
</div>
`;
document.body.appendChild(banner);
document.getElementById("installBtn").addEventListener("click", () => {
banner.remove();
onClick();
});
}
/* -----------------------------
APP INSTALLED EVENT
------------------------------*/
window.addEventListener("appinstalled", () => {
console.log("🎉 App installed successfully!");
const banner = document.getElementById("install-banner");
if (banner) banner.remove();
});