Compare commits
6 Commits
notify-tim
...
v-onboardi
| Author | SHA1 | Date | |
|---|---|---|---|
| cf8f0e3ab7 | |||
|
05601f1e15 | ||
|
|
2e795b71ac | ||
|
|
948eb2ef26 | ||
|
|
7d611725c4 | ||
|
|
def6cafc17 |
173
package-lock.json
generated
173
package-lock.json
generated
@@ -58,6 +58,7 @@
|
||||
"three": "^0.156.1",
|
||||
"ua-parser-js": "^1.0.37",
|
||||
"util": "^0.12.5",
|
||||
"v-onboarding": "^2.8.1",
|
||||
"vue": "^3.3.4",
|
||||
"vue-axios": "^3.5.2",
|
||||
"vue-facing-decorator": "^3.0.2",
|
||||
@@ -6643,6 +6644,15 @@
|
||||
"integrity": "sha512-C16M+IYz0rgRhWZdCmK+h58JMv8vijAA61gmz2rspCSwKwzBebpdcsiUmwrtJRdphuY30i6BSLEOP8ppbNLyLg==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@popperjs/core": {
|
||||
"version": "2.11.8",
|
||||
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
|
||||
"integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==",
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/popperjs"
|
||||
}
|
||||
},
|
||||
"node_modules/@pvermeer/dexie-encrypted-addon": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@pvermeer/dexie-encrypted-addon/-/dexie-encrypted-addon-3.0.0.tgz",
|
||||
@@ -9351,9 +9361,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@types/web-bluetooth": {
|
||||
"version": "0.0.18",
|
||||
"resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.18.tgz",
|
||||
"integrity": "sha512-v/ZHEj9xh82usl8LMR3GarzFY1IrbXJw5L4QfQhokjRV91q+SelFqxQWSep1ucXEZ22+dSTwLFkXeur25sPIbw=="
|
||||
"version": "0.0.20",
|
||||
"resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz",
|
||||
"integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow=="
|
||||
},
|
||||
"node_modules/@types/webpack-env": {
|
||||
"version": "1.18.2",
|
||||
@@ -10853,23 +10863,113 @@
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@vueuse/core": {
|
||||
"version": "10.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.5.0.tgz",
|
||||
"integrity": "sha512-z/tI2eSvxwLRjOhDm0h/SXAjNm8N5ld6/SC/JQs6o6kpJ6Ya50LnEL8g5hoYu005i28L0zqB5L5yAl8Jl26K3A==",
|
||||
"version": "10.11.1",
|
||||
"resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.1.tgz",
|
||||
"integrity": "sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==",
|
||||
"dependencies": {
|
||||
"@types/web-bluetooth": "^0.0.18",
|
||||
"@vueuse/metadata": "10.5.0",
|
||||
"@vueuse/shared": "10.5.0",
|
||||
"vue-demi": ">=0.14.6"
|
||||
"@types/web-bluetooth": "^0.0.20",
|
||||
"@vueuse/metadata": "10.11.1",
|
||||
"@vueuse/shared": "10.11.1",
|
||||
"vue-demi": ">=0.14.8"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/antfu"
|
||||
}
|
||||
},
|
||||
"node_modules/@vueuse/core/node_modules/vue-demi": {
|
||||
"version": "0.14.6",
|
||||
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.6.tgz",
|
||||
"integrity": "sha512-8QA7wrYSHKaYgUxDA5ZC24w+eHm3sYCbp0EzcDwKqN3p6HqtTCGR/GVsPyZW92unff4UlcSh++lmqDWN3ZIq4w==",
|
||||
"version": "0.14.10",
|
||||
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
|
||||
"integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
|
||||
"hasInstallScript": true,
|
||||
"bin": {
|
||||
"vue-demi-fix": "bin/vue-demi-fix.js",
|
||||
"vue-demi-switch": "bin/vue-demi-switch.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/antfu"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@vue/composition-api": "^1.0.0-rc.1",
|
||||
"vue": "^3.0.0-0 || ^2.6.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@vue/composition-api": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@vueuse/integrations": {
|
||||
"version": "10.11.1",
|
||||
"resolved": "https://registry.npmjs.org/@vueuse/integrations/-/integrations-10.11.1.tgz",
|
||||
"integrity": "sha512-Y5hCGBguN+vuVYTZmdd/IMXLOdfS60zAmDmFYc4BKBcMUPZH1n4tdyDECCPjXm0bNT3ZRUy1xzTLGaUje8Xyaw==",
|
||||
"dependencies": {
|
||||
"@vueuse/core": "10.11.1",
|
||||
"@vueuse/shared": "10.11.1",
|
||||
"vue-demi": ">=0.14.8"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/antfu"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"async-validator": "^4",
|
||||
"axios": "^1",
|
||||
"change-case": "^4",
|
||||
"drauu": "^0.3",
|
||||
"focus-trap": "^7",
|
||||
"fuse.js": "^6",
|
||||
"idb-keyval": "^6",
|
||||
"jwt-decode": "^3",
|
||||
"nprogress": "^0.2",
|
||||
"qrcode": "^1.5",
|
||||
"sortablejs": "^1",
|
||||
"universal-cookie": "^6"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"async-validator": {
|
||||
"optional": true
|
||||
},
|
||||
"axios": {
|
||||
"optional": true
|
||||
},
|
||||
"change-case": {
|
||||
"optional": true
|
||||
},
|
||||
"drauu": {
|
||||
"optional": true
|
||||
},
|
||||
"focus-trap": {
|
||||
"optional": true
|
||||
},
|
||||
"fuse.js": {
|
||||
"optional": true
|
||||
},
|
||||
"idb-keyval": {
|
||||
"optional": true
|
||||
},
|
||||
"jwt-decode": {
|
||||
"optional": true
|
||||
},
|
||||
"nprogress": {
|
||||
"optional": true
|
||||
},
|
||||
"qrcode": {
|
||||
"optional": true
|
||||
},
|
||||
"sortablejs": {
|
||||
"optional": true
|
||||
},
|
||||
"universal-cookie": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@vueuse/integrations/node_modules/vue-demi": {
|
||||
"version": "0.14.10",
|
||||
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
|
||||
"integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
|
||||
"hasInstallScript": true,
|
||||
"bin": {
|
||||
"vue-demi-fix": "bin/vue-demi-fix.js",
|
||||
@@ -10892,28 +10992,28 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@vueuse/metadata": {
|
||||
"version": "10.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.5.0.tgz",
|
||||
"integrity": "sha512-fEbElR+MaIYyCkeM0SzWkdoMtOpIwO72x8WsZHRE7IggiOlILttqttM69AS13nrDxosnDBYdyy3C5mR1LCxHsw==",
|
||||
"version": "10.11.1",
|
||||
"resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.1.tgz",
|
||||
"integrity": "sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==",
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/antfu"
|
||||
}
|
||||
},
|
||||
"node_modules/@vueuse/shared": {
|
||||
"version": "10.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.5.0.tgz",
|
||||
"integrity": "sha512-18iyxbbHYLst9MqU1X1QNdMHIjks6wC7XTVf0KNOv5es/Ms6gjVFCAAWTVP2JStuGqydg3DT+ExpFORUEi9yhg==",
|
||||
"version": "10.11.1",
|
||||
"resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.1.tgz",
|
||||
"integrity": "sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==",
|
||||
"dependencies": {
|
||||
"vue-demi": ">=0.14.6"
|
||||
"vue-demi": ">=0.14.8"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/antfu"
|
||||
}
|
||||
},
|
||||
"node_modules/@vueuse/shared/node_modules/vue-demi": {
|
||||
"version": "0.14.6",
|
||||
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.6.tgz",
|
||||
"integrity": "sha512-8QA7wrYSHKaYgUxDA5ZC24w+eHm3sYCbp0EzcDwKqN3p6HqtTCGR/GVsPyZW92unff4UlcSh++lmqDWN3ZIq4w==",
|
||||
"version": "0.14.10",
|
||||
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
|
||||
"integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
|
||||
"hasInstallScript": true,
|
||||
"bin": {
|
||||
"vue-demi-fix": "bin/vue-demi-fix.js",
|
||||
@@ -16239,6 +16339,14 @@
|
||||
"node": ">=0.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/focus-trap": {
|
||||
"version": "7.6.0",
|
||||
"resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-7.6.0.tgz",
|
||||
"integrity": "sha512-1td0l3pMkWJLFipobUcGaf+5DTY4PLDDrcqoSaKP8ediO/CoWCCYk/fT/Y2A4e6TNB+Sh6clRJCjOPPnKoNHnQ==",
|
||||
"dependencies": {
|
||||
"tabbable": "^6.2.0"
|
||||
}
|
||||
},
|
||||
"node_modules/follow-redirects": {
|
||||
"version": "1.15.6",
|
||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
|
||||
@@ -26130,6 +26238,11 @@
|
||||
"url": "https://opencollective.com/unts"
|
||||
}
|
||||
},
|
||||
"node_modules/tabbable": {
|
||||
"version": "6.2.0",
|
||||
"resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.2.0.tgz",
|
||||
"integrity": "sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew=="
|
||||
},
|
||||
"node_modules/tailwindcss": {
|
||||
"version": "3.3.3",
|
||||
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.3.tgz",
|
||||
@@ -27536,6 +27649,20 @@
|
||||
"uuid": "dist/bin/uuid"
|
||||
}
|
||||
},
|
||||
"node_modules/v-onboarding": {
|
||||
"version": "2.8.2",
|
||||
"resolved": "https://registry.npmjs.org/v-onboarding/-/v-onboarding-2.8.2.tgz",
|
||||
"integrity": "sha512-QiUEV/AWdLIWuhK2vp7aT5CKVBGanSgRL/rySbYM3sFtk8Gd/azWnfo5whuLi+BEJhlMvRekP/Gq7TInLQwqJA==",
|
||||
"dependencies": {
|
||||
"@popperjs/core": "^2.11.5",
|
||||
"@vueuse/integrations": "^10.7.2",
|
||||
"focus-trap": "^7",
|
||||
"vue": "^3.2.21"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vue": "^3.2.21"
|
||||
}
|
||||
},
|
||||
"node_modules/valid-url": {
|
||||
"version": "1.0.9",
|
||||
"resolved": "https://registry.npmjs.org/valid-url/-/valid-url-1.0.9.tgz",
|
||||
|
||||
@@ -58,6 +58,7 @@
|
||||
"three": "^0.156.1",
|
||||
"ua-parser-js": "^1.0.37",
|
||||
"util": "^0.12.5",
|
||||
"v-onboarding": "^2.8.1",
|
||||
"vue": "^3.3.4",
|
||||
"vue-axios": "^3.5.2",
|
||||
"vue-facing-decorator": "^3.0.2",
|
||||
|
||||
@@ -1,24 +1,20 @@
|
||||
|
||||
tasks :
|
||||
|
||||
- finish push server:
|
||||
- get utcHour parameter working
|
||||
- add back the explicit wait for browser subscription timing problems
|
||||
- 01 change scanning flow - allow them to stay on the QR/scanning screen after scanning someone
|
||||
|
||||
- 24 contextual tutorials https://docs.google.com/document/d/11C_K3RM0rgo0onih20KFhcIzukZyq_CRWqaWX5om_kM/edit#heading=h.iwiwcydou5hw
|
||||
|
||||
- 24 Move to Vite assignee:jason
|
||||
- 24 Move to Vite
|
||||
|
||||
- .1 add shortcut from project (etc?) to the public project page in a browser
|
||||
- .1 add KindSpring link to ideas
|
||||
- .1 on feed, don't show "to someone anonymous" if it's to a project
|
||||
- .1 on ideas, put an "x" to close it assignee-group:ui
|
||||
- 16 save data backups in Google
|
||||
- 16 generate and use passkeys for identities
|
||||
- .5 show "give" buttons (eg. from anonymous) even if they can't give, greyed out, and give them a warning and instructions
|
||||
- .2 when adding a claim on home screen, push that claim to the top of the list
|
||||
|
||||
- .2 fix give dialog from "more contacts" off home page to allow giving to this user
|
||||
- .2 fix bottom of project selection map, where the icons are hidden but a tap goes to the icon's page assignee-group:ui
|
||||
- .5 stop from seeing an error on the first page when browser doesn't support service workers (which I've seen on iPhone; visible in Firefox private window)
|
||||
- .2 don't show a warning on a totally new project when the authorized agent is set
|
||||
- .2 anchor hash into BTC
|
||||
@@ -28,9 +24,8 @@ tasks :
|
||||
|
||||
- 08 add image on profile
|
||||
|
||||
- 01 ask to detect location & record it in settings
|
||||
- 01 if personal location is set, show potential local affiliations
|
||||
- 02 refactor the buttons for chosing a search location so that the actions are clear assignee-group:ui
|
||||
- ask to detect location & record it in settings
|
||||
- if personal location is set, show potential local affiliations
|
||||
|
||||
- 24 compelling UI for credential presentations
|
||||
- discover who in my network has activity on a project
|
||||
@@ -99,7 +94,7 @@ tasks :
|
||||
- .3 check that Android shows "back" buttons on screens without bottom tray
|
||||
- .1 Make give description text box into something that expands as they type?
|
||||
- .2 Show a warning if both giver and recipient are the same (but still allow?)
|
||||
- .5 Shrink the buttons on project pages so they don't expand to the width of the screen assignee-group:ui
|
||||
- 01 Would it look better to shrink the buttons on many pages so they don't expand to the width of the screen? assignee-group:ui
|
||||
- .5 Display a more appealing confirmation on the map when erasing the marker
|
||||
- .5 remove references to localStorage for projectId (now that it's pulling from the path)
|
||||
- switch some checks for activeDid to check for isRegistered
|
||||
@@ -147,6 +142,7 @@ tasks :
|
||||
- for subtasks: fulfills (is it really the same?), feeds, contributes to, supplies, boosts, advances
|
||||
- for blocking: blocks, precedes, comes before, is sought by -- vs follows, seeks, builds on ("contributes to" isn't specific enough, "succeeds" has different, possibly confusing meaning)
|
||||
|
||||
- .5 fit as many icons as possible on home & project view screens but only going halfway down the page assignee-group:ui
|
||||
- .5 Replace Gifted/Give in ContactsView with GiftedDialog
|
||||
|
||||
- Stats :
|
||||
|
||||
121
src/App.vue
121
src/App.vue
@@ -191,7 +191,7 @@
|
||||
>
|
||||
<div class="w-full px-6 py-6 text-slate-900 text-center">
|
||||
<p v-if="serviceWorkerReady" class="text-lg mb-4">
|
||||
Would you like to be notified of new activity once a day?
|
||||
Would you like to <b>turn on</b> notifications for this app?
|
||||
</p>
|
||||
<p v-else class="text-lg mb-4">
|
||||
Waiting for system initialization, which may take up to 10
|
||||
@@ -199,42 +199,22 @@
|
||||
<fa icon="spinner" spin />
|
||||
</p>
|
||||
|
||||
<div v-if="serviceWorkerReady">
|
||||
<span class="flex flex-row justify-center">
|
||||
<span class="mt-2">Yes, tell me at: </span>
|
||||
<input
|
||||
type="number"
|
||||
class="rounded-l border border-r-0 border-slate-400 ml-2 mt-2 px-2 py-2 text-center w-20"
|
||||
v-model="hourInput"
|
||||
/>
|
||||
<span
|
||||
class="rounded-r border border-slate-400 bg-slate-200 text-center text-blue-500 mt-2 px-2 py-2 w-20"
|
||||
@click="hourAm = !hourAm"
|
||||
>
|
||||
<span v-if="hourAm"> AM <fa icon="chevron-down" /> </span>
|
||||
<span v-else> PM <fa icon="chevron-up" /> </span>
|
||||
</span>
|
||||
</span>
|
||||
<button
|
||||
class="block w-full text-center text-md font-bold uppercase bg-blue-600 text-white mt-2 px-2 py-2 rounded-md"
|
||||
@click="
|
||||
() => {
|
||||
if (checkHour()) {
|
||||
close(notification.id);
|
||||
turnOnNotifications();
|
||||
}
|
||||
}
|
||||
"
|
||||
>
|
||||
Turn on Daily Message
|
||||
</button>
|
||||
</div>
|
||||
<button
|
||||
v-if="serviceWorkerReady"
|
||||
class="block w-full text-center text-md font-bold uppercase bg-blue-600 text-white px-2 py-2 rounded-md mb-2"
|
||||
@click="
|
||||
close(notification.id);
|
||||
turnOnNotifications();
|
||||
"
|
||||
>
|
||||
Turn on Notifications
|
||||
</button>
|
||||
|
||||
<button
|
||||
@click="close(notification.id)"
|
||||
class="block w-full text-center text-md font-bold uppercase bg-slate-600 text-white mt-4 px-2 py-2 rounded-md"
|
||||
class="block w-full text-center text-md font-bold uppercase bg-slate-600 text-white px-2 py-2 rounded-md"
|
||||
>
|
||||
No, Not Now
|
||||
Maybe Later
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -317,11 +297,8 @@
|
||||
<style></style>
|
||||
|
||||
<script lang="ts">
|
||||
import axios from "axios";
|
||||
import { Vue, Component } from "vue-facing-decorator";
|
||||
|
||||
import * as libsUtil from "@/libs/util";
|
||||
|
||||
import axios from "axios";
|
||||
interface ServiceWorkerMessage {
|
||||
type: string;
|
||||
data: string;
|
||||
@@ -345,10 +322,6 @@ interface VapidResponse {
|
||||
};
|
||||
}
|
||||
|
||||
interface PushSubscriptionWithTime extends PushSubscriptionJSON {
|
||||
notifyTime: { utcHour: number };
|
||||
}
|
||||
|
||||
import { DEFAULT_PUSH_SERVER, NotificationIface } from "@/constants/app";
|
||||
import { db } from "@/db/index";
|
||||
import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
|
||||
@@ -359,9 +332,7 @@ export default class App extends Vue {
|
||||
$notify!: (notification: NotificationIface, timeout?: number) => void;
|
||||
|
||||
b64 = "";
|
||||
hourAm = true;
|
||||
hourInput = "8";
|
||||
serviceWorkerReady = true;
|
||||
serviceWorkerReady = false;
|
||||
|
||||
async mounted() {
|
||||
try {
|
||||
@@ -490,48 +461,6 @@ export default class App extends Vue {
|
||||
});
|
||||
}
|
||||
|
||||
// this allows us to show an error without closing the dialog
|
||||
checkHour() {
|
||||
if (!libsUtil.isNumeric(this.hourInput)) {
|
||||
this.$notify(
|
||||
{
|
||||
group: "alert",
|
||||
type: "danger",
|
||||
title: "Not a Number",
|
||||
text: "The time must be an hour number.",
|
||||
},
|
||||
5000,
|
||||
);
|
||||
return false;
|
||||
}
|
||||
const hourNum = libsUtil.numberOrZero(this.hourInput);
|
||||
if (!Number.isInteger(hourNum)) {
|
||||
this.$notify(
|
||||
{
|
||||
group: "alert",
|
||||
type: "danger",
|
||||
title: "Not a Whole Number",
|
||||
text: "The time must be a whole hour number.",
|
||||
},
|
||||
5000,
|
||||
);
|
||||
return false;
|
||||
}
|
||||
if (hourNum < 1 || 12 < hourNum) {
|
||||
this.$notify(
|
||||
{
|
||||
group: "alert",
|
||||
type: "danger",
|
||||
title: "Not a Whole Number",
|
||||
text: "The time must be an hour between 1 and 12.",
|
||||
},
|
||||
5000,
|
||||
);
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
public async turnOnNotifications() {
|
||||
return this.askPermission()
|
||||
.then((permission) => {
|
||||
@@ -557,25 +486,13 @@ export default class App extends Vue {
|
||||
},
|
||||
-1,
|
||||
);
|
||||
// we already checked that this is a valid hour number
|
||||
const rawHourNum = libsUtil.numberOrZero(this.hourInput);
|
||||
const adjHourNum = rawHourNum + (this.hourAm ? 0 : 12);
|
||||
const hourNum = adjHourNum % 24;
|
||||
const utcHour =
|
||||
hourNum + Math.round(new Date().getTimezoneOffset() / 60);
|
||||
const finalUtcHour = (utcHour + (utcHour < 0 ? 24 : 0)) % 24;
|
||||
|
||||
const subscriptionWithTime: PushSubscriptionWithTime = {
|
||||
notifyTime: { utcHour: finalUtcHour },
|
||||
...subscription.toJSON(),
|
||||
};
|
||||
await this.sendSubscriptionToServer(subscriptionWithTime);
|
||||
return subscriptionWithTime;
|
||||
this.sendSubscriptionToServer(subscription);
|
||||
return subscription;
|
||||
} else {
|
||||
throw new Error("Subscription object is not available.");
|
||||
}
|
||||
})
|
||||
.then(async (subscription: PushSubscriptionWithTime) => {
|
||||
.then(async (subscription) => {
|
||||
console.log(
|
||||
"Subscription data sent to server and all finished successfully.",
|
||||
);
|
||||
@@ -666,7 +583,7 @@ export default class App extends Vue {
|
||||
}
|
||||
|
||||
private sendSubscriptionToServer(
|
||||
subscription: PushSubscriptionWithTime,
|
||||
subscription: PushSubscription,
|
||||
): Promise<void> {
|
||||
console.log("About to send subscription...", subscription);
|
||||
return fetch("/web-push/subscribe", {
|
||||
|
||||
164
src/components/OnboardingDialog.vue
Normal file
164
src/components/OnboardingDialog.vue
Normal file
@@ -0,0 +1,164 @@
|
||||
<template>
|
||||
<div>
|
||||
<VOnboardingWrapper ref="wrapper" :steps="steps">
|
||||
<template
|
||||
#default="{ previous, next, step, exit, isFirst, isLast, index }"
|
||||
>
|
||||
<VOnboardingStep>
|
||||
<div class="bg-white shadow sm:rounded-lg">
|
||||
<div class="px-4 py-5 sm:p-6">
|
||||
<div class="sm:flex sm:items-center sm:justify-between">
|
||||
<div v-if="step.content">
|
||||
<h3 v-if="step.content.title" class="flex justify-between">
|
||||
<span
|
||||
class="text-lg font-medium leading-normal text-gray-900"
|
||||
>
|
||||
{{ step.content.title }}
|
||||
</span>
|
||||
<button
|
||||
@click="exit"
|
||||
class="inline-flex align-center justify-center w-6 h-6 shrink-0 rounded-full"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="h-4 w-4"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M6 18L18 6M6 6l12 12"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
</h3>
|
||||
<div
|
||||
v-if="step.content.description"
|
||||
class="mt-2 max-w-xl text-sm text-gray-500"
|
||||
>
|
||||
<p>{{ step.content.description }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mt-5 space-x-4 sm:mt-0 sm:ml-6 sm:flex sm:flex-shrink-0 sm:items-center relative"
|
||||
>
|
||||
<span
|
||||
class="absolute right-0 bottom-full mb-2 mr-2 text-gray-600 font-medium text-xs"
|
||||
>
|
||||
{{ `${index + 1}/${steps.length}` }}
|
||||
</span>
|
||||
<template v-if="!isFirst">
|
||||
<button
|
||||
@click="previous"
|
||||
type="button"
|
||||
class="inline-flex items-center justify-center rounded-md border border-transparent bg-yellow-100 px-4 py-2 font-medium text-yellow-700 hover:bg-yellow-200 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:ring-offset-2 sm:text-sm"
|
||||
>
|
||||
Previous
|
||||
</button>
|
||||
</template>
|
||||
<button
|
||||
@click="next"
|
||||
type="button"
|
||||
class="inline-flex items-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 sm:text-sm"
|
||||
>
|
||||
{{ isLast ? "Finish" : "Next" }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</VOnboardingStep>
|
||||
</template>
|
||||
</VOnboardingWrapper>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Vue, Component } from "vue-facing-decorator";
|
||||
import { ref } from "vue";
|
||||
import {
|
||||
VOnboardingWrapper,
|
||||
VOnboardingStep,
|
||||
useVOnboarding,
|
||||
} from "v-onboarding";
|
||||
|
||||
@Component({
|
||||
components: {
|
||||
VOnboardingWrapper,
|
||||
VOnboardingStep,
|
||||
},
|
||||
})
|
||||
export default class OnboardingDialog extends Vue {
|
||||
setup() {
|
||||
const wrapper = ref(null);
|
||||
const { start, goToStep, finish } = useVOnboarding(wrapper);
|
||||
const steps = [
|
||||
{
|
||||
attachTo: { element: "#headingRecordSomething" },
|
||||
content: { title: "Welcome!" },
|
||||
},
|
||||
{
|
||||
attachTo: { element: "#headingLatestActivity" },
|
||||
content: {
|
||||
title: "Testing v-onboarding..",
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.",
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
return {
|
||||
wrapper,
|
||||
steps,
|
||||
start,
|
||||
finish,
|
||||
goToStep,
|
||||
};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
[data-v-onboarding-wrapper] [data-popper-arrow]::before {
|
||||
content: "";
|
||||
background: var(--v-onboarding-step-arrow-background, white);
|
||||
top: 0;
|
||||
left: 0;
|
||||
transition:
|
||||
transform 0.2s ease-out,
|
||||
visibility 0.2s ease-out;
|
||||
visibility: visible;
|
||||
transform: translateX(0px) rotate(45deg);
|
||||
transform-origin: center;
|
||||
width: var(--v-onboarding-step-arrow-size, 10px);
|
||||
height: var(--v-onboarding-step-arrow-size, 10px);
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
[data-v-onboarding-wrapper]
|
||||
[data-popper-placement^="top"]
|
||||
> [data-popper-arrow] {
|
||||
bottom: 5px;
|
||||
}
|
||||
|
||||
[data-v-onboarding-wrapper]
|
||||
[data-popper-placement^="right"]
|
||||
> [data-popper-arrow] {
|
||||
left: -4px;
|
||||
}
|
||||
|
||||
[data-v-onboarding-wrapper]
|
||||
[data-popper-placement^="bottom"]
|
||||
> [data-popper-arrow] {
|
||||
top: -4px;
|
||||
}
|
||||
|
||||
[data-v-onboarding-wrapper]
|
||||
[data-popper-placement^="left"]
|
||||
> [data-popper-arrow] {
|
||||
right: -4px;
|
||||
}
|
||||
</style>
|
||||
@@ -12,6 +12,9 @@ import { deriveAddress, generateSeed, newIdentifier } from "@/libs/crypto";
|
||||
import { GenericServerRecord, containsHiddenDid } from "@/libs/endorserServer";
|
||||
import * as serverUtil from "@/libs/endorserServer";
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-var-requires
|
||||
const Buffer = require("buffer/").Buffer;
|
||||
|
||||
export const PRIVACY_MESSAGE =
|
||||
"The data you send be visible to the world -- except: your IDs and the IDs of anyone you tag will stay private, only visible to those you allow.";
|
||||
|
||||
@@ -53,13 +56,9 @@ export function iconForUnitCode(unitCode: string) {
|
||||
}
|
||||
|
||||
// from https://stackoverflow.com/a/175787/845494
|
||||
// ... though it appears even this isn't precisely right so keep doing "|| 0" or something in sensitive places
|
||||
//
|
||||
export function isNumeric(str: string): boolean {
|
||||
// This ignore commentary is because typescript complains when you pass a string to isNaN.
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
return !isNaN(str) && !isNaN(parseFloat(str));
|
||||
return !isNaN(+str);
|
||||
}
|
||||
|
||||
export function numberOrZero(str: string): number {
|
||||
@@ -238,7 +237,7 @@ export const generateSaveAndActivateIdentity = async (): Promise<string> => {
|
||||
};
|
||||
|
||||
export const sendTestThroughPushServer = async (
|
||||
subscriptionJSON: PushSubscriptionJSON,
|
||||
subscription: PushSubscription,
|
||||
skipFilter: boolean,
|
||||
): Promise<AxiosResponse> => {
|
||||
await db.open();
|
||||
@@ -253,11 +252,28 @@ export const sendTestThroughPushServer = async (
|
||||
// Use something other than "Daily Update" https://gitea.anomalistdesign.com/trent_larson/py-push-server/src/commit/3c0e196c11bc98060ec5934e99e7dbd591b5da4d/app.py#L213
|
||||
const DIRECT_PUSH_TITLE = "DIRECT_NOTIFICATION";
|
||||
|
||||
const auth = Buffer.from(subscription.getKey("auth"));
|
||||
const authB64 = auth
|
||||
.toString("base64")
|
||||
.replace(/\+/g, "-")
|
||||
.replace(/\//g, "_")
|
||||
.replace(/=+$/, "");
|
||||
const p256dh = Buffer.from(subscription.getKey("p256dh"));
|
||||
const p256dhB64 = p256dh
|
||||
.toString("base64")
|
||||
.replace(/\+/g, "-")
|
||||
.replace(/\//g, "_")
|
||||
.replace(/=+$/, "");
|
||||
const newPayload = {
|
||||
// eslint-disable-next-line prettier/prettier
|
||||
message: `Test, where you will see this message ${ skipFilter ? "un" : "" }filtered.`,
|
||||
endpoint: subscription.endpoint,
|
||||
keys: {
|
||||
auth: authB64,
|
||||
p256dh: p256dhB64,
|
||||
},
|
||||
message: `Test, where you will see this message ${
|
||||
skipFilter ? "un" : ""
|
||||
}filtered.`,
|
||||
title: skipFilter ? DIRECT_PUSH_TITLE : "Your Web Push",
|
||||
...subscriptionJSON,
|
||||
};
|
||||
console.log("Sending a test web push message:", newPayload);
|
||||
const payloadStr = JSON.stringify(newPayload);
|
||||
|
||||
@@ -6,6 +6,7 @@ import router from "./router";
|
||||
import axios from "axios";
|
||||
import VueAxios from "vue-axios";
|
||||
import Notifications from "notiwind";
|
||||
import { useVOnboarding } from "v-onboarding";
|
||||
|
||||
import "./assets/styles/tailwind.css";
|
||||
|
||||
@@ -20,10 +21,8 @@ import {
|
||||
faCalendar,
|
||||
faCamera,
|
||||
faCheck,
|
||||
faChevronDown,
|
||||
faChevronLeft,
|
||||
faChevronRight,
|
||||
faChevronUp,
|
||||
faCircle,
|
||||
faCircleCheck,
|
||||
faCircleInfo,
|
||||
@@ -83,10 +82,8 @@ library.add(
|
||||
faCalendar,
|
||||
faCamera,
|
||||
faCheck,
|
||||
faChevronDown,
|
||||
faChevronLeft,
|
||||
faChevronRight,
|
||||
faChevronUp,
|
||||
faCircle,
|
||||
faCircleCheck,
|
||||
faCircleInfo,
|
||||
@@ -146,4 +143,5 @@ createApp(App)
|
||||
.use(VueAxios, axios)
|
||||
.use(router)
|
||||
.use(Notifications)
|
||||
.use(useVOnboarding)
|
||||
.mount("#app");
|
||||
|
||||
@@ -301,13 +301,12 @@ import { sendTestThroughPushServer } from "@/libs/util";
|
||||
export default class HelpNotificationsView extends Vue {
|
||||
$notify!: (notification: NotificationIface, timeout?: number) => void;
|
||||
|
||||
subscriptionJSON?: PushSubscriptionJSON;
|
||||
subscription: PushSubscription | null = null;
|
||||
|
||||
async mounted() {
|
||||
try {
|
||||
const registration = await navigator.serviceWorker.ready;
|
||||
const fullSub = await registration.pushManager.getSubscription();
|
||||
this.subscriptionJSON = fullSub?.toJSON();
|
||||
this.subscription = await registration.pushManager.getSubscription();
|
||||
} catch (error) {
|
||||
console.error("Mount error:", error);
|
||||
}
|
||||
@@ -316,13 +315,13 @@ export default class HelpNotificationsView extends Vue {
|
||||
alertWebPushSubscription() {
|
||||
console.log(
|
||||
"Web push subscription:",
|
||||
JSON.parse(JSON.stringify(this.subscriptionJSON)), // gives more info than plain console logging
|
||||
JSON.parse(JSON.stringify(this.subscription)), // gives more info than plain console logging
|
||||
);
|
||||
alert(JSON.stringify(this.subscriptionJSON));
|
||||
alert(JSON.stringify(this.subscription));
|
||||
}
|
||||
|
||||
async sendTestWebPushMessage(skipFilter: boolean = false) {
|
||||
if (!this.subscriptionJSON) {
|
||||
if (!this.subscription) {
|
||||
this.$notify(
|
||||
{
|
||||
group: "alert",
|
||||
@@ -337,7 +336,7 @@ export default class HelpNotificationsView extends Vue {
|
||||
}
|
||||
|
||||
try {
|
||||
await sendTestThroughPushServer(this.subscriptionJSON, skipFilter);
|
||||
await sendTestThroughPushServer(this.subscription, skipFilter);
|
||||
|
||||
this.$notify(
|
||||
{
|
||||
|
||||
@@ -115,7 +115,9 @@
|
||||
<div v-else>
|
||||
<!-- activeDid && isRegistered -->
|
||||
<div class="mb-4">
|
||||
<h2 class="text-xl font-bold">Record Something Given By:</h2>
|
||||
<h2 id="headingRecordSomething" class="text-xl font-bold">
|
||||
Record Something Given By:
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<ul class="grid grid-cols-4 gap-x-3 gap-y-5 text-center mb-5">
|
||||
@@ -162,6 +164,12 @@
|
||||
>
|
||||
Ideas...
|
||||
</button>
|
||||
<button
|
||||
@click="startOnboardingDialog()"
|
||||
class="block text-center text-md font-bold bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md"
|
||||
>
|
||||
(v-onboarding)
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -172,10 +180,13 @@
|
||||
showGivenToUser="true"
|
||||
/>
|
||||
<GiftedPrompts ref="giftedPrompts" />
|
||||
<OnboardingDialog ref="onboardingDialog" />
|
||||
|
||||
<!-- Results List -->
|
||||
<div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4">
|
||||
<h2 class="text-xl font-bold mb-4">Latest Activity</h2>
|
||||
<h2 id="headingLatestActivity" class="text-xl font-bold mb-4">
|
||||
Latest Activity
|
||||
</h2>
|
||||
<InfiniteScroll @reached-bottom="loadMoreGives">
|
||||
<ul class="border-t border-slate-300">
|
||||
<li
|
||||
@@ -253,6 +264,7 @@ import GiftedPrompts from "@/components/GiftedPrompts.vue";
|
||||
import InfiniteScroll from "@/components/InfiniteScroll.vue";
|
||||
import QuickNav from "@/components/QuickNav.vue";
|
||||
import TopMessage from "@/components/TopMessage.vue";
|
||||
import OnboardingDialog from "@/components/OnboardingDialog.vue";
|
||||
import { NotificationIface } from "@/constants/app";
|
||||
import { db, accountsDB } from "@/db/index";
|
||||
import { Account } from "@/db/tables/accounts";
|
||||
@@ -287,6 +299,7 @@ interface GiveRecordWithContactInfo extends GiveServerRecord {
|
||||
EntityIcon,
|
||||
InfiniteScroll,
|
||||
TopMessage,
|
||||
OnboardingDialog,
|
||||
},
|
||||
})
|
||||
export default class HomeView extends Vue {
|
||||
@@ -350,6 +363,29 @@ export default class HomeView extends Vue {
|
||||
|
||||
await this.updateAllFeed();
|
||||
|
||||
// Other things attempted:
|
||||
//
|
||||
// Tried these above in the field area:
|
||||
// onboardingWrapper = ref(null);
|
||||
// onboardSteps = [
|
||||
// {
|
||||
// attachTo: { element: "#headingRecordSomething" },
|
||||
// content: { title: "Welcome!" },
|
||||
// },
|
||||
// {
|
||||
// attachTo: { element: "#headingLatestActivity" },
|
||||
// content: {
|
||||
// title: "Testing v-onboarding..",
|
||||
// description:
|
||||
// "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.",
|
||||
// },
|
||||
// },
|
||||
// ];
|
||||
//
|
||||
// Tried these inside this method:
|
||||
// const { start } = useVOnboarding(this.$refs.onboardingDialog);
|
||||
// start();
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
} catch (err: any) {
|
||||
console.error("Error retrieving settings or feed.", err);
|
||||
@@ -574,5 +610,9 @@ export default class HomeView extends Vue {
|
||||
openGiftedPrompts() {
|
||||
(this.$refs.giftedPrompts as GiftedPrompts).open();
|
||||
}
|
||||
|
||||
startOnboardingDialog() {
|
||||
/* Start the onboarding dialog here. */
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user