Merge pull request #175 from arduino/feature/new-toolbar

Feature/new toolbar

Author: ubidefeo

backend/menu.js

@@ -1,10 +1,43 @@
 const { app, Menu } = require('electron')
+const { shortcuts, disableShortcuts } = require('./shortcuts.js')
 const path = require('path')
 const serial = require('./serial/serial.js').sharedInstance
 const openAboutWindow = require('about-window').default
-const shortcuts  = require('./shortcuts.js')
+
 const { type } = require('os')
 
+let appInfoWindow = null
+
+function closeAppInfo(win) {
+  disableShortcuts(win, false)
+  appInfoWindow.off('close', () => closeAppInfo(win))
+  appInfoWindow = null
+  
+}
+function openAppInfo(win) {
+  if (appInfoWindow != null) {
+    appInfoWindow.show()
+  } else {
+    appInfoWindow = openAboutWindow({
+      icon_path: path.resolve(__dirname, '../ui/arduino/media/about_image.png'),
+      css_path: path.resolve(__dirname, '../ui/arduino/views/about.css'),
+      copyright: '© Arduino SA 2022',
+      package_json_dir: path.resolve(__dirname, '..'),
+      bug_report_url: "https://github.com/arduino/lab-micropython-editor/issues",
+      bug_link_text: "report an issue",
+      homepage: "https://labs.arduino.cc",
+      use_version_info: false,
+      win_options: {
+          parent: win,
+          modal: true,
+      },
+      show_close_button: 'Close',
+    })
+    appInfoWindow.on('close', () => closeAppInfo(win));
+    disableShortcuts(win, true)
+  }
+}
+
 module.exports = function registerMenu(win, state = {}) {
   const isMac = process.platform === 'darwin'
   const template = [
@@ -22,7 +55,22 @@ module.exports = function registerMenu(win, state = {}) {
     {
       label: 'File',
       submenu: [
-        isMac ? { role: 'close' } : { role: 'quit' }
+        { label: 'New', 
+          accelerator: shortcuts.menu.NEW,
+          enabled: state.view === 'editor',
+          click: () => win.webContents.send('shortcut-cmd', shortcuts.global.NEW)
+        },
+        { label: 'Save', 
+          accelerator: shortcuts.menu.SAVE,
+          enabled: state.view === 'editor',
+          click: () => win.webContents.send('shortcut-cmd', shortcuts.global.SAVE)
+        },
+        { label: 'Close tab',
+          accelerator: 'CmdOrCtrl+W',
+          enabled: state.view === 'editor',
+          click: () => win.webContents.send('shortcut-cmd', shortcuts.global.CLOSE)
+         },
+        { role: 'quit' }
       ]
     },
     {
@@ -166,40 +214,14 @@ module.exports = function registerMenu(win, state = {}) {
         },
         {
           label:'About Arduino Lab for MicroPython',
-          click: () => {
-              openAboutWindow({
-                  icon_path: path.resolve(__dirname, '../ui/arduino/media/about_image.png'),
-                  css_path: path.resolve(__dirname, '../ui/arduino/views/about.css'),
-                  copyright: '© Arduino SA 2022',
-                  package_json_dir: path.resolve(__dirname, '..'),
-                  bug_report_url: "https://github.com/arduino/lab-micropython-editor/issues",
-                  bug_link_text: "report an issue",
-                  homepage: "https://labs.arduino.cc",
-                  use_version_info: false,
-                  win_options: {
-                      parent: win,
-                      modal: true,
-                  },
-                  show_close_button: 'Close',
-              })
-            }
+          click: () => { openAppInfo(win) }
         },
       ]
     }
   ]
 
   const menu = Menu.buildFromTemplate(template)
 
-  app.setAboutPanelOptions({
-    applicationName: app.name,
-    applicationVersion: app.getVersion(),
-    copyright: app.copyright,
-    credits: '(See "Info about this app" in the Help menu)',
-    authors: ['Arduino'],
-    website: 'https://arduino.cc',
-    iconPath: path.join(__dirname, '../assets/image.png'),
-  })
-
   Menu.setApplicationMenu(menu)
 
 }

backend/shortcuts.js

@@ -1,29 +1,46 @@
-module.exports = {
+const { globalShortcut } = require('electron')
+let shortcutsActive = false
+const shortcuts = {
   global: {
+    CLOSE: 'CommandOrControl+W',
     CONNECT: 'CommandOrControl+Shift+C',
     DISCONNECT: 'CommandOrControl+Shift+D',
-    SAVE: 'CommandOrControl+S',
     RUN: 'CommandOrControl+R',
     RUN_SELECTION: 'CommandOrControl+Alt+R',
     RUN_SELECTION_WL: 'CommandOrControl+Alt+S',
     STOP: 'CommandOrControl+H',
     RESET: 'CommandOrControl+Shift+R',
+    NEW: 'CommandOrControl+N',
+    SAVE: 'CommandOrControl+S',
     CLEAR_TERMINAL: 'CommandOrControl+L',
     EDITOR_VIEW: 'CommandOrControl+Alt+1',
     FILES_VIEW: 'CommandOrControl+Alt+2',
-    ESC: 'Escape'
   },
   menu: {
+    CLOSE: 'CmdOrCtrl+W',
     CONNECT: 'CmdOrCtrl+Shift+C',
     DISCONNECT: 'CmdOrCtrl+Shift+D',
-    SAVE: 'CmdOrCtrl+S',
     RUN: 'CmdOrCtrl+R',
     RUN_SELECTION: 'CmdOrCtrl+Alt+R',
     RUN_SELECTION_WL: 'CmdOrCtrl+Alt+S',
     STOP: 'CmdOrCtrl+H',
     RESET: 'CmdOrCtrl+Shift+R',
+    NEW: 'CmdOrCtrl+N',
+    SAVE: 'CmdOrCtrl+S',
     CLEAR_TERMINAL: 'CmdOrCtrl+L',
     EDITOR_VIEW: 'CmdOrCtrl+Alt+1',
     FILES_VIEW: 'CmdOrCtrl+Alt+2'
-  }
+  },
+  // Shortcuts
+}
+
+function disableShortcuts (win, value) {
+  console.log(value ? 'disabling' : 'enabling', 'shortcuts')
+  win.send('ignore-shortcuts', value)
+}
+
+module.exports = {
+  shortcuts,
+  disableShortcuts
 }
+

index.js

@@ -1,8 +1,6 @@
 const { app, BrowserWindow, ipcMain, dialog, globalShortcut } = require('electron')
 const path = require('path')
 const fs = require('fs')
-const shortcuts = require('./backend/shortcuts.js').global
-
 const registerIPCHandlers = require('./backend/ipc.js')
 const registerMenu = require('./backend/menu.js')
 
@@ -63,28 +61,15 @@ function createWindow () {
   })
 }
 
-function shortcutAction(key) {
-  win.webContents.send('shortcut-cmd', key);
-}
-
-// Shortcuts
-function registerShortcuts() {
-  Object.entries(shortcuts).forEach(([command, shortcut]) => {
-    globalShortcut.register(shortcut, () => {
-      shortcutAction(shortcut)
-    });
-  })
-}
-
 app.on('ready', () => {
   createWindow()
-  registerShortcuts()
 
   win.on('focus', () => {
-    registerShortcuts()
+    console.log("win focus")
   })
+
   win.on('blur', () => {
-    globalShortcut.unregisterAll()
+    console.log("win blur")
   })
 
-})
+})

preload.js

@@ -1,7 +1,7 @@
 console.log('preload')
 const { contextBridge, ipcRenderer } = require('electron')
 const path = require('path')
-const shortcuts = require('./backend/shortcuts.js').global
+const shortcuts = require('./backend/shortcuts.js').shortcuts.global
 const { emit, platform } = require('process')
 const SerialBridge = require('./backend/serial/serial-bridge.js')
 
@@ -63,6 +63,11 @@ const Window = {
       callback(k);
     })
   },
+  onDisableShortcuts: (callback, value) => {
+    ipcRenderer.on('ignore-shortcuts', (e, value) => {
+      callback(value);
+    })
+  },
 
   beforeClose: (callback) => ipcRenderer.on('check-before-close', callback),
   confirmClose: () => ipcRenderer.invoke('confirm-close'),

ui/arduino/index.html

@@ -25,6 +25,7 @@
     <!-- Components -->
     <script type="text/javascript" src="views/components/code-editor.js" charset="utf-8"></script>
     <script type="text/javascript" src="views/components/connection-dialog.js" charset="utf-8"></script>
+    <script type="text/javascript" src="views/components/new-file-dialog.js" charset="utf-8"></script>
     <script type="text/javascript" src="views/components/file-actions.js" charset="utf-8"></script>
     <script type="text/javascript" src="views/components/file-list.js" charset="utf-8"></script>
     <script type="text/javascript" src="views/components/repl-panel.js" charset="utf-8"></script>