Merge pull request #111 from loeck/master

Add menu for open Dev Tools and Chrome Dev Tools

README.md

@@ -11,6 +11,7 @@
 
 ```
 SENTRY_URL=http://...
+DEV_TOOLS_MODE=right|bottom|undocked|detach
 ```
 
 #### Install dependencies

package.json

@@ -112,7 +112,7 @@
     "babel-preset-stage-0": "^6.24.1",
     "chance": "^1.0.13",
     "concurrently": "^3.5.1",
-    "dotenv": "^5.0.0",
+    "dotenv-webpack": "^1.5.4",
     "electron": "1.8.2",
     "electron-builder": "^20.0.4",
     "electron-devtools-installer": "^2.2.3",

src/internals/index.js

@@ -5,7 +5,7 @@ import capitalize from 'lodash/capitalize'
 
 import cpuUsage from 'helpers/cpuUsage'
 
-const { FORK_TYPE } = process.env
+const { FORK_TYPE, SENTRY_URL } = process.env
 
 process.title = `${require('../../package.json').productName} ${capitalize(FORK_TYPE)}` // eslint-disable-line global-require
 
@@ -13,10 +13,10 @@ function sendEvent(type: string, data: any, options: Object = { kill: true }) {
   process.send({ type, data, options })
 }
 
-if (__PROD__ && __SENTRY_URL__) {
+if (__PROD__ && SENTRY_URL) {
   const Raven = require('raven') // eslint-disable-line global-require
   const ravenConfig = { captureUnhandledRejections: true }
-  Raven.config(__SENTRY_URL__, ravenConfig).install()
+  Raven.config(SENTRY_URL, ravenConfig).install()
 }
 
 // $FlowFixMe

src/main/app.js

@@ -24,6 +24,16 @@ const getWindowPosition = (height, width, display = screen.getPrimaryDisplay())
   }
 }
 
+const handleCloseWindow = w => e => {
+  if (!forceClose) {
+    e.preventDefault()
+
+    if (w !== null) {
+      w.hide()
+    }
+  }
+}
+
 const getDefaultUrl = () =>
   __DEV__
     ? `http://localhost:${process.env.ELECTRON_WEBPACK_WDS_PORT || ''}`
@@ -89,22 +99,16 @@ function createMainWindow() {
   const url = getDefaultUrl()
 
   if (devTools) {
-    window.webContents.openDevTools()
+    window.webContents.openDevTools({
+      mode: process.env.DEV_TOOLS_MODE,
+    })
   }
 
   saveWindowSettings(window)
 
   window.loadURL(url)
 
-  window.on('close', e => {
-    if (!forceClose) {
-      e.preventDefault()
-
-      if (mainWindow !== null) {
-        mainWindow.hide()
-      }
-    }
-  })
+  window.on('close', handleCloseWindow(window))
 
   window.webContents.on('devtools-opened', () => {
     window.focus()
@@ -120,16 +124,16 @@ function createDevWindow() {
   const MIN_HEIGHT = 500
   const MIN_WIDTH = 360
 
-  const savedDimensions = db.getIn('settings', 'window.DevWindow.dimensions', {})
   const savedPositions = db.getIn('settings', 'window.DevWindow.positions', null)
 
-  const width = savedDimensions.width || MIN_WIDTH
-  const height = savedDimensions.height || MIN_HEIGHT
+  const width = MIN_WIDTH
+  const height = MIN_HEIGHT
 
   const windowOptions = {
     ...defaultWindowOptions,
     ...(savedPositions !== null ? savedPositions : {}),
     fullscreenable: false,
+    resizable: false,
     height,
     minHeight: MIN_HEIGHT,
     minWidth: MIN_WIDTH,
@@ -149,6 +153,8 @@ function createDevWindow() {
 
   window.loadURL(`${url}/#/dev`)
 
+  window.on('close', handleCloseWindow(window))
+
   window.on('ready-to-show', () => {
     window.show()
   })

src/main/index.js

@@ -9,8 +9,10 @@ require('./app')
 
 setImmediate(() => require('./bridge')) // eslint-disable-line global-require
 
-if (__PROD__ && __SENTRY_URL__) {
+const { SENTRY_URL } = process.env
+
+if (__PROD__ && SENTRY_URL) {
   const Raven = require('raven') // eslint-disable-line global-require
   const ravenConfig = { captureUnhandledRejections: true }
-  Raven.config(__SENTRY_URL__, ravenConfig).install()
+  Raven.config(SENTRY_URL, ravenConfig).install()
 }

src/main/menu.js

@@ -1,8 +1,11 @@
-import { app, Menu } from 'electron'
+import { BrowserWindow, app, Menu } from 'electron'
+
+const props = (predicate, values, defaultValue = {}) => (predicate ? values : defaultValue)
 
 const template = [
-  ...(process.platform === 'darwin'
-    ? [
+  ...props(
+    process.platform === 'darwin',
+    [
       {
         label: app.getName(),
         submenu: [
@@ -13,18 +16,54 @@ const template = [
           { role: 'quit' },
         ],
       },
+    ],
+    [],
+  ),
+  ...props(process.platform === 'darwin' || __DEV__, [
     {
       role: 'window',
       submenu: [
+        ...props(
+          __DEV__,
+          [
+            {
+              label: 'App Dev Tools',
+              click() {
+                const devWindow = BrowserWindow.getAllWindows().find(w => w.name === 'DevWindow')
+                if (devWindow) {
+                  devWindow.show()
+                }
+              },
+            },
+            {
+              label: 'Main Window Dev Tools',
+              click() {
+                const mainWindow = BrowserWindow.getAllWindows().find(w => w.name === 'MainWindow')
+                if (mainWindow) {
+                  mainWindow.openDevTools({
+                    mode: process.env.DEV_TOOLS_MODE,
+                  })
+                }
+              },
+            },
+            { type: 'separator' },
+          ],
+          [],
+        ),
+        ...props(
+          process.platform === 'darwin',
+          [
             { role: 'close' },
             { role: 'minimize' },
             { role: 'zoom' },
             { type: 'separator' },
             { role: 'front' },
           ],
+          [],
+        ),
+      ],
     },
-      ]
-    : []),
+  ]),
 ]
 
 export default Menu.buildFromTemplate(template)

src/renderer/index.js

@@ -23,8 +23,10 @@ import App from 'components/App'
 
 import 'styles/global'
 
-if (__PROD__ && __SENTRY_URL__) {
-  Raven.config(__SENTRY_URL__, { allowSecretKey: true }).install()
+const { SENTRY_URL } = process.env
+
+if (__PROD__ && SENTRY_URL) {
+  Raven.config(SENTRY_URL, { allowSecretKey: true }).install()
   window.addEventListener('unhandledrejection', event => Raven.captureException(event.reason))
 }
 

webpack/plugins.js

@@ -1,13 +1,13 @@
-require('dotenv').config()
 const webpack = require('webpack')
+const Dotenv = require('dotenv-webpack')
 
 require('../src/globals')
 
 module.exports = [
+  new Dotenv(),
   new webpack.DefinePlugin({
     __DEV__,
     __PROD__,
-    __SENTRY_URL__: JSON.stringify(process.env.SENTRY_URL),
     'process.env.NODE_ENV': JSON.stringify(__ENV__),
   }),
 ]