diff --git a/.vscode/tasks.json b/.vscode/tasks.json
index 3c77e52..ae55207 100644
--- a/.vscode/tasks.json
+++ b/.vscode/tasks.json
@@ -2,11 +2,12 @@
"version": "2.0.0",
"tasks": [
{
- "type": "npm",
- "script": "start",
- "problemMatcher": [],
- "label": "npm: start",
- "detail": "node_modules/.bin/electron .",
+ "label": "start",
+ "type": "shell",
+ "command": "node_modules/.bin/electron .",
+ "windows": {
+ "command": ""
+ },
"group": {
"kind": "build",
"isDefault": true
diff --git a/index.js b/index.js
deleted file mode 100644
index 2ecce5c..0000000
--- a/index.js
+++ /dev/null
@@ -1,170 +0,0 @@
-const { app, BrowserWindow, globalShortcut, screen, ipcMain } = require('electron')
-
-let win
-let savedWindowBoundsForTogglingFullScreen = {}
-let savedWindowBoundsBeforeDragging = {}
-let savedMouseDownPositionBeforeDragging
-let isMaximized = false
-let isMouseDragging = false
-let opacity = 0.4
-let dOpacity = 0.1
-
-function createWindow() {
- win = new BrowserWindow({
- width: 640,
- height: 480,
- transparent: true,
- alwaysOnTop: true,
- resizable: true,
- fullscreenable: false,
- opacity: true,
- frame: false,
- webPreferences: {
- nodeIntegration: true
- }
- })
-
- savedWindowBoundsForTogglingFullScreen = win.getBounds()
-
- ipcMain.on('mousedown', (e, mousePosition) => {
- isMouseDragging = true
- savedWindowBoundsBeforeDragging = win.getBounds()
- savedMouseDownPositionBeforeDragging = mousePosition
- })
-
- ipcMain.on('mouseup', () => {
- isMouseDragging = false
- })
-
- ipcMain.on('mousemove', (e, mousePosition) => {
- if (isMouseDragging && !isMaximized) {
- let offsetX = mousePosition.x - savedMouseDownPositionBeforeDragging.x
- let offsetY = mousePosition.y - savedMouseDownPositionBeforeDragging.y
- let x = savedWindowBoundsBeforeDragging.x + offsetX
- let y = savedWindowBoundsBeforeDragging.y + offsetY
- win.setPosition(x, y)
- win.setSize(savedWindowBoundsBeforeDragging.width, savedWindowBoundsBeforeDragging.height)
- }
- })
-
- ipcMain.on('dblclick', () => {
- toggleFullScreen()
- })
-
- ipcMain.on('renderer-loaded', () => {
- win.webContents.send('update-opacity', opacity)
- })
-
- win.loadFile('src/index.html')
- win.menuBarVisible = false
- win.setAlwaysOnTop(true)
-
- win.on('maximize', (e) => {
- onMaximize()
- })
-}
-
-const gotTheLock = app.requestSingleInstanceLock()
-
-if (!gotTheLock) {
- app.quit()
-} else {
- app.on('second-instance', (event, commandLine, workingDirectory) => {
- if (win) {
- if (win.isMinimized()) win.restore()
- win.focus()
- }
- })
-
- app.on('ready', () => {})
-}
-
-app.on('ready', () => {
- setTimeout(function() {
- createWindow()
- toggleFullScreen()
- }, 1000)
-
- globalShortcut.register('CommandOrControl+Alt+F', () => {
- toggleFullScreen()
- })
-
- globalShortcut.register('CommandOrControl+Alt+1', () => {
- opacity -= dOpacity
- if (opacity < 0.1) opacity = 0.1
- win.webContents.send('update-opacity', opacity)
-
- if (isMaximized) {
- win.setIgnoreMouseEvents(true)
- } else {
- win.setIgnoreMouseEvents(false)
- }
- })
-
- globalShortcut.register('CommandOrControl+Alt+2', () => {
- opacity += dOpacity
- if (opacity > 1) opacity = 1
- win.webContents.send('update-opacity', opacity)
-
- if (Math.abs(opacity - 1) < 0.01) {
- win.setIgnoreMouseEvents(false)
- }
- })
-
- globalShortcut.register('Ctrl+Alt+Q', () => {
- app.quit()
- })
-
- globalShortcut.register('Ctrl+Esc', () => {
- app.quit()
- })
-
- globalShortcut.register('Ctrl+Alt+H', () => {
- if (win.isVisible()) {
- win.hide()
- } else {
- win.show()
- }
- })
-})
-
-app.on('window-all-closed', () => {
- if (process.platform !== 'darwin') {
- app.quit()
- }
-})
-
-app.on('activate', () => {
- if (BrowserWindow.getAllWindows().length === 0) {
- createWindow()
- }
-})
-
-function onMaximize() {
- isMaximized = true
- win.setIgnoreMouseEvents(true)
- savedWindowBoundsForTogglingFullScreen = win.getBounds()
- win.setSize(screen.getPrimaryDisplay().bounds.width + 1, screen.getPrimaryDisplay().bounds.height)
- win.setPosition(0, 0)
-}
-
-function onMinimize() {
- isMaximized = false
- win.setIgnoreMouseEvents(false)
- win.setSize(savedWindowBoundsForTogglingFullScreen.width, savedWindowBoundsForTogglingFullScreen.height)
- win.setPosition(savedWindowBoundsForTogglingFullScreen.x, savedWindowBoundsForTogglingFullScreen.y)
-}
-
-function toggleFullScreen() {
- if (isMaximized) {
- onMinimize()
- win.setIgnoreMouseEvents(false)
- } else {
- onMaximize()
- if (opacity == 1) {
- win.setIgnoreMouseEvents(false)
- } else {
- win.setIgnoreMouseEvents(true)
- }
- }
-}
diff --git a/ipc-main/index.js b/ipc-main/index.js
new file mode 100644
index 0000000..96af637
--- /dev/null
+++ b/ipc-main/index.js
@@ -0,0 +1,95 @@
+const { app, BrowserWindow, globalShortcut, ipcMain } = require('electron')
+const MainWindow = require('./main-window')
+
+let mainWindow
+
+
+/**
+ * Create the main window and manage its events
+ */
+function createWindow() {
+ mainWindow = new MainWindow()
+
+ ipcMain.on('mousedown', (e, position) => {
+ mainWindow.onMouseDown(position)
+ })
+
+ ipcMain.on('mouseup', (e) => {
+ mainWindow.onMouseUp()
+ })
+
+ ipcMain.on('mousemove', (e, position) => {
+ mainWindow.onMouseMove(position)
+ })
+
+ ipcMain.on('dblclick', (e) => {
+ mainWindow.onDoubleClick()
+ })
+
+ ipcMain.on('renderer-loaded', () => {
+ mainWindow.update()
+ })
+
+ globalShortcut.register('CommandOrControl+Alt+F', () => {
+ mainWindow.toggleFullScreen()
+ })
+
+ globalShortcut.register('CommandOrControl+Alt+1', () => {
+ mainWindow.decreaseOpacity()
+ })
+
+ globalShortcut.register('CommandOrControl+Alt+2', () => {
+ mainWindow.increaseOpacity()
+ })
+
+ globalShortcut.register('Ctrl+Alt+Q', () => {
+ app.quit()
+ })
+
+ globalShortcut.register('Ctrl+Esc', () => {
+ app.quit()
+ })
+
+ globalShortcut.register('Ctrl+Alt+H', () => {
+ mainWindow.toggleHide()
+ })
+}
+
+
+/**
+ * Prevents multiple instances of main window
+ */
+const gotTheLock = app.requestSingleInstanceLock()
+
+if (!gotTheLock) {
+ app.quit()
+} else {
+ app.on('second-instance', (event, commandLine, workingDirectory) => {
+ if (mainWindow) {
+ if (mainWindow.isMinimized()) mainWindow.restore()
+ mainWindow.focus()
+ }
+ })
+}
+
+
+/**
+ * App listeners
+ */
+app.on('ready', () => {
+ setTimeout(function() {
+ createWindow()
+ }, 1000)
+})
+
+app.on('window-all-closed', () => {
+ if (process.platform !== 'darwin') {
+ app.quit()
+ }
+})
+
+app.on('activate', () => {
+ if (BrowserWindow.getAllWindows().length === 0) {
+ createWindow()
+ }
+})
diff --git a/ipc-main/main-window.js b/ipc-main/main-window.js
new file mode 100644
index 0000000..1aa6c97
--- /dev/null
+++ b/ipc-main/main-window.js
@@ -0,0 +1,122 @@
+const { BrowserWindow, screen } = require('electron')
+
+module.exports = class MainWindow extends BrowserWindow {
+ constructor() {
+ super({
+ width: 640,
+ height: 480,
+ minWidth: 200,
+ minHeight: 200,
+ transparent: true,
+ alwaysOnTop: true,
+ resizable: true,
+ fullscreenable: false,
+ opacity: true,
+ frame: false,
+ webPreferences: {
+ nodeIntegration: true
+ }
+ })
+
+ this.isMaximized = true
+ this.savedWindowBoundsForTogglingFullScreen = this.getBounds()
+ this.savedMouseDownPositionBeforeDragging = null
+ this.isMaximized = false
+ this.isMouseDragging = false
+ this.opacity = 0.4
+ this.dOpacity = 0.1
+ this.menuBarVisible = false
+
+ this.loadFile('ipc-renderer/index.html')
+ this.setAlwaysOnTop(true)
+ this.toggleFullScreen()
+ }
+
+ update() {
+ this.webContents.send('update-opacity', this.opacity)
+ }
+
+ onMaximize() {
+ this.isMaximized = true
+ this.setIgnoreMouseEvents(true)
+ this.savedWindowBoundsForTogglingFullScreen = this.getBounds()
+ this.setSize(screen.getPrimaryDisplay().bounds.width, screen.getPrimaryDisplay().bounds.height)
+ this.setPosition(screen.getPrimaryDisplay().bounds.x, screen.getPrimaryDisplay().bounds.y)
+ }
+
+ onMinimize() {
+ this.isMaximized = false
+ this.setIgnoreMouseEvents(false)
+ this.setSize(this.savedWindowBoundsForTogglingFullScreen.width, this.savedWindowBoundsForTogglingFullScreen.height)
+ this.setPosition(this.savedWindowBoundsForTogglingFullScreen.x, this.savedWindowBoundsForTogglingFullScreen.y)
+ }
+
+ onMouseDown(position) {
+ this.isMouseDragging = true
+ this.savedWindowBoundsBeforeDragging = this.getBounds()
+ this.savedMouseDownPositionBeforeDragging = position
+ }
+
+ onMouseUp() {
+ this.isMouseDragging = false
+ }
+
+ onMouseMove(position) {
+ if (this.isMouseDragging && !this.isMaximized) {
+ let offsetX = position.x - this.savedMouseDownPositionBeforeDragging.x
+ let offsetY = position.y - this.savedMouseDownPositionBeforeDragging.y
+ let x = this.savedWindowBoundsBeforeDragging.x + offsetX
+ let y = this.savedWindowBoundsBeforeDragging.y + offsetY
+ this.setPosition(x, y)
+ this.setSize(this.savedWindowBoundsBeforeDragging.width, this.savedWindowBoundsBeforeDragging.height)
+ }
+ }
+
+ onDoubleClick() {
+ this.toggleFullScreen()
+ }
+
+ toggleFullScreen() {
+ if (this.isMaximized) {
+ this.onMinimize()
+ this.setIgnoreMouseEvents(false)
+ } else {
+ this.onMaximize()
+ if (this.opacity == 1) {
+ this.setIgnoreMouseEvents(false)
+ } else {
+ this.setIgnoreMouseEvents(true)
+ }
+ }
+ }
+
+ decreaseOpacity() {
+ this.opacity -= this.dOpacity
+ if (this.opacity < 0.1) this.opacity = 0.1
+ this.webContents.send('update-opacity', this.opacity)
+
+ if (this.isMaximized) {
+ this.setIgnoreMouseEvents(true)
+ } else {
+ this.setIgnoreMouseEvents(false)
+ }
+ }
+
+ increaseOpacity() {
+ this.opacity += this.dOpacity
+ if (this.opacity > 1) this.opacity = 1
+ this.webContents.send('update-opacity', this.opacity)
+
+ if (Math.abs(this.opacity - 1) < 0.01) {
+ this.setIgnoreMouseEvents(false)
+ }
+ }
+
+ toggleHide() {
+ if (this.isVisible()) {
+ this.hide()
+ } else {
+ this.show()
+ }
+ }
+}
diff --git a/src/index.html b/ipc-renderer/index.html
similarity index 82%
rename from src/index.html
rename to ipc-renderer/index.html
index 470a70a..d789e93 100644
--- a/src/index.html
+++ b/ipc-renderer/index.html
@@ -23,7 +23,7 @@
-
-
+
+