|
1
|
// PWA utilities and service worker registration |
|
2
|
|
|
3
|
export const registerServiceWorker = () => { |
|
4
|
if ('serviceWorker' in navigator) { |
|
5
|
window.addEventListener('load', () => { |
|
6
|
navigator.serviceWorker.register('/sw.js') |
|
7
|
.then((registration) => { |
|
8
|
console.log('SW registered: ', registration); |
|
9
|
}) |
|
10
|
.catch((registrationError) => { |
|
11
|
console.log('SW registration failed: ', registrationError); |
|
12
|
}); |
|
13
|
}); |
|
14
|
} |
|
15
|
}; |
|
16
|
|
|
17
|
export const isStandalone = () => { |
|
18
|
return window.matchMedia('(display-mode: standalone)').matches || |
|
19
|
(window.navigator as any).standalone === true; |
|
20
|
}; |
|
21
|
|
|
22
|
export const canInstallPWA = () => { |
|
23
|
return 'serviceWorker' in navigator && 'PushManager' in window; |
|
24
|
}; |
|
25
|
|
|
26
|
// Install prompt handling |
|
27
|
let deferredPrompt: any; |
|
28
|
|
|
29
|
export const setupInstallPrompt = () => { |
|
30
|
window.addEventListener('beforeinstallprompt', (e) => { |
|
31
|
// Prevent Chrome 67 and earlier from automatically showing the prompt |
|
32
|
e.preventDefault(); |
|
33
|
// Stash the event so it can be triggered later |
|
34
|
deferredPrompt = e; |
|
35
|
|
|
36
|
// Show install button or banner |
|
37
|
showInstallPromotion(); |
|
38
|
}); |
|
39
|
|
|
40
|
window.addEventListener('appinstalled', () => { |
|
41
|
// Hide the install promotion |
|
42
|
hideInstallPromotion(); |
|
43
|
console.log('PWA was installed'); |
|
44
|
}); |
|
45
|
}; |
|
46
|
|
|
47
|
export const showInstallPromotion = () => { |
|
48
|
// Show install banner or button |
|
49
|
const installBanner = document.getElementById('install-banner'); |
|
50
|
if (installBanner) { |
|
51
|
installBanner.style.display = 'block'; |
|
52
|
} |
|
53
|
}; |
|
54
|
|
|
55
|
export const hideInstallPromotion = () => { |
|
56
|
// Hide install banner or button |
|
57
|
const installBanner = document.getElementById('install-banner'); |
|
58
|
if (installBanner) { |
|
59
|
installBanner.style.display = 'none'; |
|
60
|
} |
|
61
|
}; |
|
62
|
|
|
63
|
export const installPWA = async () => { |
|
64
|
if (deferredPrompt) { |
|
65
|
// Show the install prompt |
|
66
|
deferredPrompt.prompt(); |
|
67
|
// Wait for the user to respond to the prompt |
|
68
|
const { outcome } = await deferredPrompt.userChoice; |
|
69
|
console.log(`User response to the install prompt: ${outcome}`); |
|
70
|
// Clear the deferredPrompt variable |
|
71
|
deferredPrompt = null; |
|
72
|
} |
|
73
|
}; |
|
74
|
|
|
75
|
// Check if app is running in standalone mode |
|
76
|
export const isPWAInstalled = () => { |
|
77
|
return isStandalone() || document.referrer.includes('android-app://'); |
|
78
|
}; |
|
79
|
|
|
80
|
// Offline detection |
|
81
|
export const setupOfflineDetection = () => { |
|
82
|
window.addEventListener('online', () => { |
|
83
|
console.log('App is online'); |
|
84
|
// Show online indicator |
|
85
|
}); |
|
86
|
|
|
87
|
window.addEventListener('offline', () => { |
|
88
|
console.log('App is offline'); |
|
89
|
// Show offline indicator |
|
90
|
}); |
|
91
|
}; |