From 75d15ddeb90b1d1023ae5e7855acd8dee76532da Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Wed, 27 Dec 2023 14:46:10 -0700
Subject: [PATCH] add note to install as an app

---
 project.task.yaml                   | 12 +++---------
 src/views/DiscoverView.vue          |  1 -
 src/views/HelpNotificationsView.vue |  5 +++--
 src/views/HomeView.vue              | 27 +++++++++++++++++++++++++++
 4 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/project.task.yaml b/project.task.yaml
index d9ce552e..b71a3319 100644
--- a/project.task.yaml
+++ b/project.task.yaml
@@ -6,18 +6,9 @@ tasks:
   - insert tooling (exportable logs?) so that we can see problems and troubleshoot as we onboard
     - if navigator.serviceWorker is null, then tell the user to wait
     - Local install works after cleared out cache in Chrome
-  - add windows & mac help at OS & browser level, in HelpNotificationsView.vue (linked from account page)
-    maybe tell them to pause, after first turn-on and after test
-    maybe Google Play permissions
-  - prompt user to install on their home screen https://benborgers.com/posts/pwa-detect-installed
-  - warn if they're using the web (android only?)
-    https://developer.mozilla.org/en-US/docs/Web/API/Navigator/getInstalledRelatedApps
-    https://web.dev/articles/get-installed-related-apps
 
 - fix maskable icon
 
-- .2 fix the projects on /discover to show the issuer (currently all "Someone Anonymous")
-
 - .3 bug - make or edit a project, choose "Include location", and see the map display shows on top of the bottom icons assignee-group:ui
 
 - .5 If notifications are not enabled, add message to front page with link/button to enable
@@ -64,6 +55,9 @@ tasks:
 - switch some checks for activeDid to check for isRegistered
 - .2 in SeedBackupView, don't load the mnemonic and keep it in memory; only load it when they click "show"
 - .5 fix cert generation on server (since it didn't happen automatically for Nov 30)
+- warn if they're using the web (android only?)
+  https://developer.mozilla.org/en-US/docs/Web/API/Navigator/getInstalledRelatedApps
+  https://web.dev/articles/get-installed-related-apps
 
 - 04 fix lack of initial notification in Firefox (on MacOS, maybe others)
 
diff --git a/src/views/DiscoverView.vue b/src/views/DiscoverView.vue
index 3f5491db..ceaf2789 100644
--- a/src/views/DiscoverView.vue
+++ b/src/views/DiscoverView.vue
@@ -275,7 +275,6 @@ export default class DiscoverView extends Vue {
       const results = await response.json();
 
       const plans: ProjectData[] = results.data;
-      console.log("Got plans:", plans);
       if (plans) {
         for (const plan of plans) {
           const { name, description, handleId, issuerDid, rowid } = plan;
diff --git a/src/views/HelpNotificationsView.vue b/src/views/HelpNotificationsView.vue
index 967eb02c..4c53035e 100644
--- a/src/views/HelpNotificationsView.vue
+++ b/src/views/HelpNotificationsView.vue
@@ -79,8 +79,9 @@
         </p>
         <p>
           If you installed the app with Chrome, make sure there are no other
-          tabs with it open; then here are some ways to clear caches that can
-          mess things up:
+          tabs with it open. Here are some ways to clear caches that can mess
+          things up (and note that this clears out data from the installed app
+          -- which is good to do while the app is installed):
         </p>
         <ul>
           <li class="list-disc ml-4">
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index daf47c45..45177c73 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -10,6 +10,21 @@
 
     <!-- show the actions for recognizing a give -->
     <div class="mb-8">
+      <div
+        v-if="!isInstalled()"
+        class="bg-amber-200 rounded-md overflow-hidden text-center px-4 py-3 mb-4"
+      >
+        <p>
+          You should install this as an app.
+          <router-link
+            :to="{ name: 'help-notifications' }"
+            class="text-blue-500"
+          >
+            Go here for instructions.
+          </router-link>
+        </p>
+      </div>
+
       <div
         v-if="!activeDid"
         class="bg-amber-200 rounded-md overflow-hidden text-center px-4 py-3 mb-4"
@@ -249,6 +264,18 @@ export default class HomeView extends Vue {
     }
   }
 
+  // from https://benborgers.com/posts/pwa-detect-installed
+  isInstalled() {
+    // For iOS
+    if ("standalone" in window.navigator) return true;
+
+    // For Android
+    if (window.matchMedia("(display-mode: standalone)").matches) return true;
+
+    // If neither is true, it's not installed
+    return false;
+  }
+
   public async buildHeaders() {
     const headers: HeadersInit = {
       "Content-Type": "application/json",