Pinafore-Web-Client-Frontend/routes/_utils/offlineNotification.js

34 lines
960 B
JavaScript
Raw Normal View History

2018-01-19 06:25:12 +01:00
import debounce from 'lodash/debounce'
import { toast } from './toast'
const OFFLINE_DELAY = 1000
const notifyOffline = debounce(() => {
2018-01-19 09:51:51 +01:00
toast.say('You seem to be offline. You can still read toots while offline.')
2018-01-19 06:25:12 +01:00
}, OFFLINE_DELAY)
2018-01-22 00:20:50 +01:00
let oldTheme
let meta = process.browser && document.querySelector('meta[name="theme-color"]')
2018-01-19 06:25:12 +01:00
const observe = online => {
if (!localStorage.store_currentInstance) {
return // only show notification for logged-in users
}
document.body.classList.toggle('offline', !online)
2018-01-22 00:20:50 +01:00
if (online) {
meta.content = oldTheme || window.__themeColors['default']
} else {
let offlineThemeColor = window.__themeColors.offline
if (meta.content !== offlineThemeColor)
oldTheme = meta.content
meta.content = offlineThemeColor
2018-01-19 06:25:12 +01:00
notifyOffline()
}
}
2018-01-19 08:37:43 +01:00
if (!navigator.onLine) {
observe(false)
}
2018-01-19 06:25:12 +01:00
window.addEventListener('offline', () => observe(false));
window.addEventListener('online', () => observe(true));