From b2e05c925bca14777299dc675c260da353bdfd63 Mon Sep 17 00:00:00 2001 From: Jia Hao Date: Fri, 29 Jan 2016 22:04:41 +0800 Subject: [PATCH] Use ES6 syntax for placeholder app --- app/src/components/contextMenu/contextMenu.js | 12 +-- app/src/components/login/loginWindow.js | 10 +-- app/src/components/mainWindow/mainWindow.js | 80 +++++++++---------- app/src/components/menu/menu.js | 39 +++++---- app/src/helpers/helpers.js | 10 +-- app/src/main.js | 37 ++++----- app/src/static/login/login.js | 11 +-- app/src/static/preload.js | 29 ++++--- 8 files changed, 106 insertions(+), 122 deletions(-) diff --git a/app/src/components/contextMenu/contextMenu.js b/app/src/components/contextMenu/contextMenu.js index 9510452..637d478 100644 --- a/app/src/components/contextMenu/contextMenu.js +++ b/app/src/components/contextMenu/contextMenu.js @@ -1,25 +1,21 @@ import electron from 'electron'; -const Menu = electron.Menu; -const ipcMain = electron.ipcMain; -const shell = electron.shell; -const BrowserWindow = electron.BrowserWindow; +const {Menu, ipcMain, shell, BrowserWindow} = electron; 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; diff --git a/app/src/components/login/loginWindow.js b/app/src/components/login/loginWindow.js index ada1416..8de81b3 100644 --- a/app/src/components/login/loginWindow.js +++ b/app/src/components/login/loginWindow.js @@ -1,6 +1,6 @@ -var electron = require('electron'); -var BrowserWindow = electron.BrowserWindow; -var ipcMain = electron.ipcMain; +import electron from 'electron'; +import path from 'path'; +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; diff --git a/app/src/components/mainWindow/mainWindow.js b/app/src/components/mainWindow/mainWindow.js index 7f22218..6c54f30 100644 --- a/app/src/components/mainWindow/mainWindow.js +++ b/app/src/components/mainWindow/mainWindow.js @@ -1,16 +1,13 @@ -var path = require('path'); -var electron = require('electron'); -var windowStateKeeper = require('electron-window-state'); -var helpers = require('./../../helpers/helpers'); -var createMenu = require('./../menu/menu'); -var BrowserWindow = electron.BrowserWindow; -var shell = electron.shell; -const ipcMain = electron.ipcMain; -var isOSX = helpers.isOSX; -var linkIsInternal = helpers.linkIsInternal; - +import path from 'path'; +import electron from 'electron'; +import windowStateKeeper from 'electron-window-state'; +import helpers from './../../helpers/helpers'; +import createMenu from './../menu/menu'; 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*?)[\)]/; - var match = itemCountRegex.exec(mainWindow.getTitle()); + const itemCountRegex = /[\(](\d*?)[\)]/; + 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; diff --git a/app/src/components/menu/menu.js b/app/src/components/menu/menu.js index 5aedef9..fa57400 100644 --- a/app/src/components/menu/menu.js +++ b/app/src/components/menu/menu.js @@ -1,7 +1,4 @@ -var electron = require('electron'); -var Menu = electron.Menu; -var shell = electron.shell; -const clipboard = electron.clipboard; +import {Menu, shell, clipboard} from 'electron'; /** * @@ -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; diff --git a/app/src/helpers/helpers.js b/app/src/helpers/helpers.js index 1dcc2c9..ed8327f 100644 --- a/app/src/helpers/helpers.js +++ b/app/src/helpers/helpers.js @@ -1,5 +1,5 @@ -var wurl = require('wurl'); -var os = require('os'); +import wurl from 'wurl'; +import os from 'os'; function isOSX() { return os.platform() === 'darwin'; @@ -11,7 +11,7 @@ function linkIsInternal(currentUrl, newUrl) { return currentDomain === newDomain; } -module.exports = { - isOSX: isOSX, - linkIsInternal: linkIsInternal +export default { + isOSX, + linkIsInternal }; diff --git a/app/src/main.js b/app/src/main.js index 7cc5f10..de07a90 100644 --- a/app/src/main.js +++ b/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'); -var path = require('path'); -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, ipcMain} = electron; +const {isOSX} = helpers; 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; } diff --git a/app/src/static/login/login.js b/app/src/static/login/login.js index 1875a17..78fbb67 100644 --- a/app/src/static/login/login.js +++ b/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; - var password = document.getElementById('password-input').value; + const username = document.getElementById('username-input').value; + const password = document.getElementById('password-input').value; ipcRenderer.send('login-message', [username, password]); }); diff --git a/app/src/static/preload.js b/app/src/static/preload.js index bcb07dd..91001c5 100644 --- a/app/src/static/preload.js +++ b/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; -var webFrame = electron.webFrame; +const {ipcRenderer, webFrame} = electron; -setNotificationCallback(function(title, opt) { - ipc.send('notification', title, opt); +setNotificationCallback((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) { - var appArgs = JSON.parse(message); +ipcRenderer.on('params', (event, 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; - var newNotify = function(title, opt) { + const OldNotify = window.Notification; + 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; } });