# TimeSafari.app - Crowd-Funder for Time - PWA ## Project setup We have pkgx.dev set up in package.json, so you can use `dev` to set up the dev environment. ``` npm install ``` ### Compiles and hot-reloads for development ``` npm run serve ``` ### Lints and fixes files ``` npm run lint ``` ### Compiles and minifies for production If you are deploying in a subdirectory, add it to `publicPath` in vue.config.js, eg: `publicPath: "/app/time-tracker/",` ``` npm run build ``` ... then copy the contents of the `sw_scripts` folder to the `dist` folder - except additional_scripts.js. ## Tests ### Register new user on test server On the test server, User #0 has rights to register others, so you can start playing one of two ways: - Import the keys for the test User `did:ethr:0x0000694B58C2cC69658993A90D3840C560f2F51F` by importing this seed phrase: `rigid shrug mobile smart veteran half all pond toilet brave review universe ship congress found yard skate elite apology jar uniform subway slender luggage` (Other test users are found [here](https://github.com/trentlarson/endorser-ch/blob/master/test/util.js).) - Alternatively, register someone else under User #0 automatically: * In the `src/views/AccountViewView.vue` file, uncomment the lines referring to "testServerRegisterUser". * Visit the `/account` page. ### Create multiple identifiers Under the "Your Identity" screen, click "Advanced", click "Switch Identity / No Identity", then "Add Another Identity...". ### Create keys with alternate tools [This page](openssl_signing_console.rst) is a tool to create a JWT from a locally-generated keypair. ### Web-push For your own web-push tests, change the 'vapid' URL in App.vue, and install apps on the same domain. ### Manual walk-through - Clear the browser cache for localhost for a new user. - See that it's using the test API. - On each page, verify the messaging. - On the home page, see the feed without names, and see a message prompting to generate an ID. - On the discovery page, check that they can see projects, and set a search area to see projects nearby. - As User #0 in another browser on the test API, add a give & a project. (See User #0 details above.) - With the new user on the home page, see the feed that shows User #0 in network but without the name. - As the new user on the contacts page, add User #0 as a contact. - On the home page, see the feed that shows User #0 with a name. - Generate an ID. - On the home page, check that it now prompts them to get registered. - On the account page, check that they see messages on limits. - Register the ID from User #0. - As the new user on the home page, check that they can now record a gift. - On the contacts page, check that they cannot register someone else yet. - Walk through the functions on each page. ## Scenarios - Create a new identity as prompted. Go to "Your Identity" screen and copy the ID to the clipboard. - Go back to /start and import test User `did:ethr:0x000Ee5654b9742f6Fe18ea970e32b97ee2247B51` with this this seed phrase: `seminar accuse mystery assist delay law thing deal image undo guard initial shallow wrestle list fragile borrow velvet tomorrow awake explain test offer control` (Other test users are found [here](https://github.com/trentlarson/endorser-ch/blob/master/test/util.js).) - Go to "Your Contacts" screen and add the ID you copied to the clipboard, and hit "+" to add them. - Click on the "Registration Unknown" button and register that person to be able to make claims as them. ### Clear/Reset data & restart * Data: Clear the browser cache for localhost. * Notifications: * Under browser settings, look for "notification" and remove this server. * Under about:debugging, find the service worker and Unregister. ## Other ### Reference Material * Notifications can be type of `toast` (self-dismiss), `info`, `success`, `warning`, and `danger`. They are done via [notiwind](https://www.npmjs.com/package/notiwind) and set up in App.vue. * [Customize Vue configuration](https://cli.vuejs.org/config/). ### Kudos Gifts make the world go 'round! * [Máximo Fernández](https://medium.com/@maxfarenas) for the 3D [code](https://github.com/maxfer03/vue-three-ns) and [explanatory post](https://medium.com/nicasource/building-an-interactive-web-portfolio-with-vue-three-js-part-three-implementing-three-js-452cb375ef80) * [Many tools & libraries]() such as Nodejs.org, IntelliJ Idea, Veramo.io, Vuejs.org, threejs.org * [Bush 3D model](https://sketchfab.com/3d-models/lupine-plant-bf30f1110c174d4baedda0ed63778439) * [Forest floor image](https://www.goodfreephotos.com/albums/textures/leafy-autumn-forest-floor.jpg)