diff --git a/README.md b/README.md index 0e943d17..1af02c39 100644 --- a/README.md +++ b/README.md @@ -117,6 +117,8 @@ To add an icon, add to main.ts and reference with `fa` element and `icon` attrib * Unregister service worker. (in Chrome, go to `chrome://serviceworker-internals/`; in Firefox, go to `about:serviceworkers`.) * Clear Cache Storage. (in Chrome, in dev tools under Application; in Firefox, in dev tools under Storage.) +(If you find more, add them to the HelpNotificationsView.vue file.) + diff --git a/project.task.yaml b/project.task.yaml index ba36658e..f24d0008 100644 --- a/project.task.yaml +++ b/project.task.yaml @@ -46,7 +46,7 @@ tasks: blocks: ref:https://raw.githubusercontent.com/trentlarson/lives-of-gifts/master/project.yaml#kickstarter%20for%20time - make identicons for contacts into more-memorable faces (and maybe change project identicons, too) -- 04 split out notification logic & tests from web-push-subscription logic & tests +- 02 watch for the service worker activation before showing the button to turn on notifications - 01 server - show all claim details when issued by the issuer - bug - got error adding on Firefox user #0 as contact for themselves - bug - back-and-forth on discovery & project pages led to "You need an identity to load your projects." error on product page when I had an identity diff --git a/src/App.vue b/src/App.vue index 85489c8d..058b1bd3 100644 --- a/src/App.vue +++ b/src/App.vue @@ -329,10 +329,7 @@ export default class App extends Vue { } } catch (error) { if (window.location.host.startsWith("localhost")) { - console.log( - "Ignoring this error getting VAPID for local development:", - error, - ); + console.log("Ignoring the error getting VAPID for local development."); } else { console.error("Got an error initializing notifications:", error); this.$notify( @@ -424,7 +421,7 @@ export default class App extends Vue { }); } - async turnOnNotifications() { + public async turnOnNotifications() { return this.askPermission() .then((permission) => { console.log("Permission granted:", permission); diff --git a/src/assets/help/apple-icon.png b/src/assets/help/apple-icon.png new file mode 100644 index 00000000..efe37271 Binary files /dev/null and b/src/assets/help/apple-icon.png differ diff --git a/src/assets/help/chrome-install-pwa.png b/src/assets/help/chrome-install-pwa.png new file mode 100644 index 00000000..21306160 Binary files /dev/null and b/src/assets/help/chrome-install-pwa.png differ diff --git a/src/assets/help/mac-installed-app-settings.png b/src/assets/help/mac-installed-app-settings.png new file mode 100644 index 00000000..c3afd4d9 Binary files /dev/null and b/src/assets/help/mac-installed-app-settings.png differ diff --git a/src/assets/help/windows-system-enable-notifications.png b/src/assets/help/windows-system-enable-notifications.png new file mode 100644 index 00000000..c92fcd29 Binary files /dev/null and b/src/assets/help/windows-system-enable-notifications.png differ diff --git a/src/db/index.ts b/src/db/index.ts index c15f6c92..290a0012 100644 --- a/src/db/index.ts +++ b/src/db/index.ts @@ -2,7 +2,7 @@ import BaseDexie, { Table } from "dexie"; import { encrypted, Encryption } from "@pvermeer/dexie-encrypted-addon"; import { Account, AccountsSchema } from "./tables/accounts"; import { Contact, ContactSchema } from "./tables/contacts"; -import { Log, LogSchema } from "@/db/tables/logs"; +import { Log, LogSchema } from "./tables/logs"; import { MASTER_SETTINGS_KEY, Settings, diff --git a/src/main.ts b/src/main.ts index 581fa266..e2133e41 100644 --- a/src/main.ts +++ b/src/main.ts @@ -13,6 +13,7 @@ import { library } from "@fortawesome/fontawesome-svg-core"; import { faArrowLeft, faArrowRight, + faArrowUpRightFromSquare, faBan, faBitcoinSign, faBurst, @@ -65,6 +66,7 @@ import { library.add( faArrowLeft, faArrowRight, + faArrowUpRightFromSquare, faBan, faBitcoinSign, faBurst, diff --git a/src/views/AccountViewView.vue b/src/views/AccountViewView.vue index 1a19d059..b2dd89bc 100644 --- a/src/views/AccountViewView.vue +++ b/src/views/AccountViewView.vue @@ -663,8 +663,8 @@ export default class AccountViewView extends Vue { { group: "modal", type: "notification-permission", - title: "", // unused, only here to satisfy types - text: "", // unused, only here to satisfy types + title: "", // unused, only here to satisfy type check + text: "", // unused, only here to satisfy type check }, -1, ); @@ -673,8 +673,8 @@ export default class AccountViewView extends Vue { { group: "modal", type: "notification-off", - title: "", // unused, only here to satisfy types - text: "", // unused, only here to satisfy types + title: "", // unused, only here to satisfy type check + text: "", // unused, only here to satisfy type check }, -1, ); diff --git a/src/views/HelpNotificationsView.vue b/src/views/HelpNotificationsView.vue index 77b284b4..93a24a09 100644 --- a/src/views/HelpNotificationsView.vue +++ b/src/views/HelpNotificationsView.vue @@ -22,21 +22,89 @@
-

Here are ways to get notifications working.

+

Here are ways to test notifications and get them working.

-

Test

-

Somehow call the service-worker self.showNotification

- +

Full Test

+
+

+ If this works then you're all set. + +

+
-

Check OS-level permissions

+

If this app is not installed...

- Walk-throughs & screenshots, maybe for all combinations of OS & - browsers. +

+ For best results, install this app on your device. In Chrome, it may + prompt you, and you can also look for the "Install" command in the + browser settings (as opposed to using it inside the broser app); on + the deskop, look for this icon in the address bar: + Chrome 'install' icon +

+
+ +

+ If "you must enable notifications"... +

+
+

+ Wait for about 10 seconds (for the service worker to activate), then + +

+
+ +

Check App Permissions

+
+

+ In Apple iOS, check "Settings" -> "Notifications", look for the Time + Safari app (or the browser you're using), and make sure notifications + are enabled. +

+

+ In Android, hold on to the app icon, then select "App Info", then + "Notifications" and make sure they're enabled. If you installed the + app with Chrome, go to Chrome "App Info", then "Storage & Cache" and + "Clear Storage"; this Chrome reset helps even if the app isn't run + inside the Chrome browser. +

+

+ On a Mac, go to "Settings" and check "Notifications". + Mac app settings +

+
+ +

Check Browser Permissions

+
+

In Apple iOS, check Settings -> Notifications.

+

In Android, check Settings -> Notifications.

+ + You can find more details about compatibility + + here + +
+ +

Check OS Permissions

+

Mobile Phone - Apple iOS

@@ -45,49 +113,89 @@

Mobile Phone - Google Android

-
See the browser section.
+
+ We recommend Chrome. It must be version 42 or higher. Check your + version under Settings -> About Chrome. +

Desktop - Mac

-
Requires Mac OS 13.
-
-
- -

Check browser-level permissions

-

Walk-throughs & screenshots for browser settings

-
-
-

Mobile Phone - Apple iOS

-
Make sure your OS (above) supports it.
- -

Mobile Phone - Android

- Chrome requires version 50. Hold icon, select "App info", and enable - notifications. + + Requires Mac OS 13; see your macOS version under Apple -> About + This Mac. +
+ +

Windows desktop

+ In Windows, check Settings -> Notifications. + Windows system settings +
+
+ You can find more details about compatibility + + here +
-

Explain full reset to start again

-

- Walk-throughs for clearing everything & subscribing anew to get a - message -

+

Reinstall

+
+

+ If all else fails, uninstall the app, ensure all the browser tabs with + it are closed, and clear out caches and storage. +

+ +

Then reinstall the app.

+
-

Auto-detection

-

Show results of auto-detection whether they're turned on

+
@@ -249,5 +357,17 @@ export default class HelpNotificationsView extends Vue { ); }); } + + showNotificationChoice() { + this.$notify( + { + group: "modal", + type: "notification-permission", + title: "", // unused, only here to satisfy type check + text: "", // unused, only here to satisfy type check + }, + -1, + ); + } } diff --git a/src/views/ProjectViewView.vue b/src/views/ProjectViewView.vue index f0736547..ca31c5ed 100644 --- a/src/views/ProjectViewView.vue +++ b/src/views/ProjectViewView.vue @@ -48,6 +48,7 @@ target="_blank" class="underline" >Map View +
diff --git a/sw_scripts/additional-scripts.js b/sw_scripts/additional-scripts.js index 79b42a72..2421d0db 100644 --- a/sw_scripts/additional-scripts.js +++ b/sw_scripts/additional-scripts.js @@ -56,8 +56,7 @@ self.addEventListener("push", function (event) { title = "Direct Message"; message = payload.message || "No details were provided."; } else { - title = - payload && payload.title ? payload.title : "Unknown Notification"; + title = payload && payload.title ? payload.title : "Note"; message = await self.getNotificationCount(); } if (message) {