show apple and gplay install recommendations on iOS/Android

[missytake]

closes #932

I'm not sure how we can limit showing the GPlay app recommendation only on /download.

[github-actions]

Check out the page preview at https://staging.delta.chat/933/en/

[missytake]

I manually copied manifest.json to staging.delta.chat/manifest.json. Unfortunately I don't have any smartphones I can test this with. Can someone report whether it works?

[missytake]

I looked further into recommending a GPlay app in the same way as it's possible on iOS, it seems to require javascript to actually show a banner of your own: https://developer.chrome.com/blog/app-install-banners-native/

The manifest.json only seems to allow chrome to check whether the app is already installed. This is not really an advantage over our current page.

[r10s]

I manually copied manifest.json to staging.delta.chat/manifest.json.

https://staging.delta.chat/manifest.json shows a 404 for me sorry, i did a typo. https://staging.delta.chat/manifest.json exist

it seems to require javascript to actually show a banner of your own

javascript would be fine however, yes, it seems to be an additional helper only, not needed to show the "native app install prompt"

[r10s]

I'm not sure how we can limit showing the GPlay app recommendation only on /download.

maybe it is fine to have it on all pages - according to https://developer.chrome.com/blog/app-install-banners-native/ the "native app install prompt" is shown only when the app is not installed yet.

it depends a bit how it looks like and works like, i am failing to see some example from other apps

[r10s]

k, @adbenitez and me read a bit closer through https://developer.chrome.com/blog/app-install-banners-native/ :

1. indeed a manifest.json is needed to allow "direct google play store installation" -
   which is only available in the "three dot menu" then, however. see eg. mastodon to get an idea.
   so, it is fine that this is "global" and not only on the download page

2. if the manifest is present and other criteria are met, one can do $things with javascript

in this PR, i would do only 1. - it does not worsen things, it is only a static file, it is done by mastodon and others - and will allow us to start experimenting with javascript banner in subsequent PR.

the manifest, however, needs get more love and should be full PWA (the code shown on developer.chrome.com is only an excerpt)

sth. as the following should do:

{
  "name": "Delta Chat",
  "short_name": "Delta Chat",
  "icons": [
    {
      "src": "https://delta.chat/assets/logos/delta-chat.svg",
      "sizes": "192x192",
      "type": "image/svg+xml",
      "purpose": "any"
    },
    {
      "src": "https://delta.chat/assets/logos/delta-chat.svg",
      "sizes": "512x512",
      "type": "image/svg+xml",
      "purpose": "any"
    }
  ],
  "prefer_related_applications": true,
  "related_applications": [
    {
      "platform": "play",
      "id": "chat.delta"
    }
  ]
}

(for svg in pwa i found: https://stackoverflow.com/questions/62825490/svg-icon-in-pwa-manifest-json-how-to-set-it-for-all-sizes )

[missytake]

I deployed manifest.json to staging.delta.chat manually. Can you re-check with a modern smartphone?

[r10s]

hm, it is not picked up. but i am also not sure if the condensing of the icons is a good thing to try out at that point, on stackoverflow some say so an some say so - i am not really sure about svg :)

not saying, this is the issue, just to be sure.

but i also did not have seen a single page where the pointing to the app-store really was used, signal and mastodon use - unexpectedly - webapps, weird esp. for signal

also, firefox documents related_applications somehow, https://developer.mozilla.org/en-US/docs/Web/Manifest/related_applications , even for windows and others - why is all that documented and no one is using it? i would really see that in action :)

ftr, it is possible to have different manifest.json per page, eg. signal is using https://signal.org/assets/images/favicon/site.webmanifest - but we do not need that

[r10s]

k, i give up. i reverted the last commit, merging

i did not find a single android app that uses related_applications pointing to the play store.

from the documentation, it should be possible to created a banner as on ios, still