Use ES6 syntax for placeholder app

app/src/components/contextMenu/contextMenu.js

@@ -1,25 +1,21 @@
 import electron from 'electron';
-const Menu = electron.Menu;
+const {Menu, ipcMain, shell, BrowserWindow} = electron;
-const ipcMain = electron.ipcMain;
-const shell = electron.shell;
-const BrowserWindow = electron.BrowserWindow;
 
 function initContextMenu(mainWindow) {
-    ipcMain.on('contextMenuOpened', function(event, targetHref) {
+    ipcMain.on('contextMenuOpened', (event, targetHref) => {
         const contextMenuTemplate = [
             {
                 label: 'Open in default browser',
-                click: function() {
+                click: () => {
                     if (targetHref) {
                         shell.openExternal(targetHref);
                         return;
                     }
-
                 }
             },
             {
                 label: 'Open in new window',
-                click: function() {
+                click: () => {
                     if (targetHref) {
                         new BrowserWindow().loadURL(targetHref);
                         return;

app/src/components/login/loginWindow.js

@@ -1,6 +1,6 @@
-var electron = require('electron');
+import electron from 'electron';
-var BrowserWindow = electron.BrowserWindow;
+import path from 'path';
-var ipcMain = electron.ipcMain;
+const {BrowserWindow, ipcMain} = electron;
 
 function createLoginWindow(loginCallback) {
     var loginWindow = new BrowserWindow({
@@ -9,7 +9,7 @@ function createLoginWindow(loginCallback) {
         frame: false,
         resizable: false
     });
-    loginWindow.loadURL('file://' + __dirname + '/static/login/login.html');
+    loginWindow.loadURL('file://' + path.join(__dirname, '/static/login/login.html'));
 
     ipcMain.once('login-message', function(event, usernameAndPassword) {
         loginCallback(usernameAndPassword[0], usernameAndPassword[1]);
@@ -18,4 +18,4 @@ function createLoginWindow(loginCallback) {
     return loginWindow;
 }
 
-module.exports = createLoginWindow;
+export default createLoginWindow;

app/src/components/mainWindow/mainWindow.js

@@ -1,16 +1,13 @@
-var path = require('path');
+import path from 'path';
-var electron = require('electron');
+import electron from 'electron';
-var windowStateKeeper = require('electron-window-state');
+import windowStateKeeper from 'electron-window-state';
-var helpers = require('./../../helpers/helpers');
+import helpers from './../../helpers/helpers';
-var createMenu = require('./../menu/menu');
+import createMenu from './../menu/menu';
-var BrowserWindow = electron.BrowserWindow;
-var shell = electron.shell;
-const ipcMain = electron.ipcMain;
-var isOSX = helpers.isOSX;
-var linkIsInternal = helpers.linkIsInternal;
-
 import initContextMenu from './../contextMenu/contextMenu';
 
+const {BrowserWindow, shell, ipcMain} = electron;
+const {isOSX, linkIsInternal} = helpers;
+
 const ZOOM_INTERVAL = 0.1;
 
 /**
@@ -21,38 +18,38 @@ const ZOOM_INTERVAL = 0.1;
  * @returns {electron.BrowserWindow}
  */
 function createMainWindow(options, onAppQuit, setDockBadge) {
-    var mainWindowState = windowStateKeeper({
+    const mainWindowState = windowStateKeeper({
         defaultWidth: options.width || 1280,
         defaultHeight: options.height || 800
     });
-    var mainWindow = new BrowserWindow(
-        {
-            width: mainWindowState.width,
-            height: mainWindowState.height,
-            x: mainWindowState.x,
-            y: mainWindowState.y,
-            'auto-hide-menu-bar': !options.showMenuBar,
-            // Convert dashes to spaces because on linux the app name is joined with dashes
-            title: options.name.replace(/-/g, ' '),
-            'web-preferences': {
-                javascript: true,
-                plugins: true,
-                nodeIntegration: false,
-                preload: path.join(__dirname, 'static', 'preload.js')
-            },
-            // after webpack path here should reference `resources/app/`
-            icon: path.join(__dirname, '../', '/icon.png')
-        }
-    );
 
-    var currentZoom = 1;
+    const mainWindow = new BrowserWindow({
+        width: mainWindowState.width,
+        height: mainWindowState.height,
+        x: mainWindowState.x,
+        y: mainWindowState.y,
+        'auto-hide-menu-bar': !options.showMenuBar,
+        // Convert dashes to spaces because on linux the app name is joined with dashes
+        title: options.name.replace(/-/g, ' '),
+        'web-preferences': {
+            javascript: true,
+            plugins: true,
+            // node globals causes problems with sites like messenger.com
+            nodeIntegration: false,
+            preload: path.join(__dirname, 'static', 'preload.js')
+        },
+        // after webpack path here should reference `resources/app/`
+        icon: path.join(__dirname, '../', '/icon.png')
+    });
 
-    var onZoomIn = function() {
+    let currentZoom = 1;
+
+    const onZoomIn = () => {
         currentZoom += ZOOM_INTERVAL;
         mainWindow.webContents.send('change-zoom', currentZoom);
     };
 
-    var onZoomOut = function() {
+    const onZoomOut = () => {
         currentZoom -= ZOOM_INTERVAL;
         mainWindow.webContents.send('change-zoom', currentZoom);
     };
@@ -64,30 +61,29 @@ function createMainWindow(options, onAppQuit, setDockBadge) {
         mainWindow.webContents.setUserAgent(options.userAgent);
     }
 
-    mainWindow.webContents.on('did-finish-load', function() {
+    mainWindow.webContents.on('did-finish-load', () => {
         mainWindow.webContents.send('params', JSON.stringify(options));
     });
 
     if (options.counter) {
-        mainWindow.on('page-title-updated', function() {
+        mainWindow.on('page-title-updated', () => {
             if (mainWindow.isFocused()) {
                 return;
             }
 
             if (options.counter) {
-                var itemCountRegex = /[\(](\d*?)[\)]/;
+                const itemCountRegex = /[\(](\d*?)[\)]/;
-                var match = itemCountRegex.exec(mainWindow.getTitle());
+                const match = itemCountRegex.exec(mainWindow.getTitle());
                 if (match) {
                     setDockBadge(match[1]);
                 }
                 return;
             }
-
             setDockBadge('●');
         });
     }
 
-    mainWindow.webContents.on('new-window', function(event, urlToGo) {
+    mainWindow.webContents.on('new-window', (event, urlToGo) => {
         if (mainWindow.useDefaultWindowBehaviour) {
             mainWindow.useDefaultWindowBehaviour = false;
             return;
@@ -102,7 +98,7 @@ function createMainWindow(options, onAppQuit, setDockBadge) {
 
     mainWindow.loadURL(options.targetUrl);
 
-    mainWindow.on('focus', function() {
+    mainWindow.on('focus', () => {
         setDockBadge('');
     });
 
@@ -134,4 +130,4 @@ function maybeHideWindow(window, event) {
     // will close the window on other platforms
 }
 
-module.exports = createMainWindow;
+export default createMainWindow;

app/src/components/menu/menu.js

@@ -1,7 +1,4 @@
-var electron = require('electron');
+import {Menu, shell, clipboard} from 'electron';
-var Menu = electron.Menu;
-var shell = electron.shell;
-const clipboard = electron.clipboard;
 
 /**
  *
@@ -18,7 +15,7 @@ function createMenu(nativefierVersion, onQuit, onGoBack, onGoForward, onZoomIn,
         return;
     }
 
-    var template = [
+    const template = [
         {
             label: 'Edit',
             submenu: [
@@ -70,20 +67,20 @@ function createMenu(nativefierVersion, onQuit, onGoBack, onGoForward, onZoomIn,
             submenu: [
                 {
                     label: 'Back',
-                    click: function() {
+                    click: () => {
                         onGoBack();
                     }
                 },
                 {
                     label: 'Forward',
-                    click: function() {
+                    click: () => {
                         onGoForward();
                     }
                 },
                 {
                     label: 'Reload',
                     accelerator: 'CmdOrCtrl+R',
-                    click: function(item, focusedWindow) {
+                    click: (item, focusedWindow) => {
                         if (focusedWindow) {
                             focusedWindow.reload();
                         }
@@ -94,13 +91,13 @@ function createMenu(nativefierVersion, onQuit, onGoBack, onGoForward, onZoomIn,
                 },
                 {
                     label: 'Toggle Full Screen',
-                    accelerator: (function() {
+                    accelerator: (() => {
                         if (process.platform === 'darwin') {
                             return 'Ctrl+Command+F';
                         }
                         return 'F11';
                     })(),
-                    click: function(item, focusedWindow) {
+                    click: (item, focusedWindow) => {
                         if (focusedWindow) {
                             focusedWindow.setFullScreen(!focusedWindow.isFullScreen());
                         }
@@ -108,37 +105,37 @@ function createMenu(nativefierVersion, onQuit, onGoBack, onGoForward, onZoomIn,
                 },
                 {
                     label: 'Zoom In',
-                    accelerator: (function() {
+                    accelerator: (() => {
                         if (process.platform === 'darwin') {
                             return 'Command+=';
                         }
                         return 'Ctrl+=';
                     })(),
-                    click: function() {
+                    click: () => {
                         onZoomIn();
                     }
                 },
                 {
                     label: 'Zoom Out',
-                    accelerator: (function() {
+                    accelerator: (() => {
                         if (process.platform === 'darwin') {
                             return 'Command+-';
                         }
                         return 'Ctrl+-';
                     })(),
-                    click: function() {
+                    click: () => {
                         onZoomOut();
                     }
                 },
                 {
                     label: 'Toggle Window Developer Tools',
-                    accelerator: (function() {
+                    accelerator: (() => {
                         if (process.platform === 'darwin') {
                             return 'Alt+Command+I';
                         }
                         return 'Ctrl+Shift+I';
                     })(),
-                    click: function(item, focusedWindow) {
+                    click: (item, focusedWindow) => {
                         if (focusedWindow) {
                             focusedWindow.toggleDevTools();
                         }
@@ -168,13 +165,13 @@ function createMenu(nativefierVersion, onQuit, onGoBack, onGoForward, onZoomIn,
             submenu: [
                 {
                     label: `Built with Nativefier v${nativefierVersion}`,
-                    click: function() {
+                    click: () => {
                         shell.openExternal('https://github.com/jiahaog/nativefier');
                     }
                 },
                 {
                     label: 'Report an Issue',
-                    click: function() {
+                    click: () => {
                         shell.openExternal('https://github.com/jiahaog/nativefier/issues');
                     }
                 }
@@ -214,7 +211,7 @@ function createMenu(nativefierVersion, onQuit, onGoBack, onGoForward, onZoomIn,
                 {
                     label: 'Quit',
                     accelerator: 'Command+Q',
-                    click: function() {
+                    click: () => {
                         onQuit();
                     }
                 }
@@ -231,8 +228,8 @@ function createMenu(nativefierVersion, onQuit, onGoBack, onGoForward, onZoomIn,
         );
     }
 
-    var menu = Menu.buildFromTemplate(template);
+    const menu = Menu.buildFromTemplate(template);
     Menu.setApplicationMenu(menu);
 }
 
-module.exports = createMenu;
+export default createMenu;

app/src/helpers/helpers.js

@@ -1,5 +1,5 @@
-var wurl = require('wurl');
+import wurl from 'wurl';
-var os = require('os');
+import os from 'os';
 
 function isOSX() {
     return os.platform() === 'darwin';
@@ -11,7 +11,7 @@ function linkIsInternal(currentUrl, newUrl) {
     return currentDomain === newDomain;
 }
 
-module.exports = {
+export default {
-    isOSX: isOSX,
+    isOSX,
-    linkIsInternal: linkIsInternal
+    linkIsInternal
 };

app/src/main.js

@@ -1,24 +1,19 @@
-/**
- * Created by JiaHao on 4/7/15.
- */
-
 import 'source-map-support/register';
+import fs from 'fs';
+import path from 'path';
+import electron from 'electron';
+import createLoginWindow from './components/login/loginWindow';
+import createMainWindow from './components/mainWindow/mainWindow';
+import helpers from './helpers/helpers';
 
-var fs = require('fs');
+const {app, ipcMain} = electron;
-var path = require('path');
+const {isOSX} = helpers;
-var electron = require('electron');
-var createMainWindow = require('./components/mainWindow/mainWindow');
-var createLoginWindow = require('./components/login/loginWindow');
-var helpers = require('./helpers/helpers');
-var app = electron.app;
-var ipcMain = electron.ipcMain;
-var isOSX = helpers.isOSX;
 
 const APP_ARGS_FILE_PATH = path.join(__dirname, '..', 'nativefier.json');
 
-var appArgs = JSON.parse(fs.readFileSync(APP_ARGS_FILE_PATH, 'utf8'));
+const appArgs = JSON.parse(fs.readFileSync(APP_ARGS_FILE_PATH, 'utf8'));
 
-var mainWindow;
+let mainWindow;
 
 if (appArgs.insecure) {
     app.commandLine.appendSwitch('ignore-certificate-errors');
@@ -31,13 +26,13 @@ if (isOSX()) {
     setDockBadge = app.dock.setBadge;
 }
 
-app.on('window-all-closed', function() {
+app.on('window-all-closed', () => {
     if (!isOSX()) {
         app.quit();
     }
 });
 
-app.on('activate', function(event, hasVisibleWindows) {
+app.on('activate', (event, hasVisibleWindows) => {
     if (isOSX()) {
         // this is called when the dock is clicked
         if (!hasVisibleWindows) {
@@ -46,7 +41,7 @@ app.on('activate', function(event, hasVisibleWindows) {
     }
 });
 
-app.on('before-quit', function() {
+app.on('before-quit', () => {
     // not fired when the close button on the window is clicked
     if (isOSX()) {
         // need to force a quit as a workaround here to simulate the osx app hiding behaviour
@@ -58,17 +53,17 @@ app.on('before-quit', function() {
     }
 });
 
-app.on('ready', function() {
+app.on('ready', () => {
     mainWindow = createMainWindow(appArgs, app.quit, setDockBadge);
 });
 
-app.on('login', function(event, webContents, request, authInfo, callback) {
+app.on('login', (event, webContents, request, authInfo, callback) => {
     // for http authentication
     event.preventDefault();
     createLoginWindow(callback);
 });
 
-ipcMain.on('notification', function(event, title, opts) {
+ipcMain.on('notification', (event, title, opts) => {
     if (!isOSX() || mainWindow.isFocused()) {
         return;
     }

app/src/static/login/login.js

@@ -1,10 +1,11 @@
-var ipcRenderer = require('electron').ipcRenderer;
+import electron from 'electron';
+const {ipcRenderer} = electron;
 
-var form = document.getElementById('login-form');
+const form = document.getElementById('login-form');
 
-form.addEventListener('submit', function(event) {
+form.addEventListener('submit', event => {
     event.preventDefault();
-    var username = document.getElementById('username-input').value;
+    const username = document.getElementById('username-input').value;
-    var password = document.getElementById('password-input').value;
+    const password = document.getElementById('password-input').value;
     ipcRenderer.send('login-message', [username, password]);
 });

app/src/static/preload.js

@@ -2,39 +2,38 @@
  Preload file that will be executed in the renderer process
  */
 import electron from 'electron';
-var ipc = electron.ipcRenderer;
+const {ipcRenderer, webFrame} = electron;
-var webFrame = electron.webFrame;
 
-setNotificationCallback(function(title, opt) {
+setNotificationCallback((title, opt) => {
-    ipc.send('notification', title, opt);
+    ipcRenderer.send('notification', title, opt);
 });
 
-document.addEventListener('DOMContentLoaded', function(event) {
+document.addEventListener('DOMContentLoaded', event => {
     // do things
 
-    window.addEventListener('contextmenu', function(event) {
+    window.addEventListener('contextmenu', event => {
         event.preventDefault();
         const targetElement = event.srcElement;
         const targetHref = targetElement.href;
 
         if (!targetHref) {
-            ipc.once('contextMenuClosed', () => {
+            ipcRenderer.once('contextMenuClosed', () => {
                 clickSelector(event.target);
-                ipc.send('cancelNewWindowOverride');
+                ipcRenderer.send('cancelNewWindowOverride');
             });
         }
 
-        ipc.send('contextMenuOpened', targetHref);
+        ipcRenderer.send('contextMenuOpened', targetHref);
     }, false);
 
 });
 
-ipc.on('params', function(event, message) {
+ipcRenderer.on('params', (event, message) => {
-    var appArgs = JSON.parse(message);
+    const appArgs = JSON.parse(message);
     console.log('nativefier.json', appArgs);
 });
 
-ipc.on('change-zoom', function(event, message) {
+ipcRenderer.on('change-zoom', (event, message) => {
     webFrame.setZoomFactor(message);
 });
 
@@ -44,14 +43,14 @@ ipc.on('change-zoom', function(event, message) {
  */
 function setNotificationCallback(callback) {
 
-    var OldNotify = window.Notification;
+    const OldNotify = window.Notification;
-    var newNotify = function(title, opt) {
+    const newNotify = (title, opt) => {
         callback(title, opt);
         return new OldNotify(title, opt);
     };
     newNotify.requestPermission = OldNotify.requestPermission.bind(OldNotify);
     Object.defineProperty(newNotify, 'permission', {
-        get: function() {
+        get: () => {
             return OldNotify.permission;
         }
     });