From cfe9e7f995731a0861a7456acfd61515023f6943 Mon Sep 17 00:00:00 2001 From: Ruihui Yan Date: Mon, 10 Dec 2018 13:43:25 -0500 Subject: [PATCH] ESLinted --- src/config/actions.js | 37 +++++---- src/core/action-manager.js | 15 ++-- src/lib/notifications.js | 1 + src/main.js | 150 ++++++++++++++++++------------------ src/preload.js | 152 +++++++++++++++++-------------------- src/renderer.js | 97 ++++++++++++----------- 6 files changed, 216 insertions(+), 236 deletions(-) diff --git a/src/config/actions.js b/src/config/actions.js index d060e50..8bd7dd9 100644 --- a/src/config/actions.js +++ b/src/config/actions.js @@ -1,21 +1,20 @@ -const {app} = require("electron"); - -const providers = require("../ServiceProviders/providers"); -const fullscreenToggle = require("../lib/fullscreen-toggle"); +const { app } = require('electron') +const providers = require('../ServiceProviders/providers') +const fullscreenToggle = require('../lib/fullscreen-toggle') module.exports = { keys: [ { - key: "CommandOrControl+Shift+V", + key: 'CommandOrControl+Shift+V', action: (mainWin) => { return () => { - providers.run(mainWin); + providers.run(mainWin) } } }, { - key: "CommandOrControl+H+Q", + key: 'CommandOrControl+H+Q', action: (mainWin) => { return () => { app.quit() @@ -24,40 +23,40 @@ module.exports = { }, { - key: "CommandOrControl+Shift+1", + key: 'CommandOrControl+Shift+1', action: (mainWin) => { return () => { - mainWin.webContents.send("pause", "ping"); + mainWin.webContents.send('pause', 'ping') } } }, { - key: "CommandOrControl+Shift+2", + key: 'CommandOrControl+Shift+2', action: (mainWin) => { return () => { - mainWin.webContents.send("play", "ping"); + mainWin.webContents.send('play', 'ping') } } }, { - key: "Alt+Shift+F", + key: 'Alt+Shift+F', action: (mainWin) => { return () => { - fullscreenToggle(mainWin, false); + fullscreenToggle(mainWin, false) } } }, { - key: "CommandOrControl+Shift+T", + key: 'CommandOrControl+Shift+T', action: (mainWin) => { // toggles translucent mode return () => { - let translucency = 1; - if (mainWin.getOpacity() == 1) { - translucency = 0.7; + let translucency = 1 + if (mainWin.getOpacity() === 1) { + translucency = 0.7 } - mainWin.setOpacity(translucency); - mainWin.setIgnoreMouseEvents(translucency < 1); + mainWin.setOpacity(translucency) + mainWin.setIgnoreMouseEvents(translucency < 1) } } } diff --git a/src/core/action-manager.js b/src/core/action-manager.js index e160b8e..b31d3a2 100644 --- a/src/core/action-manager.js +++ b/src/core/action-manager.js @@ -1,25 +1,22 @@ const actions = require('../config/actions') -const {globalShortcut} = require("electron"); - +const { globalShortcut } = require('electron') /** * A global action manager, which is responsible for listening * actions that can be managed by H2 */ class ActionManager { - constructor(mainWin) { - this.actions = actions; - this.mainWin = mainWin; - this.globals = []; + constructor (mainWin) { + this.actions = actions + this.mainWin = mainWin + this.globals = [] } - applyActions() { + applyActions () { this.actions['keys'].forEach((key) => { - this.globals.push( globalShortcut.register(key.key, key.action(this.mainWin)) ) - }) } } diff --git a/src/lib/notifications.js b/src/lib/notifications.js index 9ec1898..ee9b40f 100644 --- a/src/lib/notifications.js +++ b/src/lib/notifications.js @@ -1,3 +1,4 @@ +/* global Notification */ module.exports = function (message, sound = true, onclick = null) { let notif = new Notification('H2', { body: message diff --git a/src/main.js b/src/main.js index 783dc31..d0b1363 100644 --- a/src/main.js +++ b/src/main.js @@ -5,21 +5,20 @@ const { BrowserWindow, globalShortcut, session, - ipcMain, - Notification -} = require("electron"); -const providers = require("./ServiceProviders/providers"); -const fullscreenToggle = require("./lib/fullscreen-toggle"); -const utils = require("./lib/util"); -const path = require("path"); -const ActionManager = require("./core/action-manager") + ipcMain +} = require('electron') +const providers = require('./ServiceProviders/providers') +const fullscreenToggle = require('./lib/fullscreen-toggle') +const utils = require('./lib/util') +const path = require('path') +const ActionManager = require('./core/action-manager') // Keep a global reference of the window object, if you don't, the window will // be closed automatically when the JavaScript object is garbage collected. -let mainWindow; -let tray; +let mainWindow +let tray -function createWindow() { +function createWindow () { // create config let config = { width: 400, @@ -29,40 +28,40 @@ function createWindow() { plugins: true, preload: path.join(__dirname, 'preload.js') }, - titleBarStyle: "customButtonsOnHover", - }; + titleBarStyle: 'customButtonsOnHover' + } // Create the browser window. - mainWindow = new BrowserWindow(config); - mainWindow.setMenu(null); + mainWindow = new BrowserWindow(config) + mainWindow.setMenu(null) - if (process.platform == "darwin") app.dock.hide(); + if (process.platform === 'darwin') app.dock.hide() - mainWindow.setVisibleOnAllWorkspaces(true); - mainWindow.setFullScreenable(false); + mainWindow.setVisibleOnAllWorkspaces(true) + mainWindow.setFullScreenable(false) // and load the index.html of the app. - mainWindow.loadFile('src/index.html'); + mainWindow.loadFile('src/index.html') // mainWindow.loadURL('https://www.netflix.com') // Open the DevTools. - if (process.env.DEV==1) mainWindow.webContents.openDevTools(); + if (process.env.DEV === 1) mainWindow.webContents.openDevTools() // Emitted when the window is closed. - mainWindow.on("closed", function() { + mainWindow.on('closed', function () { // Dereference the window object, usually you would store windows // in an array if your app supports multi windows, this is the time // when you should delete the corresponding element. - mainWindow = null; - }); + mainWindow = null + }) // Disable new browser windows and popups - mainWindow.webContents.on("new-window", function(e, url) { - e.preventDefault(); - providers.run(mainWindow, url); - mainWindow.focus(); - }); + mainWindow.webContents.on('new-window', function (e, url) { + e.preventDefault() + providers.run(mainWindow, url) + mainWindow.focus() + }) let actionManager = new ActionManager(mainWindow) actionManager.applyActions() @@ -75,89 +74,90 @@ function createWindow() { } let createMenuTray = () => { - tray = new Tray(__dirname + "/assets/images/tray.png"); - + tray = new Tray(path.join(__dirname, 'assets/images/tray.png')) const trayMenus = [ - { role: "about" }, + { role: 'about' }, { - label: "Exit Fullscreen", - click() { - fullscreenToggle(mainWindow, true); + label: 'Exit Fullscreen', + click () { + fullscreenToggle(mainWindow, true) } }, { - label: "Quit", - click() { - app.quit(); + label: 'Quit', + click () { + app.quit() } }, { - label: "Bring H2 to the front", - click() { - utils.resetWindowToFloat(mainWindow); + label: 'Bring H2 to the front', + click () { + utils.resetWindowToFloat(mainWindow) } } - ]; + ] - const contextMenu = Menu.buildFromTemplate(trayMenus); + const contextMenu = Menu.buildFromTemplate(trayMenus) - tray.setToolTip("H2"); - tray.setContextMenu(contextMenu); - tray.setTitle("H2"); - tray.on("click", function(event) { - console.log("called"); - !mainWindow.isFocused() ? mainWindow.focus() : true; - }); -}; + tray.setToolTip('H2') + tray.setContextMenu(contextMenu) + tray.setTitle('H2') + tray.on('click', function (event) { + console.log('called') + if (!mainWindow.isFocused()) { + mainWindow.focus() + } + }) +} // This method will be called when Electron has finished // initialization and is ready to create browser windows. // Some APIs can only be used after this event occurs. -app.on("ready", () => { - session.defaultSession.clearStorageData(); - createWindow(); - utils.resetWindowToFloat(mainWindow); - createMenuTray(); -}); +app.on('ready', () => { + session.defaultSession.clearStorageData() + createWindow() + utils.resetWindowToFloat(mainWindow) + createMenuTray() +}) -app.on("will-quit", () => { +app.on('will-quit', () => { // Unregister all shortcuts. - globalShortcut.unregisterAll(); -}); + globalShortcut.unregisterAll() +}) // Quit when all windows are closed. -app.on("window-all-closed", function() { +app.on('window-all-closed', function () { // On OS X it is common for applications and their menu bar // to stay active until the user quits explicitly with Cmd + Q // if (process.platform !== 'darwin') { - app.quit(); + app.quit() // } -}); +}) // Unregister all shortcuts. -app.on("will-quit", () => { - globalShortcut.unregisterAll(); -}); +app.on('will-quit', () => { + globalShortcut.unregisterAll() +}) -app.on("activate", function() { +app.on('activate', function () { // On OS X it's common to re-create a window in the app when the // dock icon is clicked and there are no other windows open. if (mainWindow === null) { - createWindow(); + createWindow() } -}); +}) -ipcMain.on("exit-full-screen", () => { - fullscreenToggle(mainWindow, true); -}); +ipcMain.on('exit-full-screen', () => { + fullscreenToggle(mainWindow, true) +}) -ipcMain.on("openLink", (ev, arg) => { +ipcMain.on('openLink', (ev, arg) => { console.log(arg) mainWindow.loadURL(arg) - mainWindow.webContents.on("did-finish-load", (event, url) => { + mainWindow.webContents.on('did-finish-load', (event, url) => { console.log('asking') - mainWindow.webContents.send("send-full-screen", "ping") + mainWindow.webContents.send('send-full-screen', 'ping') }) -}); +}) // In this file you can include the rest of your app's specific main process // code. You can also put them in separate files and require them here. diff --git a/src/preload.js b/src/preload.js index 4f5eeb1..6a75d62 100644 --- a/src/preload.js +++ b/src/preload.js @@ -1,99 +1,86 @@ -let { ipcRenderer } = require("electron"); +let { ipcRenderer } = require('electron') function simulateKey (keyCode, type, modifiers) { - var evtName = (typeof(type) === "string") ? "key" + type : "keydown"; - var modifier = (typeof(modifiers) === "object") ? modifier : {}; + var evtName = (typeof (type) === 'string') ? 'key' + type : 'keydown' + var modifier = (typeof (modifiers) === 'object') ? modifier : {} - var event = document.createEvent("HTMLEvents"); - event.initEvent(evtName, true, false); - event.keyCode = keyCode; + var event = document.createEvent('HTMLEvents') + event.initEvent(evtName, true, false) + event.keyCode = keyCode - for (var i in modifiers) { - event[i] = modifiers[i]; - } + for (var i in modifiers) { + event[i] = modifiers[i] + } - document.dispatchEvent(event); + document.dispatchEvent(event) console.log(document) } - - var onKeyEvent = function (event) { - var state = "pressed"; + var state = 'pressed' - if (event.type !== "keypress") { - state = event.type.replace("key", ""); - } + if (event.type !== 'keypress') { + state = event.type.replace('key', '') + } - console.log("Key with keyCode ") + console.log('Key with keyCode ') console.log(event) -}; +} -document.addEventListener("keypress", onKeyEvent, false); -document.addEventListener("keydown", onKeyEvent, false); -document.addEventListener("keyup", onKeyEvent, false); +document.addEventListener('keypress', onKeyEvent, false) +document.addEventListener('keydown', onKeyEvent, false) +document.addEventListener('keyup', onKeyEvent, false) +function simulate (element, eventName) { + var options = extend(defaultOptions, arguments[2] || {}) + var oEvent; var eventType = null -function simulate(element, eventName) -{ - var options = extend(defaultOptions, arguments[2] || {}); - var oEvent, eventType = null; + for (var name in eventMatchers) { + if (eventMatchers[name].test(eventName)) { eventType = name; break } + } - for (var name in eventMatchers) - { - if (eventMatchers[name].test(eventName)) { eventType = name; break; } - } + if (!eventType) { throw new SyntaxError('Only HTMLEvents and MouseEvents interfaces are supported') } - if (!eventType) - throw new SyntaxError('Only HTMLEvents and MouseEvents interfaces are supported'); - - if (document.createEvent) - { - oEvent = document.createEvent(eventType); - if (eventType == 'HTMLEvents') - { - oEvent.initEvent(eventName, options.bubbles, options.cancelable); - } - else - { - oEvent.initMouseEvent(eventName, options.bubbles, options.cancelable, document.defaultView, - options.button, options.pointerX, options.pointerY, options.pointerX, options.pointerY, - options.ctrlKey, options.altKey, options.shiftKey, options.metaKey, options.button, element); - } - element.dispatchEvent(oEvent); - } - else - { - options.clientX = options.pointerX; - options.clientY = options.pointerY; - var evt = document.createEventObject(); - oEvent = extend(evt, options); - element.fireEvent('on' + eventName, oEvent); + if (document.createEvent) { + oEvent = document.createEvent(eventType) + if (eventType == 'HTMLEvents') { + oEvent.initEvent(eventName, options.bubbles, options.cancelable) + } else { + oEvent.initMouseEvent(eventName, options.bubbles, options.cancelable, document.defaultView, + options.button, options.pointerX, options.pointerY, options.pointerX, options.pointerY, + options.ctrlKey, options.altKey, options.shiftKey, options.metaKey, options.button, element) } - return element; + element.dispatchEvent(oEvent) + } else { + options.clientX = options.pointerX + options.clientY = options.pointerY + var evt = document.createEventObject() + oEvent = extend(evt, options) + element.fireEvent('on' + eventName, oEvent) + } + return element } -function extend(destination, source) { - for (var property in source) - destination[property] = source[property]; - return destination; +function extend (destination, source) { + for (var property in source) { destination[property] = source[property] } + return destination } var eventMatchers = { - 'HTMLEvents': /^(?:load|unload|abort|error|select|change|submit|reset|focus|blur|resize|scroll)$/, - 'MouseEvents': /^(?:click|dblclick|mouse(?:down|up|over|move|out))$/ + 'HTMLEvents': /^(?:load|unload|abort|error|select|change|submit|reset|focus|blur|resize|scroll)$/, + 'MouseEvents': /^(?:click|dblclick|mouse(?:down|up|over|move|out))$/ } var defaultOptions = { - pointerX: 0, - pointerY: 0, - button: 0, - ctrlKey: false, - altKey: false, - shiftKey: false, - metaKey: false, - bubbles: true, - cancelable: true + pointerX: 0, + pointerY: 0, + button: 0, + ctrlKey: false, + altKey: false, + shiftKey: false, + metaKey: false, + bubbles: true, + cancelable: true } ipcRenderer.on('send-full-screen', (ev, arg) => { @@ -103,20 +90,19 @@ ipcRenderer.on('send-full-screen', (ev, arg) => { }, 500) }) -function runToast(){ -let styles = document.createElement('style'); -styles.innerHTML = '#toast,#toast #desc{color:#fff;white-space:nowrap}#toast{visibility:hidden;max-width:50px;height:50px;margin:auto;background-color:#333;text-align:center;border-radius:2px;position:fixed;z-index:100000;left:0;right:0;top:30px;font-size:17px}#toast #img{width:50px;height:50px;float:left;padding-top:16px;padding-bottom:16px;box-sizing:border-box;background-color:#111;color:#fff}#toast #desc{padding:16px;overflow:hidden}#toast.show{visibility:visible;-webkit-animation:fadein .5s,expand .5s .5s,stay 3s 1s,shrink .5s 2s,fadeout .5s 2.5s;animation:fadein .5s,expand .5s .5s,stay 3s 1s,shrink .5s 4s,fadeout .5s 4.5s}@-webkit-keyframes fadein{from{bottom:0;opacity:0}to{bottom:30px;opacity:1}}@keyframes fadein{from{bottom:0;opacity:0}to{bottom:30px;opacity:1}}@-webkit-keyframes expand{from{min-width:50px}to{min-width:350px}}@keyframes expand{from{min-width:50px}to{min-width:350px}}@-webkit-keyframes stay{from,to{min-width:350px}}@keyframes stay{from,to{min-width:350px}}@-webkit-keyframes shrink{from{min-width:350px}to{min-width:50px}}@keyframes shrink{from{min-width:350px}to{min-width:50px}}@-webkit-keyframes fadeout{from{bottom:30px;opacity:1}to{bottom:60px;opacity:0}}@keyframes fadeout{from{bottom:30px;opacity:1}to{bottom:60px;opacity:0}}' +function runToast () { + let styles = document.createElement('style') + styles.innerHTML = '#toast,#toast #desc{color:#fff;white-space:nowrap}#toast{visibility:hidden;max-width:50px;height:50px;margin:auto;background-color:#333;text-align:center;border-radius:2px;position:fixed;z-index:100000;left:0;right:0;top:30px;font-size:17px}#toast #img{width:50px;height:50px;float:left;padding-top:16px;padding-bottom:16px;box-sizing:border-box;background-color:#111;color:#fff}#toast #desc{padding:16px;overflow:hidden}#toast.show{visibility:visible;-webkit-animation:fadein .5s,expand .5s .5s,stay 3s 1s,shrink .5s 2s,fadeout .5s 2.5s;animation:fadein .5s,expand .5s .5s,stay 3s 1s,shrink .5s 4s,fadeout .5s 4.5s}@-webkit-keyframes fadein{from{bottom:0;opacity:0}to{bottom:30px;opacity:1}}@keyframes fadein{from{bottom:0;opacity:0}to{bottom:30px;opacity:1}}@-webkit-keyframes expand{from{min-width:50px}to{min-width:350px}}@keyframes expand{from{min-width:50px}to{min-width:350px}}@-webkit-keyframes stay{from,to{min-width:350px}}@keyframes stay{from,to{min-width:350px}}@-webkit-keyframes shrink{from{min-width:350px}to{min-width:50px}}@keyframes shrink{from{min-width:350px}to{min-width:50px}}@-webkit-keyframes fadeout{from{bottom:30px;opacity:1}to{bottom:60px;opacity:0}}@keyframes fadeout{from{bottom:30px;opacity:1}to{bottom:60px;opacity:0}}' -document.head.appendChild(styles) -let toast = document.createElement('div') -toast.innerHTML = '
H2
Press "F" for full screen
' -document.body.appendChild(toast) -launch_toast() + document.head.appendChild(styles) + let toast = document.createElement('div') + toast.innerHTML = '
H2
Press "F" for full screen
' + document.body.appendChild(toast) + launchToast() } - -function launch_toast() { - var x = document.getElementById("toast") - x.className = "show"; - setTimeout(function(){ x.className = x.className.replace("show", ""); }, 5000); +function launchToast () { + var x = document.getElementById('toast') + x.className = 'show' + setTimeout(function () { x.className = x.className.replace('show', '') }, 5000) } diff --git a/src/renderer.js b/src/renderer.js index 1e6f02d..84588bb 100644 --- a/src/renderer.js +++ b/src/renderer.js @@ -1,30 +1,29 @@ // This file is required by the index.html file and will // be executed in the renderer process for that window. // All of the Node.js APIs are available in this process. +/* global YT, Vimeo, confirm, alert */ +let { ipcRenderer } = require('electron') +const notif = require('./lib/notifications') -let { clipboard, ipcRenderer } = require("electron"); -const notif = require("./lib/notifications"); - -let player; - +let player let apiPromise = new Promise(resolve => { window.onYouTubeIframeAPIReady = () => { // console.log("YouTube API loaded"); - resolve(); - }; - const tag = document.createElement("script"); - tag.src = "https://www.youtube.com/iframe_api"; + resolve() + } + const tag = document.createElement('script') + tag.src = 'https://www.youtube.com/iframe_api' - let firstScriptTag = document.getElementsByTagName('script')[0]; - firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); -}); + let firstScriptTag = document.getElementsByTagName('script')[0] + firstScriptTag.parentNode.insertBefore(tag, firstScriptTag) +}) -async function putYoutube(videoId) { +async function putYoutube (videoId) { await apiPromise let pl = new YT.Player('video', { - height: "100%", - width: "100%", + height: '100%', + width: '100%', videoId: videoId, playerVars: { autoplay: 1, @@ -39,8 +38,8 @@ async function putYoutube(videoId) { // console.log(event) } } - }); - document.body.innerHTML += ``; + }) + document.body.innerHTML += `` window.player = pl player = { @@ -49,58 +48,56 @@ async function putYoutube(videoId) { } } -function putVimeo(videoId) { - let pl = new Vimeo.Player(document.querySelector("#video"), { +function putVimeo (videoId) { + let pl = new Vimeo.Player(document.querySelector('#video'), { id: videoId, autoplay: true, transparent: false - }); + }) player = { api: pl, status: 1 } } -function togglePlay() { +function togglePlay () { if (player) { - if(player.status == 1) { - player.pauseVideo() - player.status = 0 - } else if (player.status == 0) { - player.playVideo() - player.status = 1 + if (player.status === 1) { + player.pauseVideo() + player.status = 0 + } else if (player.status === 0) { + player.playVideo() + player.status = 1 } } else { - alert("Play a video first"); + alert('Play a video first') } } -function defaultiFrame(arg) { - let web = ``; - document.querySelector("#video").innerHTML = web; +function defaultiFrame (arg) { + let web = `` + document.querySelector('#video').innerHTML = web } -window.addEventListener('keyup', function(e){ - if(e.key == 'Escape') - ipcRenderer.send('exit-full-screen') +window.addEventListener('keyup', function (e) { + if (e.key === 'Escape') { ipcRenderer.send('exit-full-screen') } }) ipcRenderer.on('togglePlay', (ev, arg) => { togglePlay() }) -ipcRenderer.on("youtube", async (ev, arg) => { - await putYoutube(arg); +ipcRenderer.on('youtube', async (ev, arg) => { + await putYoutube(arg) let frame = document.getElementById('video') console.log(frame) - frame.addEventListener("load", function() { - setTimeout( () => { - if(document.getElementById('video').contentDocument.querySelector('.ytp-error-content-wrap-reason')) - ipcRenderer.send('openLink', 'https://youtube.com/watch?v='+arg) + frame.addEventListener('load', function () { + setTimeout(() => { + if (document.getElementById('video').contentDocument.querySelector('.ytp-error-content-wrap-reason')) { ipcRenderer.send('openLink', 'https://youtube.com/watch?v=' + arg) } }, 2000) - }); -}); + }) +}) ipcRenderer.on('vimeo', (ev, arg) => { putVimeo(arg) @@ -110,15 +107,15 @@ ipcRenderer.on('googleDocs', (ev, arg) => { defaultiFrame(arg) }) -ipcRenderer.on("invalidUrl", () => { - notif("Oops! This isn't supported URL"); -}); +ipcRenderer.on('invalidUrl', () => { + notif("Oops! This isn't supported URL") +}) -ipcRenderer.on("alertUser", (event, message, url) => { - var userInput = confirm(message); - if (userInput == true) { +ipcRenderer.on('alertUser', (event, message, url) => { + var userInput = confirm(message) + if (userInput === true) { alert( `Step 1. Copy the URL\nStep 2. Open in your favorite browser.\n\n${url}` - ); + ) } -}); +})