Add better exporting/saving for Chromium-based browsers

This uses the new web filesystem access APis, making GodSVG no longer save a new file to the downloads folder.
This instead prompts the user once to save a file and stores a handle to that file that we can later write to all we want.
There are some limitations; Mainly, the handle for each file has to be requested again any time the user loads up GodSVG again, but this isn't that problematic and right now I'm doing it any time the user saves the file again.

See: https://developer.chrome.com/docs/capabilities/web-apis/file-system-access

Author: FlooferLand

src/config_classes/TabData.gd

@@ -73,7 +73,11 @@ func _save_svg_text() -> void:
 func save_to_bound_path() -> void:
 	if Configs.savedata.get_active_tab() != self:
 		return
-	FileAccess.open(svg_file_path, FileAccess.WRITE).store_string(State.get_export_text())
+	var export_text := State.get_export_text()
+	if not OS.has_feature("web"):
+		FileAccess.open(svg_file_path, FileAccess.WRITE).store_string(export_text)
+	else:
+		FileUtils.web_save(export_text.to_utf8_buffer(), "svg")
 	queue_sync()
 
 func setup_svg_text(new_text: String, fully_load := true) -> void:

src/utils/FileUtils.gd

@@ -38,7 +38,7 @@ static func compare_svg_to_disk_contents(idx := -1) -> FileState:
 static func _save_svg_with_custom_final_callback(final_callback: Callable) -> void:
 	var active_tab := Configs.savedata.get_active_tab()
 	var file_path := active_tab.svg_file_path
-	if not file_path.is_empty() and FileAccess.file_exists(file_path):
+	if not file_path.is_empty() and (FileAccess.file_exists(file_path) or OS.has_feature("web")):
 		active_tab.save_to_bound_path()
 		if final_callback.is_valid():
 			final_callback.call()
@@ -62,7 +62,8 @@ static func open_export_dialog(export_data: ImageExportData, final_callback := C
 			buffer = ImageExportData.svg_to_buffer()
 		else:
 			buffer = export_data.image_to_buffer(export_data.generate_image())
-		_web_save(buffer, ImageExportData.image_types_dict[export_data.format])
+		
+		web_save(buffer, export_data.format, true, true)
 		if final_callback.is_valid():
 			final_callback.call()
 	else:
@@ -96,7 +97,7 @@ static func open_export_dialog(export_data: ImageExportData, final_callback := C
 static func open_xml_export_dialog(xml: String, file_name: String) -> void:
 	OS.request_permissions()
 	if OS.has_feature("web"):
-		_web_save(xml.to_utf8_buffer(), "application/xml")
+		web_quick_save(xml.to_utf8_buffer(), "xml")
 	else:
 		if _is_native_preferred():
 			var native_callback :=\
@@ -472,6 +473,7 @@ static func _close_tabs_internal(indices: Array[int]) -> void:
 static var _change_callback: JavaScriptObject
 static var _cancel_callback: JavaScriptObject
 static var _file_load_callbacks: Array[JavaScriptObject] = []
+static var _file_save_callback: JavaScriptObject
 
 static var _web_file_data_cache: Dictionary[String, Variant] = {}
 
@@ -639,9 +641,121 @@ static func _web_on_file_dialog_canceled(_args: Array) -> void:
 	var window = JavaScriptBridge.get_interface("window")
 	window.godsvgDialogClosed = true
 
+static func _web_on_file_saved(args: Array) -> void:
+	var file_handle: JavaScriptObject = args[0]
+	var quick_export: bool = args[1]
+	
+	if not quick_export:
+		var active_tab := Configs.savedata.get_active_tab()
+		active_tab.svg_file_path = file_handle.name
+		active_tab.marked_unsaved = false
+	else:
+		HandlerGUI.remove_all_menus()
 
-static func _web_save(buffer: PackedByteArray, format_name: String) -> void:
-	var file_name := Utils.get_file_name(Configs.savedata.get_active_tab().svg_file_path)
+## Currently used for SVG exports on web.
+static func web_quick_save(buffer: PackedByteArray, format: String) -> void:
+	var active_tab := Configs.savedata.get_active_tab()
+	var file_name := Utils.get_file_name(active_tab.svg_file_path)
+	var format_type := ImageExportData.image_types_dict[format]
 	if file_name.is_empty():
-		file_name = "export"
-	JavaScriptBridge.download_buffer(buffer, file_name, format_name)
+		file_name = "export." + format
+	JavaScriptBridge.download_buffer(buffer, file_name, format_type)
+	
+## Currently used for saving on web. [br]
+## [param format]: The file format ("svg", etc) [br]
+## [param ignore_handles]: Doesn't write/read to existing file handles, makes new ones instead. [br]
+## [param quick_export]: Toggle on for exports
+static func web_save(buffer: PackedByteArray, format: String, ignore_handles: bool = false, quick_export: bool = false) -> void:
+	var window := JavaScriptBridge.get_interface("window")
+	
+	var active_tab := Configs.savedata.get_active_tab()
+	var file_path = active_tab.svg_file_path
+	if file_path.is_empty():
+		if not active_tab.presented_name.is_empty() and not quick_export:
+			file_path = active_tab.presented_name
+		else:
+			file_path = "export." + format
+	var file_name := Utils.get_file_name(file_path)
+	var format_type := ImageExportData.image_types_dict[format]
+	
+	# Currently, only Chromium-based browsers support the new file picker system.
+	if window["showSaveFilePicker"] == null:
+		JavaScriptBridge.download_buffer(buffer, file_name, format_type)
+		return
+	
+	# Initializing file handles.
+	if window["godsvgFileHandles"] == null:
+		window.godsvgFileHandles = JavaScriptBridge.create_object("Object")
+	
+	# Creating our save function; Should probably be moved to the global context.
+	JavaScriptBridge.eval("""
+		window.godsvgSaveFile = function(id, buffer, onSave, ignoreHandles=false, quickExport=false, options={}) {
+			const writeFile = (fileHandle, buff) => {
+				return fileHandle.createWritable().then((writable) => {
+					writable.write(buff).then(() => {
+						onSave(fileHandle, quickExport);
+						writable.close();
+					});
+				});
+			};
+			
+			if (quickExport) {
+				ignoreHandles = true;
+			}
+
+			if (window["godsvgFileHandles"] == undefined) {
+				window.godsvgFileHandles = {}
+			}
+			
+			if (!ignoreHandles && id in window.godsvgFileHandles) {
+				writeFile(window.godsvgFileHandles[id], buffer);
+			} else {
+				window.showSaveFilePicker(options).then((fileHandle) => {
+					if (!ignoreHandles) window.godsvgFileHandles[id] = fileHandle;
+					writeFile(fileHandle, buffer);
+				}).catch((err) => {
+					if ("SecurityError" in err) {
+						/*
+						TODO: Figure out what to do if the user saves without pressing something first.
+							Popping up a file save dialog without user input is disallowed due to
+							secure context mumbo jumbo.
+						*/
+						console.error("Failed to save file due to the secure web context.");
+					} else {
+						console.error(err);
+					}
+				});
+			}
+		}
+	""")
+	
+	# Options
+	var picker_options := {
+		"suggestedName": file_name + "." + format,
+		"startIn": "pictures",
+		"types": [
+			{
+				"description": "Vector Image" if format == "svg" else "Image",
+				"accept": {
+					format_type: ["." + format],
+				},
+			},
+		],
+		"excludeAcceptAllOption": true,
+		"multiple": false,
+	}
+	JavaScriptBridge.eval("""
+		window.godsvgSavePickerOptions = %s;
+	""" % JSON.stringify(picker_options))
+	
+	# Buffer
+	var array_buff = JavaScriptBridge.create_object("ArrayBuffer", buffer.size())
+	var buff = JavaScriptBridge.create_object("Uint8Array", array_buff)
+	for i in len(buffer):
+		buff[i] = buffer[i]
+	
+	# Saving
+	# (godsvgCurrentlySaving is required in order to not accidentally save to the wrong tab)
+	_file_save_callback = JavaScriptBridge.create_callback(_web_on_file_saved)
+	window.godsvgCurrentlySaving = active_tab.id
+	window.godsvgSaveFile(active_tab.id, buff, _file_save_callback, ignore_handles, quick_export, window.godsvgSavePickerOptions)