allow menu bar to be set in the settings

Author: richardtks

browser/main/Main.js

@@ -172,10 +172,21 @@ class Main extends React.Component {
     delete CodeMirror.keyMap.emacs['Ctrl-V']
 
     eventEmitter.on('editor:fullscreen', this.toggleFullScreen)
+    eventEmitter.on('menubar:togglemenubar', this.toggleMenuBarVisible.bind(this))
   }
 
   componentWillUnmount () {
     eventEmitter.off('editor:fullscreen', this.toggleFullScreen)
+    eventEmitter.off('menubar:togglemenubar', this.toggleMenuBarVisible.bind(this))
+  }
+
+  toggleMenuBarVisible () {
+    const { config } = this.props
+    const { ui } = config
+
+    const newUI = Object.assign(ui, {showMenuBar: !ui.showMenuBar})
+    const newConfig = Object.assign(config, newUI)
+    ConfigManager.set(newConfig)
   }
 
   handleLeftSlideMouseDown (e) {

browser/main/lib/ConfigManager.js

@@ -26,14 +26,16 @@ export const DEFAULT_CONFIG = {
     toggleMain: OSX ? 'Command + Alt + L' : 'Super + Alt + E',
     toggleMode: OSX ? 'Command + Alt + M' : 'Ctrl + M',
     deleteNote: OSX ? 'Command + Shift + Backspace' : 'Ctrl + Shift + Backspace',
-    pasteSmartly: OSX ? 'Command + Shift + V' : 'Ctrl + Shift + V'
+    pasteSmartly: OSX ? 'Command + Shift + V' : 'Ctrl + Shift + V',
+    toggleMenuBar: 'Alt'
   },
   ui: {
     language: 'en',
     theme: 'default',
     showCopyNotification: true,
     disableDirectWrite: false,
-    defaultNote: 'ALWAYS_ASK' // 'ALWAYS_ASK', 'SNIPPET_NOTE', 'MARKDOWN_NOTE'
+    defaultNote: 'ALWAYS_ASK', // 'ALWAYS_ASK', 'SNIPPET_NOTE', 'MARKDOWN_NOTE'
+    showMenuBar: false
   },
   editor: {
     theme: 'base16-light',

browser/main/lib/shortcut.js

@@ -6,5 +6,8 @@ module.exports = {
   },
   'deleteNote': () => {
     ee.emit('hotkey:deletenote')
+  },
+  'toggleMenuBar': () => {
+    ee.emit('menubar:togglemenubar')
   }
 }

browser/main/modals/PreferencesModal/HotkeyTab.js

@@ -80,7 +80,8 @@ class HotkeyTab extends React.Component {
       toggleMain: this.refs.toggleMain.value,
       toggleMode: this.refs.toggleMode.value,
       deleteNote: this.refs.deleteNote.value,
-      pasteSmartly: this.refs.pasteSmartly.value
+      pasteSmartly: this.refs.pasteSmartly.value,
+      toggleMenuBar: this.refs.toggleMenuBar.value
     }
     this.setState({
       config
@@ -128,6 +129,17 @@ class HotkeyTab extends React.Component {
               />
             </div>
           </div>
+          <div styleName='group-section'>
+            <div styleName='group-section-label'>{i18n.__('Show/Hide Menu Bar')}</div>
+            <div styleName='group-section-control'>
+              <input styleName='group-section-control-input'
+                onChange={(e) => this.handleHotkeyChange(e)}
+                ref='toggleMenuBar'
+                value={config.hotkey.toggleMenuBar}
+                type='text'
+              />
+            </div>
+          </div>
           <div styleName='group-section'>
             <div styleName='group-section-label'>{i18n.__('Toggle Editor Mode')}</div>
             <div styleName='group-section-control'>

browser/main/modals/PreferencesModal/UiTab.js

@@ -75,6 +75,7 @@ class UiTab extends React.Component {
         showTagsAlphabetically: this.refs.showTagsAlphabetically.checked,
         saveTagsAlphabetically: this.refs.saveTagsAlphabetically.checked,
         enableLiveNoteCounts: this.refs.enableLiveNoteCounts.checked,
+        showMenuBar: this.refs.showMenuBar.checked,
         disableDirectWrite: this.refs.uiD2w != null
           ? this.refs.uiD2w.checked
           : false
@@ -238,6 +239,16 @@ class UiTab extends React.Component {
             </div>
           </div>
 
+          <div styleName='group-checkBoxSection'>
+            <label>
+              <input onChange={(e) => this.handleUIChange(e)}
+                checked={this.state.config.ui.showMenuBar}
+                ref='showMenuBar'
+                type='checkbox'
+              />&nbsp;
+              {i18n.__('Show menu bar')}
+            </label>
+          </div>
           <div styleName='group-checkBoxSection'>
             <label>
               <input onChange={(e) => this.handleUIChange(e)}

lib/ipcServer.js

@@ -32,6 +32,7 @@ ipcMain.on('config-renew', (e, payload) => {
   globalShortcut.unregisterAll()
   var { config } = payload
 
+  mainWindow.setMenuBarVisibility(config.ui.showMenuBar)
   var errors = []
   try {
     globalShortcut.register(config.hotkey.toggleMain, toggleMainWindow)

lib/main-window.js

@@ -6,7 +6,6 @@ const Config = require('electron-config')
 const config = new Config()
 const _ = require('lodash')
 
-var showMenu = process.platform !== 'win32'
 const windowSize = config.get('windowsize') || {
   x: null,
   y: null,
@@ -22,7 +21,6 @@ const mainWindow = new BrowserWindow({
   useContentSize: true,
   minWidth: 500,
   minHeight: 320,
-  autoHideMenuBar: showMenu,
   webPreferences: {
     zoomFactor: 1.0,
     enableBlinkFeatures: 'OverlayScrollbars'
@@ -33,6 +31,7 @@ const mainWindow = new BrowserWindow({
 const url = path.resolve(__dirname, './main.html')
 
 mainWindow.loadURL('file://' + url)
+mainWindow.setMenuBarVisibility(false)
 
 mainWindow.webContents.on('new-window', function (e) {
   e.preventDefault()