crowd-funder-for-time-pwa/src/views/HelpView.vue

<template>
  <QuickNav />

  <!-- CONTENT -->
  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
    <!-- Breadcrumb -->
    <div class="mb-8">
      <!-- Back -->
      <div class="text-lg text-center font-light relative px-7">
        <h1
          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
          @click="$router.back()"
        >
          <fa icon="chevron-left" class="fa-fw" />
        </h1>
      </div>

      <!-- Heading -->
      <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
        Help
      </h1>
    </div>

    <!-- eslint-disable prettier/prettier -->
    <div>
      <p>
        This app is a window into data that you and your friends own, focused on
        gifts and collaboration.
      </p>

      <h2 class="text-xl font-semibold">What is the idea here?</h2>
      <p>
        We are building networks of people who want to grow a giving society.
        First of all, you can see what people have given, and also recognize
        gifts you've seen, in a way that leaves a permanent record -- one that
        came from you, and the recipient can prove it was for them. This is
        personally gratifying, but it extends to broader work: volunteers get
        confirmation of activity, and selectively show off their contributions
        and network.
      </p>
      <p>
        You highlight giving and also offer help to ideas -- which could be
        conditional on others' willingness to help, too.
        You can record your own ideas and invite others to collaborate.
      </p>
      <p>
        This app uses the power of cryptography to build a reputation, recording
        activity that you can share at your discretion. You put some activity
        public, but these services don't share your ID with others without explicit consent.
        This is in contrast to Meta and Google, who hold
        your data and allow you use it while they manage sharing...
        those services are useful but they have the control, whereas this app gives you the control.
      </p>

      <h2 class="text-xl font-semibold">How do I get started?</h2>
      <p>
        You need someone to register you, like the person who told you
        about this app, on the Contacts
        <fa icon="users" class="fa-fw" /> page. After they register you, you can
        select any contact on the home page (or "anonymous") and record your
        appreciation for... whatever. The main goal is to record what people
        have given you, to grow giving economies. Each claim is recorded on a
        custom ledger. The day after being registered, you'll be able to able to
        register others; later, you can create projects, too.
      </p>
      <p>
        Note that there are rate limits to how many others you can register,
        so it may take some time to register everyone you want. Take your time...
        make it an opportunity to get to know their projects, and show your own.
      </p>

      <h2 class="text-xl font-semibold">
        I had an identifier, but I reinstalled and I got a new one automatically.
        How do I restore my old one?
      </h2>
      <p>
        Go
        <router-link class="text-blue-500" to="/import-account">import your identifier</router-link>.
        If you don't want the old one, click "Advanced" and check the box to erase it.
        (The erase option only shows if you have exactly one identifier.
         For more in-depth surgery, you'll have to erase data from the browser or reinstall.)
      </p>

      <h2 class="text-xl font-semibold">How do I add someone else?</h2>
      <p>
        <a href="/help-onboarding" target="_blank" class="text-blue-500">
          Click here to show an alert with the steps.
        </a>
        To start scanning, go
        <router-link class="text-blue-500" to="/contact-qr">here.</router-link>
      </p>
      <p>
        If they are not nearby to scan QR codes, tell them to copy their ID from
        their Identity <fa icon="circle-user" class="fa-fw" /> page, which
        typically starts with "did:ethr:...", and send it to you. Go to the
        Contacts <fa icon="users" class="fa-fw" /> page and enter that into the
        top form. To add a name, put a comma and then their name; to add their
        public key, put another comma followed by the key.
      </p>

      <h2 class="text-xl font-semibold">How do I backup all my data?</h2>
      <p>
        There are two sets of data to backup: the identifier secrets and the
        other data that isn't quite a secret such as settings, contacts, etc.
      </p>

      <div class="px-4">
        <h2 class="text-xl font-semibold">
          How do I backup my identifier (secret) data?
        </h2>
        <ul class="list-disc list-outside ml-4">
          <li>
            Go to Your Identity <fa icon="circle-user" class="fa-fw" /> page.
          </li>
          <li>
            Click on "Backup Identifier Seed" and follow the instructions.
          </li>
          <li>
            If you have other identifiers, switch to each one and repeat those
            steps.
          </li>
        </ul>

        <h2 class="text-xl font-semibold">
          How do I backup my other (non-identifier-secret) data?
        </h2>
        <ul class="list-disc list-outside ml-4">
          <li>
            Go to Your Identity <fa icon="circle-user" class="fa-fw" /> page.
          </li>
          <li>
            Click on "Download Settings...". That will save a file to your
            downloads folder. That is your backup, so put it someplace where you
            won't lose it.
          </li>
        </ul>
      </div>

      <h2 class="text-xl font-semibold">How do I restore my data?</h2>
      <p>
        There are two steps to restore your data: the identity secrets, then the
        other data such as settings, contacts, etc.
      </p>

      <div class="px-4">
        <h2 class="text-xl font-semibold">
          How do I restore my identifier (secret) data?
        </h2>
        <ul class="list-disc list-outside ml-4">
          <li>
            <router-link class="text-blue-500" to="/import-account">
              Go to the import page
            </router-link>
            and enter the seed phrase you backed up.
          </li>
        </ul>

        <h2 class="text-xl font-semibold">
          How do I restore my other (non-identifier-secret) data?
        </h2>
        <ul class="list-disc list-outside ml-4">
          <li>
            Go to Your Identity <fa icon="circle-user" class="fa-fw" /> page,
            click Advanced, and follow the instructions for the Contacts & Settings Database "Import".
          </li>
        </ul>
      </div>

      <h2 class="text-xl font-semibold">How do I create another identity?</h2>
      <p>
        Before doing this, note that it is an advanced feature that affects
        functionality (eg. the words "Alt ID" next to results, backup features)
        so beware. You can
        <router-link to="start" class="text-blue-500">
          create another identity here.
        </router-link>
      </p>

      <h2 class="text-xl font-semibold">How do I erase my data?</h2>
      <p>
        Before doing this, note the two kinds of data to backup: identity data,
        and other data for contacts and settings (see instructions above).
      </p>
      <ul>
        <li class="list-disc list-outside ml-4">
          Mobile
          <ul>
            <li class="list-disc list-outside ml-4">
              Chrome: Settings -> Privacy and Security -> Clear Browsing Data
            </li>
            <li class="list-disc list-outside ml-4">
              DuckDuckGo: long hold -> Clear Data (takes effect immediately)
            </li>
          </ul>
        </li>
        <li class="list-disc list-outside ml-4">
          Desktop
          <ul>
            <li class="list-disc list-outside ml-4">
              Chrome:
              Clear at chrome://settings/content/all and
              also clear under dev tools Application
            </li>
            <li class="list-disc list-outside ml-4">
              Firefox: <a href="about:preferences">go here</a>, Manage Data,
              find timesafari.app and select, hit Remove Selected, then Save
              Changes
            </li>
            <li class="list-disc list-outside ml-4">
              Safari: Settings -> Privacy -> Manage Website Data, search for
              timesafari.app and select, hit Remove Selected, then Done.
            </li>
          </ul>
        </li>
      </ul>
      <p>To erase your data from our servers, contact us (below).</p>

      <h2 class="text-xl font-semibold">
        How do I get higher limits?
      </h2>
      <p>
        Let's talk. Contact us (below).
      </p>

      <h2 class="text-xl font-semibold">
        How do I access even more functionality?
      </h2>
      <p>
        There is an "Advanced" section at the bottom of the Account
        <fa icon="circle-user" /> page.
      </p>
      <p>
        There is a even more functionality in a mobile app (and more
        documentation) at
        <a href="https://endorser.ch" class="text-blue-500">
          EndorserSearch.com
        </a>
      </p>

      <h2 class="text-xl font-semibold">
        I know there is a record from someone, so why can't I see that info?
      </h2>
      <p>
        If you don't see anything associated with a person, this is typically
        because they have not given you permission to see their information. Ask
        them to add you to their contact list, and ask specifically to make sure
        the eye next to your name is open like this
        <fa icon="eye" class="fa-fw" /> and not closed like this
        <fa icon="eye-slash" class="fa-fw" />.
      </p>
      <p>
        Sometimes the reason you don't see something is because the search
        results are limited. Go to the bottom and make sure to load all the data
        on a list. If you still don't see it, try a search or view on a
        different page.
      </p>

      <h2 class="text-xl font-semibold">
        Where do I get help with notifications?
      </h2>
      <p>
        <router-link class="text-blue-500" to="/help-notifications"
        >Here.</router-link
        >
      </p>

      <h2 class="text-xl font-semibold">
        My app is misbehaving, like showing me a blank screen or failing to show a feed.
        What can I do?
      </h2>
      <p>
        First, note that clearing the cache will clear all your identity and contact info,
        so we recommend doing other things first (unless you know you have your backups ready).
      </p>
      <ul class="list-disc list-outside ml-4">
        <li>
          Drag down on the screen to refresh it; do that multiple times, because
          it sometimes takes multiple tries for the app to refresh to the current version.
          You can see the version information at the bottom of this page; the best
          way to determine the current version is to open this page in an incognito
          browser window and look at the version there.
        </li>
        <li>
          Close all tabs that have Time Safari open; it can be difficult to find them all,
          and you may have to close all your tabs. In addition, it may be running as an
          installed app, so look for any Time Safari app that may be running outside a browser.
        </li>
        <li>
          There may be a problem with your identity. Go to the Identity
          <fa icon="circle-user" class="fa-fw" /> page, then "Advanced", and "Switch Identifier"
          and you may see helpful info there. If it shows a problem, try adding your identifier again.
        </li>
        <li>
          It can help to reregister the service worker:
          <ul>
            <li>
              In Chrome, open a tab to
              "chrome://serviceworker-internals",
              find "timesafari.app", and click "Unregister".</li>
            <li>
              In Firefox,
              open a tab to "about:serviceworkers",
              find "timesafari.app", and click "Unregister".
            </li>
            <li>
              <a href="https://duckduckgo.com/?q=unregister+service+worker" class="text-blue-500">Search</a>
              for instructions for other browsers.</li>
          </ul>
          Then reload Time Safari.
        </li>
        <li>
          Restart your device.
        </li>
      </ul>
      <p>
        If you still have problems, you can clear the cache (see "erase my data" above)
        and even uninstall and reinstall the app
        -- just be sure to have your backups ready or be
        prepared to restart with a new identity and recreate your network.
        Nobody else has access to your identity or contact information because
        this app is designed to give you full control over your data.
      </p>

      <h2 class="text-xl font-semibold">What are the terms & conditions and the privacy policy?</h2>
      <p style="display:inline; align-items: center">
        This work is public domain, governed by
        <a href="http://creativecommons.org/publicdomain/zero/1.0?ref=chooser-v1" target="_blank" rel="license noopener noreferrer">
          <span class="text-blue-500 mr-1">CC0 1.0</span>
          <img
              src="../assets/help/creative-commons-circle.svg"
              alt="CC circle"
              width="20"
              class="display: inline"
          />
          <img
              src="../assets/help/creative-commons-zero.svg"
              alt="CC zero"
              width="20"
              style="display: inline"
          />
        </a>
        <br />
        For notifications, this service stores push token data; that can be revoked at any time
        by disabling notifications on the Account <fa icon="circle-user" class="fa-fw" /> page.
        <br />
        For all other claim data,
        <a href="https://endorser.ch/privacy-policy" class="text-blue-500">
          the Endorser Service has this Privacy Policy.
        </a>
      </p>

      <h2 class="text-xl font-semibold">Where can I read more?</h2>
      <p>
        This is part of the
        <a href="https://livesofgiving.org" class="text-blue-500">
          Lives of Giving
        </a>
        initiative.
      </p>

      <h2 class="text-xl font-semibold">What app version is this?</h2>
      <p>{{ package.version }} ({{ commitHash }})</p>

      <h2 class="text-xl font-semibold">
        For any other questions, including removing your data:
      </h2>
      <p>
        Contact us at
        <a href="mailto:info@TimeSafari.app" class="text-blue-500"
          >info@TimeSafari.app</a
        >
      </p>
    </div>
    <!-- eslint enable -->
  </section>
</template>

<script lang="ts">
import { Component, Vue } from "vue-facing-decorator";

import * as Package from "../../package.json";
import QuickNav from "@/components/QuickNav.vue";
import { NotificationIface } from "@/constants/app";

@Component({ components: { QuickNav } })
export default class Help extends Vue {
  $notify!: (notification: NotificationIface, timeout?: number) => void;

  package = Package;
  commitHash = import.meta.env.VITE_GIT_HASH;
}
</script>