[Feature Request] add PWA features

[sudogoku]

What feature should be added to Tachidesk?

• Web app should be installable on mobile devices via manifest installability requirements
• Web app should be able to load the home page with series thumbnails, even offline. Consider leveraging the Service Worker API and Cache API.
• Web app should use Notifications API and Push API to notify the a user of various things (each of which is probably it's own feature request). Some ideas:
  • Notify when download queue is complete
  • Notify when an update is available
  • Probably needs a settings panel to finely-tune which notifications are enabled.
  • Notify when new releases are available (which would be awesome). This might require a feature on the server to periodically fetch the latest chapters per series, so that it could compare with the client's latest synced chapter and notify accordingly. But perhaps this could be done purely clientside with some service worker logic.
• Web app should allow reading offline.
  • This introduces the concept of "locally downloaded" chapters, in addition to the current "downloaded" chapters which are served from the server or fetched from the server on-demand. Consider using the IndexedDB API, which can be used for complex data including audio & video.
  • This might be tricky to agree upon a UI to distinguish which files are locally cached on the clientside. Perhaps a simple start is to cache the "top N" server downloaded files in order of date most recently added. These parameters could be configurable in the setting.

Why/Project's Benefit/Existing Problem

Tachidesk's Web UI is great because it allows us to connect to our self-hosted centralized server on multiple devices with pretty much any platform. Most notably, on mobile iOS devices, which of course do not support Tachiyomi.

To get the full mobile app experience, it would be great if this web app had modern PWA features. Most notably, running offline without a reliable (or any) network connection. By leveraging service workers and other modern web technologies, we could experience an "offline" mode that has access to cached data and potentially a chosen set of downloaded chapters that have been saved onto the local device (not just the tachidesk server).

[sudogoku]

I realize this is a lot of features, but since they are all related in concept, I thought it might be a good thread for discussing this overall direction. If requested, I can split these up into separate issues.

[taos15]

I think this issue is linked to #161

[sudogoku]

@taos15 Yeah, it's definitely related in #161's request to make the website installable. This would be handled by the first bullet point:

Web app should be installable on mobile devices via manifest installability requirements

Worth noting that this request is more comprehensive with additional requests relating to common PWA features & their corresponding browser APIs.

[dhvcc]

Hey, agree that making this an installable app will be very usefull, since you'll be able to use it easier on a phone. I had experience creating installable apps, but with Next-PWA, although, I understand the process and the standarts involved. I can submit a PR with, first of all, making this installable with logo assets If this feature is planned - let me know if this needs a separate ticket or if you accept PRs

[schroda]

feel free to look into it, prs are always welcome

I'd say for the first step - making it installable - the mentioned ticket (#161) should be used. For the other mentioned features, if someone wants to work on them, a separate feature request should be opened and linked to this one to be able to track the progress.

[taos15]

PR 737 adds PWA support (add to home in apple). You can only read/access manga offline that you opened before going offline (like you can re-read chapters, but only the pages that you had read). It does not add the more advance features requested in this issue.

[dhvcc]

@taos15 It still looks good as first steps, thanks for that!

[sudogoku]

Looks good, @taos15 ! Thanks for working on this!