diff --git a/src/views/screens/download.vue b/src/views/screens/download.vue index 01344ce..7ce8047 100644 --- a/src/views/screens/download.vue +++ b/src/views/screens/download.vue @@ -24,6 +24,7 @@ import { encode } from '/services/encode.js' import encodingScreen from '/views/screens/encoding' import iconDl from '/views/icons/ico-download' import illuFlower from '/views/icons/flower' +import appLogo from '/assets/img/icons/android-chrome-512x512.png' export default { name: 'download', @@ -85,6 +86,19 @@ export default { this.$store.commit('updateGif', gif) this.fillGIF() this.downloadReady = true + + if (document.hidden && ('Notification' in window) && Notification.permission === 'granted') { + const notification = new Notification('You can now download your souvenir', { + body: 'Thank you for your patience.', + icon: appLogo + }) + + notification.addEventListener('click', () => { + parent.focus() + }, { + once: true + }) + } }) } }, diff --git a/src/views/screens/encoding.vue b/src/views/screens/encoding.vue index dce39bd..6ef7b10 100644 --- a/src/views/screens/encoding.vue +++ b/src/views/screens/encoding.vue @@ -12,7 +12,7 @@
{{ labelSubtitle }}
- @@ -36,7 +36,8 @@ export default { }, data: () => ({ lastTitleUpdate: null, - labelTitle: 'Encoding…' + labelTitle: 'Encoding…', + showNotificationButton: showNotificationButton() }), computed: { percentage () { @@ -69,6 +70,11 @@ export default { break } } + }, + noticeMeSenpai () { + Notification.requestPermission().then(() => { + this.showNotificationButton = showNotificationButton() + }) } }, watch: { @@ -77,4 +83,10 @@ export default { } } } + +function showNotificationButton () { + return ('Notification' in window) && + Notification.permission !== 'granted' && + Notification.permission !== 'denied' +}