Move a couple functions to helpers.js

src/app.js

@@ -13,8 +13,6 @@
 //    is instantiated in the middle of this file (but after $left/$right are declared).
 // @TODO: Minimize global variables and exports from app.js
 const exports = {
-	get_file_extension,
-	get_format_from_extension,
 	to_canvas_coords,
 	from_canvas_coords,
 	update_fill_and_stroke_colors_and_lineWidth,
@@ -274,21 +272,6 @@ for (const [key, defaultValue] of Object.entries(window.systemHookDefaults)) {
 	window.systemHooks[key] = window.systemHooks[key] || defaultValue;
 }
 
-function get_file_extension(file_path_or_name) {
-	// does NOT accept a file extension itself as input - if input does not have a dot, returns empty string
-	return file_path_or_name.match(/\.([^./]+)$/)?.[1] || "";
-}
-function get_format_from_extension(formats, file_path_or_name_or_ext) {
-	// accepts a file extension as input, or a file name, or path
-	const ext_match = file_path_or_name_or_ext.match(/\.([^.]+)$/);
-	const ext = ext_match ? ext_match[1].toLowerCase() : file_path_or_name_or_ext; // excluding dot
-	for (const format of formats) {
-		if (format.extensions.includes(ext)) {
-			return format;
-		}
-	}
-}
-
 // #endregion
 
 // #region URL Params

src/globals.d.ts

@@ -214,6 +214,8 @@ interface Window {
 	get_help_folder_icon: (file_name: string) => HTMLImageElement;
 	get_icon_for_tool: (tool: Tool) => HTMLImageElement;
 	get_icon_for_tools: (tools: Tool[]) => HTMLImageElement | HTMLCanvasElement;
+	get_file_extension: (file_path_or_name: string) => string;
+	get_file_format: <T extends FileFormat>(formats: T[], file_path_or_name_or_ext: string) => T;
 	// tools.js
 	TOOL_FREE_FORM_SELECT: "TOOL_FREE_FORM_SELECT";
 	TOOL_SELECT: "TOOL_SELECT";

src/helpers.js

@@ -310,6 +310,32 @@ function get_icon_for_tools(tools) {
 	return icon_canvas;
 }
 
+/**
+ * does NOT accept a file extension itself as input - if input does not have a dot, returns empty string
+ * @param {string} file_path_or_name  path or name of a file
+ * @returns {string}  file extension without the dot
+ */
+function get_file_extension(file_path_or_name) {
+	return file_path_or_name.match(/\.([^./]+)$/)?.[1] || "";
+}
+
+/**
+ * accepts a file extension as input, or a file name, or path
+ * @template {FileFormat} T
+ * @param {T[]} formats
+ * @param {string} file_path_or_name_or_ext  file path, name, or extension
+ * @returns {T}  format object
+ */
+function get_format_from_extension(formats, file_path_or_name_or_ext) {
+	const ext_match = file_path_or_name_or_ext.match(/\.([^.]+)$/);
+	const ext = ext_match ? ext_match[1].toLowerCase() : file_path_or_name_or_ext; // excluding dot
+	for (const format of formats) {
+		if (format.extensions.includes(ext)) {
+			return format;
+		}
+	}
+}
+
 /**
  * Converts an RGB color value to HSL. Conversion formula
  * adapted from http://en.wikipedia.org/wiki/HSL_color_space.
@@ -350,6 +376,8 @@ export {
 	E,
 	TAU,
 	debounce,
+	get_file_extension,
+	get_format_from_extension,
 	get_help_folder_icon,
 	get_icon_for_tool,
 	get_icon_for_tools,
@@ -378,3 +406,5 @@ window.image_data_match = image_data_match;
 window.get_rgba_from_color = get_rgba_from_color;
 window.memoize_synchronous_function = memoize_synchronous_function;
 window.debounce = debounce;
+window.get_file_extension = get_file_extension;
+window.get_format_from_extension = get_format_from_extension;