refactor: permit asynchronous execution of app and editor commands

src/mappings_editor/src/App.vue

@@ -35,7 +35,7 @@
 import * as AppCommands from "./assets/scripts/Application/Commands";
 // Dependencies
 import { PointerTracker } from "./assets/scripts/Utilities";
-import { useApplicationStore } from "./stores/ApplicationStore"; 
+import { useApplicationStore } from "./stores/ApplicationStore";
 import { defineComponent, markRaw, ref } from "vue";
 import { Browser, OperatingSystem, clamp } from "./assets/scripts/Utilities";
 import type { Command } from "./assets/scripts/Application";
@@ -131,9 +131,9 @@ export default defineComponent({
     async onExecute(cmd: Command) {
       try {
         if(cmd instanceof Promise) {
-          this.application.execute(await cmd);
+          await this.application.execute(await cmd);
         } else {
-          this.application.execute(cmd);
+          await this.application.execute(cmd);
         }
       } catch(ex: any) {
         alert(`Error: ${ ex.message }`)
@@ -175,13 +175,13 @@ export default defineComponent({
       const max = Math.max(min, this.bodyWidth - minRight - minCenter);
       this.activeFrameSize[Handle.Left] = clamp(size, min, max);
     },
-    
+
     /**
      * Sets the size of the right frame.
      * @param size
      *  The frame's new size.
      */
-    setRightFrameSize(size: number) { 
+    setRightFrameSize(size: number) {
       const minLeft = this.activeFrameSize[Handle.Left];
       const minCenter = this.minFrameSize[Handle.Center];
       const min = this.minFrameSize[Handle.Right];
@@ -200,13 +200,13 @@ export default defineComponent({
       settings = await (await fetch(`${ baseUrl }settings_win.json`)).json();
     }
     // Load settings
-    this.application.execute(AppCommands.loadSettings(this.application, settings));
+    await this.application.execute(AppCommands.loadSettings(this.application, settings));
     // Load file from query parameters, if possible
     let params = new URLSearchParams(window.location.search);
     let src = params.get("src");
     if(src) {
       try {
-        this.application.execute(await AppCommands.loadFileFromUrl(this.application, src));
+        await this.application.execute(await AppCommands.loadFileFromUrl(this.application, src));
       } catch(ex) {
         console.error(`Failed to load file from url: '${ src }'`);
         console.error(ex);

src/mappings_editor/src/assets/scripts/Application/Commands/AppCommand.ts

@@ -11,6 +11,6 @@ export abstract class AppCommand  {
     /**
      * Executes the command.
      */
-    public abstract execute(): void;
+    public abstract execute(): Promise<void>;
 
 }

src/mappings_editor/src/assets/scripts/Application/Commands/ApplicationSettings/LoadSettings.ts

@@ -32,8 +32,8 @@ export class LoadSettings extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
-        this._context.settings = this._settings; 
+    public async execute(): Promise<void> {
+        this._context.settings = this._settings;
     }
 
 }

src/mappings_editor/src/assets/scripts/Application/Commands/FileManagement/ClearFileRecoveryBank.ts

@@ -23,7 +23,7 @@ export class ClearFileRecoveryBank extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
+    public async execute(): Promise<void> {
         for(const id of this.context.fileRecoveryBank.files.keys()) {
             // Clear everything except the active file
             if(id === this.context.activeEditor.id) {

src/mappings_editor/src/assets/scripts/Application/Commands/FileManagement/ImportFile.ts

@@ -40,7 +40,7 @@ export class ImportFile extends AppCommand {
         // Validate source framework
         if(file.sourceFramework !== importFile.source_framework) {
             throw new Error(
-                `The imported file's source framework ('${ 
+                `The imported file's source framework ('${
                     importFile.source_framework
                 }') doesn't match this file's source framework ('${
                     file.sourceFramework
@@ -50,7 +50,7 @@ export class ImportFile extends AppCommand {
         // Validate target framework
         if(file.targetFramework !== importFile.target_framework) {
             throw new Error(
-                `The imported file's target framework ('${ 
+                `The imported file's target framework ('${
                     importFile.target_framework
                 }') doesn't match this file's target framework ('${
                     file.targetFramework
@@ -64,7 +64,7 @@ export class ImportFile extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
+    public async execute(): Promise<void> {
         const file = this.editor.file;
         const view = this.editor.view;
         const convert = Reactivity.toRaw(this.fileAuthority.convertMappingObjectImportToParams);
@@ -93,7 +93,7 @@ export class ImportFile extends AppCommand {
             ]
         )
         // Execute insert
-        this.editor.execute(cmd);
+        await this.editor.execute(cmd);
         // Move first item into view
         const firstItem = view.getItems(o => objects.has(o.id)).next().value;
         view.moveToViewItem(firstItem.object.id, 0, true, false);
@@ -135,7 +135,7 @@ export class ImportFile extends AppCommand {
         const insertCmd = EditorCommands.createGroupCommand();
         for(const id in obj) {
             if(!prop.findListItemId(i => i.getAsString("id") === id)) {
-                const newItem = prop.createNewItem({ 
+                const newItem = prop.createNewItem({
                     id          : id,
                     name        : obj[id].name,
                     description : obj[id].description

src/mappings_editor/src/assets/scripts/Application/Commands/FileManagement/LoadFile.ts

@@ -47,7 +47,7 @@ export class LoadFile extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
+    public async execute(): Promise<void> {
         this._context.activeEditor = this._editor;
     }
 

src/mappings_editor/src/assets/scripts/Application/Commands/FileManagement/RemoveFileFromRecoveryBank.ts

@@ -32,7 +32,7 @@ export class RemoveFileFromRecoveryBank extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
+    public async execute(): Promise<void> {
         // Cancel any outstanding saves
         this.editor.tryCancelAutosave();
         // Remove file from recovery bank

src/mappings_editor/src/assets/scripts/Application/Commands/FileManagement/SaveFileToDevice.ts

@@ -39,7 +39,7 @@ export class SaveFileToDevice extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
+    public async execute(): Promise<void> {
         Browser.downloadFile(
             this.name,
             this.contents,

src/mappings_editor/src/assets/scripts/Application/Commands/FileManagement/SaveFileToRecoveryBank.ts

@@ -33,7 +33,7 @@ export class SaveFileToRecoveryBank extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
+    public async execute(): Promise<void> {
         // Create raw references
         const fileAuthority = toRaw(this.context.fileAuthority);
         const fileSerializer = toRaw(this.context.fileSerializer);

src/mappings_editor/src/assets/scripts/Application/Commands/GroupCommand.ts

@@ -15,7 +15,7 @@ export class GroupCommand extends AppCommand {
         super();
         this._commands = [];
     }
-    
+
 
     /**
      * Adds a command to the group.
@@ -29,9 +29,9 @@ export class GroupCommand extends AppCommand {
     /**
      * Applies the set of commands.
      */
-    public execute() {
+    public async execute(): Promise<void> {
         for(let i = 0; i < this._commands.length; i++) {
-            this._commands[i].execute();
+            await this._commands[i].execute();
         }
     }
 

src/mappings_editor/src/assets/scripts/Application/Commands/MappingFileEditor/CopySelectedMappingObjects.ts

@@ -41,7 +41,7 @@ export class CopySelectedMappingObjects extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
+    public async execute(): Promise<void> {
         executeCopy(this.fileSerializer, this.fileAuthority, this.fileView);
     }
 

src/mappings_editor/src/assets/scripts/Application/Commands/MappingFileEditor/CutSelectedMappingObjects.ts

@@ -50,11 +50,11 @@ export class CutSelectedMappingObjects extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
+    public async execute(): Promise<void> {
         // Copy selected objects
         const items = executeCopy(this.fileSerializer, this.fileAuthority, this.fileView);
         // Delete selected objects
-        this.editor.execute(EditorCommands.deleteMappingObjectViews(items));
+        await this.editor.execute(EditorCommands.deleteMappingObjectViews(items));
     }
 
 }

src/mappings_editor/src/assets/scripts/Application/Commands/MappingFileEditor/PasteMappingObjects.ts

@@ -42,10 +42,11 @@ export class PasteMappingObjects extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
-        navigator.clipboard.readText().then((text: string) => {
+    public async execute(): Promise<void> {
+        try {
+            const text = await navigator.clipboard.readText();
             const view = this.editor.view;
-            const rawFileSerializer = Reactivity.toRaw(this.fileSerializer); 
+            const rawFileSerializer = Reactivity.toRaw(this.fileSerializer);
             const convert = Reactivity.toRaw(this.fileAuthority.convertMappingObjectImportToParams);
             // Deserialize items
             const imports = rawFileSerializer.processPaste(text);
@@ -65,13 +66,13 @@ export class PasteMappingObjects extends AppCommand {
                 ]
             )
             // Execute insert
-            this.editor.execute(cmd);
+            await this.editor.execute(cmd);
             // Move first item into view
             const firstItem = view.getItems(o => objects.has(o.id)).next().value;
             view.moveToViewItem(firstItem.object.id, 0, true, false);
-        }).catch(reason => {
+        } catch(reason) {
             console.error("Failed to read clipboard: ", reason);
-        })
+        }
     }
 
 }

src/mappings_editor/src/assets/scripts/Application/Commands/MappingFileEditor/RedoEditorCommand.ts

@@ -23,8 +23,8 @@ export class RedoEditorCommand extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
-        this._editor.redo();
+    public async execute(): Promise<void> {
+        await this._editor.redo();
     }
 
 }

src/mappings_editor/src/assets/scripts/Application/Commands/MappingFileEditor/UndoEditorCommand.ts

@@ -18,13 +18,13 @@ export class UndoEditorCommand extends AppCommand {
         super();
         this._editor = editor;
     }
-    
+
 
     /**
      * Executes the command.
      */
-    public execute(): void {
-        this._editor.undo();
+    public async execute(): Promise<void> {
+        await this._editor.undo();
     }
 
 }

src/mappings_editor/src/assets/scripts/Application/Commands/NullCommand.ts

@@ -13,6 +13,6 @@ export class NullCommand extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {}
+    public async execute(): Promise<void> {}
 
 }

src/mappings_editor/src/assets/scripts/Application/Commands/ViewManagement/OpenHyperlink.ts

@@ -22,7 +22,7 @@ export class OpenHyperlink extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
+    public async execute(): Promise<void> {
         window.open(this._url, "_blank");
     }
 

src/mappings_editor/src/assets/scripts/Application/Commands/ViewManagement/SwitchToFullscreen.ts

@@ -14,7 +14,7 @@ export class SwitchToFullscreen extends AppCommand {
     /**
      * Executes the command.
      */
-    public execute(): void {
+    public async execute(): Promise<void> {
         const cast = document.body as any;
         if (cast.requestFullscreen) {
             cast.requestFullscreen();

src/mappings_editor/src/assets/scripts/MappingFileEditor/EditorCommands/DoNothing.ts

@@ -13,11 +13,11 @@ export class DoNothing extends EditorCommand {
     /**
      * Executes the editor command.
      */
-    public execute(): void {}
+    public async execute(): Promise<void> {}
 
     /**
      * Undoes the editor command.
      */
-    public undo(): void {}
+    public async undo(): Promise<void> {}
 
 }

src/mappings_editor/src/assets/scripts/MappingFileEditor/EditorCommands/EditorCommand.ts

@@ -11,40 +11,40 @@ export abstract class EditorCommand {
     /**
      * Executes the editor command.
      */
-    public abstract execute(): void;
+    public abstract execute(): Promise<void>;
 
     /**
      * Executes the editor command.
      * @param issueDirective
      *  A function that can issue one or more editor directives.
      */
-    public abstract execute(issueDirective?: DirectiveIssuer): void;
+    public abstract execute(issueDirective?: DirectiveIssuer): Promise<void>;
 
     /**
      * Redoes the editor command.
      */
-    public redo(): void;
-    
+    public redo(): Promise<void>;
+
     /**
      * Redoes the editor command.
      * @param issueDirective
      *  A function that can issue one or more editor directives.
      */
-    public redo(issueDirective?: DirectiveIssuer): void;
-    public redo(issueDirective?: DirectiveIssuer) {
-        this.execute(issueDirective);
+    public async redo(issueDirective?: DirectiveIssuer): Promise<void>;
+    public async redo(issueDirective?: DirectiveIssuer): Promise<void> {
+        return this.execute(issueDirective);
     }
 
     /**
      * Undoes the editor command.
      */
-    abstract undo(): void;
- 
+    abstract undo(): Promise<void>;
+
     /**
      * Undoes the editor command.
      * @param issueDirective
      *  A function that can issue one or more editor directives.
      */
-    abstract undo(issueDirective?: DirectiveIssuer): void;
+    abstract undo(issueDirective?: DirectiveIssuer): Promise<void>;
 
 }

src/mappings_editor/src/assets/scripts/MappingFileEditor/EditorCommands/File/CreateMappingObject.ts

@@ -7,7 +7,7 @@ export class CreateMappingObject extends EditorCommand {
      * The mapping file.
      */
     public readonly file: MappingFile;
-    
+
     /**
      * The new mapping object to add.
      */
@@ -41,7 +41,7 @@ export class CreateMappingObject extends EditorCommand {
      * @param issueDirective
      *  A function that can issue one or more editor directives.
      */
-    public execute(issueDirective: DirectiveIssuer = () => {}): void {
+    public async execute(issueDirective: DirectiveIssuer = () => {}): Promise<void> {
         this.file.insertMappingObjectAfter(this.object);
         issueDirective(EditorDirective.Record | EditorDirective.Autosave);
         issueDirective(EditorDirective.Reindex, this.object.id);
@@ -52,7 +52,7 @@ export class CreateMappingObject extends EditorCommand {
      * @param issueDirective
      *  A function that can issue one or more editor directives.
      */
-    public undo(issueDirective: DirectiveIssuer = () => {}): void {
+    public async undo(issueDirective: DirectiveIssuer = () => {}): Promise<void> {
         this.file.removeMappingObject(this.object);
         issueDirective(EditorDirective.Autosave);
         issueDirective(EditorDirective.Reindex, this.object.id);