Restore various default workspaces by using menu (betaflight#745)

* added menu (showed by Shift+W keys) to select and restore default workspaces

* Code style improvement

Co-authored-by: Mark Haslinghuis <[email protected]>

* Code style improvement

Co-authored-by: Mark Haslinghuis <[email protected]>

* Code style improvement

Co-authored-by: Mark Haslinghuis <[email protected]>

---------

Co-authored-by: Mark Haslinghuis <[email protected]>

Author: demvlad

index.html

@@ -437,6 +437,11 @@ <h4>Log sync</h4>
             <li class="log-workspace-panel">
                 <h4>Workspace</h4>
                 <div class="log-workspace-selection"></div>
+                <div class="flexDiv">
+                    <div class="selectWrapper">
+                        <div class="dropdown-content" id="default_workspaces_menu"></div>
+                    </div>
+                </div>
             </li>
         </ul>
         <div id="screenshot-frame" class="graph-row">
@@ -2517,6 +2522,13 @@ <h4 class="modal-title">Shortcut Keys</h4>
                                             <div class="description">Recall workspace/favourite stored in keys 0 through 9. Very fast graph configuration
                                                 swapping useful for comparing traces.</div>
                                         </li>
+                                        <li>
+                                            <span class="keys">
+                                                <div class="key">Shift</div>
+                                                <div class="key">W</div>
+                                            </span>
+                                            <div class="description">Show the menu to load default workspace</div>
+                                        </li>
                                     </ul>
                                     <ul>
                                         <li>
@@ -3199,7 +3211,6 @@ <h4 class="modal-title">Advanced User Settings</h4>
     <script src="/js/webm-writer/BlobBuffer.js"></script>
     <script src="/js/webm-writer/WebMWriter.js"></script>
     <script type="module" src="src/main.js"></script>
-
     <dialog class="dialogUpdate">
         <h3>Notice</h4>
         <div class="content">

src/main.js

@@ -16,6 +16,7 @@ import { SeekBar } from './seekbar.js';
 import { GpxExporter } from './gpx-exporter.js';
 import { CsvExporter } from './csv-exporter.js';
 import { WorkspaceSelection } from './workspace_selection.js';
+import { WorkspaceMenu } from './workspace_menu.js';
 import { GraphLegend } from './graph_legend.js';
 import { FlightLog } from './flightlog.js';
 import { FlightLogParser } from './flightlog_parser.js';
@@ -33,7 +34,6 @@ import {
 } from './tools.js';
 import { PrefStorage } from './pref_storage.js';
 import { makeScreenshot } from './screenshot.js';
-import defaultWorkspaceGraphConfigs from './workspaces-ctzsnooze.json';
 
 // TODO: this is a hack, once we move to web fix this
 globalThis.userSettings = null;
@@ -106,6 +106,7 @@ function BlackboxLogViewer() {
 
         graphLegend = null,
         workspaceSelection = null,
+        workspaceMenu = null,
         fieldPresenter = FlightLogFieldPresenter,
 
         hasVideo = false, hasLog = false, hasMarker = false, // add measure feature
@@ -1068,7 +1069,7 @@ function BlackboxLogViewer() {
             if (item) {
                 workspaceGraphConfigs = upgradeWorkspaceFormat(item);
             } else {
-                workspaceGraphConfigs = defaultWorkspaceGraphConfigs;
+                workspaceGraphConfigs = workspaceMenu.getDefaultWorkspace();
             }
         });
 
@@ -1083,6 +1084,8 @@ function BlackboxLogViewer() {
 
         workspaceSelection = new WorkspaceSelection($(".log-workspace-selection"), workspaceGraphConfigs, onSwitchWorkspace, onSaveWorkspace);
         onSwitchWorkspace(workspaceGraphConfigs, workspaceSelection);
+        
+        workspaceMenu = new WorkspaceMenu($("#default_workspaces_menu"), onSwitchWorkspace);
 
         prefs.get('log-legend-hidden', function(item) {
             if (item) {
@@ -1946,6 +1949,11 @@ function BlackboxLogViewer() {
                         }
                         e.preventDefault();
                     break;
+                    case "W".charCodeAt(0):
+                        if (e.shiftKey) {
+                            workspaceMenu.show();
+                        }
+                    break;
                     case "Z".charCodeAt(0): // Ctrl-Z key to toggle between last graph config and current one - undo
                         try {
                             if(e.ctrlKey) {

src/workspace_menu.js

@@ -0,0 +1,52 @@
+import ctzsnoozeWorkspace from './ws_ctzsnooze.json';
+import supaflyWorkspace from './ws_supafly.json';
+export function WorkspaceMenu(menuElem, onSwitchWorkspace) {
+    const workspace_menu = menuElem;
+
+    function hideMenu() {
+        workspace_menu.removeClass('show');
+        workspace_menu.empty();
+    }
+
+    function showMenu() {
+        workspace_menu.addClass('show');
+    }
+
+    this.show = function() {
+        let elem = $('<div class="titleDiv bottomBorder">SELECT WORKSPACE:</div>');
+        workspace_menu.append(elem);
+        elem = $('<div>Ctzsnooze</div>');
+        elem.click(1, ApplyWorkspace);
+        workspace_menu.append(elem);
+        elem = $('<div>SupaflyFPV</div>');
+        elem.click(2, ApplyWorkspace);
+        workspace_menu.append(elem);
+        elem = $('<div class="menu-button topBorder">Close</div>');
+        elem.click(ApplyWorkspace);
+        workspace_menu.append(elem);
+        showMenu();
+    };
+
+    function ApplyWorkspace (e) {
+        switch (e.data) {
+            case 1:
+                 onSwitchWorkspace(ctzsnoozeWorkspace, 1);
+            break;
+            case 2:
+                onSwitchWorkspace(supaflyWorkspace, 1);
+            break;
+        }
+        hideMenu();
+    }
+
+    $(document).keydown( function (e) {
+        if (e.which === 27 && workspace_menu.length > 0) {
+            e.preventDefault();
+            hideMenu();
+        }
+    });
+
+    this.getDefaultWorkspace = function() {
+        return ctzsnoozeWorkspace;
+    };
+}