Loading a .dlg from git, and listing all available configs in a drop …

…down menu
ICRAR · Aug 13, 2024 · 61290a8 · 61290a8
1 parent 9d076af
commit 61290a8
Show file tree

Hide file tree

Showing 8 changed files with 47 additions and 38 deletions.
diff --git a/src/Eagle.ts b/src/Eagle.ts
@@ -2026,7 +2026,7 @@ export class Eagle {
         }
     }
 
-    openRemoteFile = (file : RepositoryFile) : void => {
+    openRemoteFile =(file : RepositoryFile) : void => {
         // flag file as being fetched
         file.isFetching(true);
 
@@ -2105,7 +2105,7 @@ export class Eagle {
                     break;
 
                 case Eagle.FileType.Daliuge:
-                    this._remoteDaliugeLoaded(file, data);
+                    this._remoteDaliugeLoaded(file, dataObject);
                     break;
 
                 default:
@@ -2240,9 +2240,26 @@ export class Eagle {
         }
     }
 
-    private _remoteDaliugeLoaded = (file: RepositoryFile, data: string): void => {
-        console.log("Not implemented");
-        Utils.showNotification("Not implemented", "Can't load daliuge files yet", "danger");
+    private _remoteDaliugeLoaded = (file: RepositoryFile, dataObject: any): void => {
+        const errorsWarnings: Errors.ErrorsWarnings = {"errors":[], "warnings":[]};
+
+        //console.log("Not implemented");
+        //errorsWarnings.errors.push(Errors.Message("Daliuge file loading not implemented"));
+
+        // load graph
+        this.logicalGraph(LogicalGraph.fromOJSJson(dataObject, file, errorsWarnings));
+
+        // load configs
+        const graphConfigs: GraphConfig[] = [];
+        for (const gco of dataObject["graphConfigurations"]){
+            const gc = GraphConfig.fromJson(gco, errorsWarnings);
+            graphConfigs.push(gc);
+        }
+
+        this.logicalGraph().setGraphConfigs(graphConfigs);
+
+        // show errors/warnings
+        this._handleLoadingErrors(errorsWarnings, file.name, file.repository.service);
     }
 
     private _reloadPalette = (file : RepositoryFile, data : string, palette : Palette) : void => {

diff --git a/src/GraphConfigurationsTable.ts b/src/GraphConfigurationsTable.ts
@@ -6,6 +6,8 @@ import { Node } from "./Node";
 export class GraphConfigurationsTable {
 
     static openModal = () : void => {
+        console.log("GraphConfigurationsTable.openModal()");
+
         const eagle: Eagle = Eagle.getInstance();
 
         eagle.showEagleIsLoading()

diff --git a/src/KeyboardShortcut.ts b/src/KeyboardShortcut.ts
@@ -215,7 +215,6 @@ export class KeyboardShortcut {
             new KeyboardShortcut("open_keyboard_shortcut_modal", "Open Keyboard Shortcut Modal", ["k"], "keydown", KeyboardShortcut.Modifier.None, KeyboardShortcut.true, ['shortcuts'], KeyboardShortcut.true, KeyboardShortcut.true, (eagle): void => {eagle.smartToggleModal('shortcutsModal')}),
             new KeyboardShortcut("open_parameter_table_modal", "Open Parameter Table Modal", ["t"], "keydown", KeyboardShortcut.Modifier.None, KeyboardShortcut.true, ['fields','field','node','table'], function(){return !Setting.findValue(Setting.STUDENT_SETTINGS_MODE)}, function(){return !Setting.findValue(Setting.STUDENT_SETTINGS_MODE)}, (eagle): void => {ParameterTable.openModal(ParameterTable.Mode.NodeFields, ParameterTable.SelectType.Normal);}),
             new KeyboardShortcut("open_graph_configuration_table_modal", "Open Graph Configuration Table Modal", ["t"], "keydown", KeyboardShortcut.Modifier.Shift, KeyboardShortcut.true, ['fields','field','node','graph','table','favourites'], KeyboardShortcut.true, KeyboardShortcut.true, (eagle): void => {ParameterTable.openModal(ParameterTable.Mode.GraphConfig, ParameterTable.SelectType.Normal);}),
-            new KeyboardShortcut("open_graph_configurations_table_modal", "Open Graph Configurations Table Modal", ["c"], "keydown", KeyboardShortcut.Modifier.Shift, KeyboardShortcut.true, [], KeyboardShortcut.true, KeyboardShortcut.true, (eagle): void => {GraphConfigurationsTable.openModal();}),
             new KeyboardShortcut("undo", "Undo", ["z"], "keydown", KeyboardShortcut.Modifier.None, KeyboardShortcut.true, ['back','history'], KeyboardShortcut.true, KeyboardShortcut.true, (eagle): void => {eagle.undo().prevSnapshot(eagle)}),
             new KeyboardShortcut("redo", "Redo", ["z"], "keydown", KeyboardShortcut.Modifier.Shift, KeyboardShortcut.true, ['forward','history'], KeyboardShortcut.true, KeyboardShortcut.true, (eagle): void => {eagle.undo().nextSnapshot(eagle)}),
             new KeyboardShortcut("check_graph", "Check Graph", ["!"], "keydown", KeyboardShortcut.Modifier.Shift, KeyboardShortcut.true, ['error','errors','fix'], KeyboardShortcut.allowGraphEditing, function(){return KeyboardShortcut.graphNotEmpty && Setting.findValue(Setting.ALLOW_GRAPH_EDITING) }, (eagle): void => {eagle.showGraphErrors();}),

diff --git a/src/LogicalGraph.ts b/src/LogicalGraph.ts
@@ -288,6 +288,10 @@ export class LogicalGraph {
         return commentNodes;
     }
 
+    setGraphConfigs = (graphConfigs: GraphConfig[]): void => {
+        this.graphConfigs(graphConfigs);
+    }
+
     countEdgesIncidentOnNode = (node : Node) : number => {
         let result: number = 0;
 

diff --git a/src/Utils.ts b/src/Utils.ts
@@ -53,7 +53,8 @@ export class Utils {
         "graph",
         "palette",
         "cfg", // for graph config files
-        "md" // for markdown e.g. README.md
+        "md", // for markdown e.g. README.md
+        "daliuge", "dlg" // for logical graphs templates containing graph configurations
     ];
 
     static ojsGraphSchema : object = {};

diff --git a/templates/modals/graph_configurations_table.html b/templates/modals/graph_configurations_table.html
@@ -28,27 +28,21 @@ <h5 class="modal-title">
                 <!-- /ko -->
                 <!-- ko if: logicalGraph().graphConfigs().length !== 0 -->
                     <table id="paramsTableWrapper">
-                        <div id="tableInspector">
-                            <input id="tableInspectorSelection" type="text" placeholder="Selection" data-bind="value: ParameterTable.formatTableInspectorSelection()" readonly>
-                            <input id="tableInspectorValue" type="text" placeholder="Content" data-bind="value: ParameterTable.formatTableInspectorValue(), readonly: ParameterTable.selectionReadonly(), event: {keyup: ParameterTable.tableInspectorUpdateSelection($element.value)}">
-                        </div>
                         <thead>
                             <tr>
                                 <th data-bind="eagleTooltip:''" data-bs-placement="top"></th>
                                 <th data-bind="eagleTooltip:''" data-bs-placement="top">Config Name</th>
                             </tr>
                         </thead>
-                        <tbody data-bind="foreach: graphConfigs()">
-                            <!-- ko if: $data.fitsTableSearchQuery() -->
-                                <tr data-bind="attr: {'id' : 'tableRow_'+$data.getId()}">
-                                    <td class='columnCell column_KeyAttr'>
-                                        <!-- kept for now as we will need the space for the row drag handle -->
-                                    </td>
-                                    <td class='columnCell column_NodeName'>
-                                        <input class="tableParameter" type="string" data-bind="value: $root.logicalGraph().findNodeByKey(nodeKey()).getName(), disabled: true, eagleTooltip: $root.logicalGraph().findNodeByKey(nodeKey()).getDescription()">
-                                    </td>
-                                </tr>
-                            <!-- /ko -->
+                        <tbody data-bind="foreach: logicalGraph().graphConfigs()">
+                            <tr data-bind="attr: {'id' : 'tableRow_'+$data.getName()}">
+                                <td class='columnCell column_KeyAttr'>
+                                    <!-- kept for now as we will need the space for the row drag handle -->
+                                </td>
+                                <td class='columnCell column_NodeName'>
+                                    <input class="tableParameter" type="string" data-bind="value: '', disabled: true, eagleTooltip: ''">
+                                </td>
+                            </tr>
                         </tbody>
                     </table>
                 <!-- /ko -->

diff --git a/templates/modals/parameter_table.html b/templates/modals/parameter_table.html
@@ -6,7 +6,7 @@
                 <div class="modal-header" data-bind="click: function(){ParameterTable.resetSelection()}">
                     <!-- ko if: ParameterTable.inMode(ParameterTable.Mode.GraphConfig) -->
                         <h5 class="modal-title" id="parameterTableModalTitle">
-                            Graph Configuration Table: <span data-bind="html: $root.graphConfig().fileInfo().name"></span>
+                            Graph Configuration Table: <span data-bind="html: $root.currentConfig().name()"></span>
                         </h5>
                     <!-- /ko -->
                     <!-- ko if: ParameterTable.inMode(ParameterTable.Mode.NodeFields) -->
@@ -149,7 +149,7 @@ <h5 class="modal-title" id="parameterTableModalTitle">Fields Table: <span data-b
                             </thead>
                             <tbody data-bind="foreach: ParameterTable.getTableFields()">
                                 <!-- ko if: $data.fitsTableSearchQuery() -->
-                                    <!-- ko if: Setting.findValue(Setting.SHOW_NON_KEY_PARAMETERS) || $root.graphConfig().hasField($data) -->
+                                    <!-- ko if: Setting.findValue(Setting.SHOW_NON_KEY_PARAMETERS) || $root.currentConfig().hasField($data) -->
                                         <tr data-bind="attr: {'id' : 'tableRow_'+$data.getId()}">
                                             <!-- ko if: ParameterTable.getActiveColumnVisibility().keyAttribute() -->
                                             <td class='columnCell column_KeyAttr'>
@@ -166,13 +166,13 @@ <h5 class="modal-title" id="parameterTableModalTitle">Fields Table: <span data-b
                                                     <input class="tableParameter selectionTargets tableFieldDisplayName" placeholder="New Parameter" type="string" data-bind="value: displayText, disabled: ParameterTable.getNodeLockedState($data), valueUpdate: ['afterkeydown', 'input'], click: function(event, data){ParameterTable.select($data.displayText(), 'displayText', $data, $index())}, event:{blur: function(){$(event.target).removeClass('newEmpty')} ,keyup: function(event, data){ParameterTable.select($data.displayText(), 'displayText', $data, $index())}}">
 
                                                     <!-- ko if: ParameterTable.inMode(ParameterTable.Mode.NodeFields) -->
-                                                        <!-- ko ifnot: $root.graphConfig().hasField($data) -->
+                                                        <!-- ko ifnot: $root.currentConfig().hasField($data) -->
                                                         <button data-bind="click: function(){ParameterTable.requestAddField($data)}, disabled: !Setting.findValue(Setting.ALLOW_SET_KEY_PARAMETER), eagleTooltip:'Add Field to Graph Config', style:{'visibility':'hidden'}, clickBubble:false">
                                                             <i class="material-icons">favorite_border</i>
                                                         </button>
                                                         <!-- /ko -->
-                                                        <!-- ko if: $root.graphConfig().hasField($data) -->
-                                                        <button data-bind="click: function(){$root.graphConfig().removeField($data)}, disabled: !Setting.findValue(Setting.ALLOW_SET_KEY_PARAMETER), eagleTooltip:'Remove Field from Graph Config', style:{'visibility':'visible'}, clickBubble:false">
+                                                        <!-- ko if: $root.currentConfig().hasField($data) -->
+                                                        <button data-bind="click: function(){$root.currentConfig().removeField($data)}, disabled: !Setting.findValue(Setting.ALLOW_SET_KEY_PARAMETER), eagleTooltip:'Remove Field from Graph Config', style:{'visibility':'visible'}, clickBubble:false">
                                                             <i class="material-icons">favorite</i>
                                                         </button>
                                                         <!-- /ko -->
@@ -301,7 +301,7 @@ <h5 class="modal-title" id="parameterTableModalTitle">Fields Table: <span data-b
                                                 <button class="parameterTableCommentBtn icon-pencil" data-bind="click:function(data,event){ParameterTable.requestEditCommentInModal($data)}"></button>
                                             </td>
                                             <td class='columnCell column_Remove'>
-                                                <button data-bind="click: function(){$root.graphConfig().removeField($data)}, disabled: !Setting.findValue(Setting.ALLOW_SET_KEY_PARAMETER), eagleTooltip:'Remove Field from Graph Config', clickBubble:false">
+                                                <button data-bind="click: function(){$root.currentConfig().removeField($data)}, disabled: !Setting.findValue(Setting.ALLOW_SET_KEY_PARAMETER), eagleTooltip:'Remove Field from Graph Config', clickBubble:false">
                                                     <i class="material-icons">remove</i>
                                                 </button>
                                             </td>

diff --git a/templates/translation_menu.html b/templates/translation_menu.html
@@ -250,16 +250,8 @@ <h5>
     </div>
 
     <div class="row mt-2">
-        <div class="alert alert-light noselect mb-1" role="alert">
-            <!-- ko if: currentConfig().numFields() === 0 -->
-                <span>No (or empty) Graph Config loaded.</span>
-            <!-- /ko -->
-            <!-- ko if: currentConfig().numFields() > 0 -->
-                <span>Graph Config overwrites</span>
-                <span data-bind="text: currentConfig().numFields()"></span>
-                <span>fields.</span>
-            <!-- /ko -->
-        </div>
+        <select id="currentConfigSelect" class="form-control" data-bind="options: logicalGraph().graphConfigs, optionsText: 'name'">
+        </select>
         <button class="btn btn-primary btn-block" type="button" data-bs-placement="bottom" data-bind="click: function(){ParameterTable.openModal(ParameterTable.Mode.GraphConfig, ParameterTable.SelectType.Normal)}, eagleTooltip: `Display Graph Configuration ` + Utils.getKeyboardShortcutTextByKey('open_graph_configuration_table_modal', true)">Open Graph Configuration</button>
     </div>
 </div>