Add support for saving to a local file from the web-app (or even import an existing local project) ("File System Access API")

[tomayac]

Description

Rather than downloading, allow for true saving of games. See the Trello request.

Solution suggested

Describe the solution

Replace calls to openBlobDownloadUrl() with a fileSave() call from the browser-fs-access library. (Full disclosure: I'm its author.) This would use the same <a download> fallback on non-supporting browsers, but properly use the File System Access API on supporting browsers. The advantage is that saves will not be downloads (so users don't end up with chains of gdevelop game.zip, gdevelop game (1).zip, gdevelop game (2).zip), but one

Add any other context or screenshots about the feature request here.

Construct 3 uses this API successfully.

Explain if you can help to implement the solution.

Happy to make changes to browser-fs-access should you require them.

Alternatives considered

• You could leave things as is.
• You could also implement the File System Access API calls and the fallback solution yourself if you decide against browser-fs-access.

[4ian]

Thanks for opening this issue! I think the proper Trello card is this one - I've updated your post with: https://trello.com/c/MEAeScbO/457-allow-opening-saving-locally-a-project-and-use-local-resources-from-the-web-app-chrome-edge-safari

For GDevelop, there are two things important to handle when it comes to files:

• The project file (the .json file describing the game project)
• The resources (which are local files on the desktop app, or can be URLs in the case of cloud projects).

So there are different level of integration which could be created:

1. Improve the existing "Download a copy" feature so that it uses File System Access API or browser-fs-access to improve the UX by saving always to the same file.
2. Add a new feature "Import from a local file" feature that uses the same API to allow a local folder to be imported as a game in the web-app (but if you hit Ctrl+S/Cmd+S, you're asked again if you want to save as a cloud project or download a copy). Importing a zip or a folder is important because the JSON project file is not enough (you need the resources).
3. Full "Bi-directional" support: have something that allow working directly on a local folder, so that when you hit save, your changes are saved to the disk (like the local app). And when you edit images/audio/resources, they are also saved to the disk.

The 1. is the easiest. For 2. and 3., it requires greater care because it needs to support loading the project, but also ensure resources can be read, and then used in previews (probably work with blobs).

EDIT: in other words, where Construct 3 is storing everything in a zip file, projects in GDevelop are a collection of the project json files + the resources which can be relative files (desktop app) or a mix of public URLs+private URLs (for cloud projects, on the web or desktop app).

[tomayac]

Thanks a lot for the better Trello link! If this allows you to move off Electron, I think it'd be great for many users saving them a large download and you having to build for that many OS combinations. Especially since your PWA is really neat and makes great use of Window Controls Overlay:

For 2., yes, this would be a new feature, I didn't see a way to import an existing game, so didn't mention it. The corresponding browser-fs-access method would be fileOpen(). It falls back to <input type=file> on non-supporting browsers.

A cool feature enabled by the API is command/ctrl + s saving, see this write-up for more background.

[4ian]

Especially since your PWA is really neat and makes great use of Window Controls Overlay

Thank you! I was also very happy with the result we got here 👍

I'm marking this as a Good First Issue as I think solution 1 (getting the download as a copy adapted) is totally doable. Solution 2/3 are more involved (but would allow to do almost everything locally, so the web-app would be almost equivalent to the Electron app) - though in the longer term it would be interesting to have (...would be perfect for a GSoC project but seems we've not been accepted this year 🥲)

A cool feature enabled by the API is command/ctrl + s saving, see this write-up for more background.

Yes getting the Cmd/Ctrl+S to "just work" would be perfect!

[tomayac]

[S]o the web-app would be almost equivalent to the Electron app)

One missing piece is an App Menu API, which would be really nice for following macOS guidelines. If you'd be interested, feel free to chime in on the bug as a potential user of such an API would it exist.

[giannpls]

Hello, I was wondering if implementing solution 2/3 as described in this ticket would also allow working with local files using the iOS app, or if that would need to be implemented separately. For example, if I wanted to use the GDevelop app with Working Copy on iOS.

Thanks!

[tomayac]

Until iOS supports the picker methods of the File System Access API (tracked as https://bugs.webkit.org/show_bug.cgi?id=231706), you need to fall back to downloading. I maintain browser-fs-access that makes this relatively painless.