blub

package.json

@@ -1,8 +1,9 @@
 {
   "name": "socket-server",
-  "version": "0.0.32",
+  "version": "0.0.33",
   "private": true,
   "homepage": "./",
+  "type": "module",
   "main": "public/electron.js",
   "description": "socketosc server wrapped in electron",
   "scripts": {
@@ -42,6 +43,7 @@
     ]
   },
   "dependencies": {
+    "@electron-toolkit/preload": "^3.0.0",
     "@testing-library/jest-dom": "^6.4.2",
     "@testing-library/react": "^14.2.1",
     "@testing-library/user-event": "^14.5.2",

public/config.js

@@ -1,4 +1,6 @@
-const config = (isDev) => ({
+import isDev from 'electron-is-dev'
+
+const config = {
   webSocketHost: !isDev ? 'https://socket.osc.link' : 'http://localhost:8080',
   socketRoomPrefix: 'control',
   oscOverUDP: {
@@ -7,6 +9,6 @@ const config = (isDev) => ({
     remotePort: 57121,
     metadata: true,
   },
-});
+};
 
-module.exports = config;
+export default config

public/electron.js

@@ -1,8 +1,12 @@
 process.env.NODE_OPTIONS = undefined;
+import path from 'path'
+import { app, BrowserWindow, ipcMain } from 'electron'
+import isDev from 'electron-is-dev'
+import SocketOSCServer from './server.js'
+import { fileURLToPath } from 'url';
 
-const path = require('path');
-const { app, BrowserWindow, ipcMain } = require('electron');
-const SocketOSCServer = require('./server');
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
 
 let socketOscServerInstance;
 
@@ -17,11 +21,8 @@ async function handleServerStart (event, instanceId, localPort, remotePort) {
   const win = BrowserWindow.fromWebContents(webContents);
 
   console.log('handleServerStart', instanceId);
-
-  import('electron-is-dev').then(async (isDev) => {
-    socketOscServerInstance = new SocketOSCServer(win, isDev);
-    await socketOscServerInstance.init(instanceId, localPort, remotePort);
-  })
+  socketOscServerInstance = new SocketOSCServer(win);
+  await socketOscServerInstance.init(instanceId, localPort, remotePort);
 }
 
 async function handleServerStop (event, message) {
@@ -30,7 +31,7 @@ async function handleServerStop (event, message) {
 }
 
 
-function createWindow() {
+async function createWindow() {
   const win = new BrowserWindow({
     width: 1024,
     height: 750,
@@ -41,17 +42,17 @@ function createWindow() {
     },
   });
 
-  import('electron-is-dev').then(async (isDev) => {
-    win.loadURL(
-      isDev
-        ? 'http://localhost:3000'
-        : `file://${path.join(__dirname, '../build/index.html')}`
-    );
+  console.log(isDev)
 
-    if (isDev) {
-      win.webContents.openDevTools({ mode: 'detach' });
-    }
-  })
+  await win.loadURL(
+    isDev
+      ? 'http://localhost:3000'
+      : `file://${path.join(__dirname, '../build/index.html')}`
+  );
+
+  if (isDev) {
+    win.webContents.openDevTools({ mode: 'detach' });
+  }
 }
 
 app.whenReady().then(async () => {

public/preload.js

@@ -1,5 +1,8 @@
 const { contextBridge, ipcRenderer } = require('electron');
 
+import { contextBridge } from 'electron'
+import { electronAPI } from '@electron-toolkit/preload'
+
 window.ipcRenderer = require('electron').ipcRenderer;
 
 let currentChannelReceiverListener;
@@ -36,4 +39,25 @@ contextBridge.exposeInMainWorld('electronAPI', {
       ipcRenderer.removeListener(channel, currentChannelReceiverListener);
     }
   },
-});
+});
+
+
+// Custom APIs for renderer
+const api = {}
+
+// Use `contextBridge` APIs to expose Electron APIs to
+// renderer only if context isolation is enabled, otherwise
+// just add to the DOM global.
+if (process.contextIsolated) {
+  try {
+    contextBridge.exposeInMainWorld('electron', electronAPI)
+    contextBridge.exposeInMainWorld('api', api)
+  } catch (error) {
+    console.error(error)
+  }
+} else {
+  // @ts-ignore (define in dts)
+  window.electron = electronAPI
+  // @ts-ignore (define in dts)
+  window.api = api
+}

public/server.js

@@ -1,7 +1,7 @@
-const io = require('socket.io-client');
-const os = require('os');
-const osc = require('osc');
-const config = require('./config');
+import io from 'socket.io-client'
+import os from 'os'
+import osc from 'osc'
+import config from './config.js'
 
 class SocketOSCServer {
   electronWindow;
@@ -13,10 +13,8 @@ class SocketOSCServer {
     lastHostMessage: {}
   };
 
-  constructor(electronWindow, isDev) {SocketOSCServer
+  constructor(electronWindow) {
     this.electronWindow = electronWindow;
-    this.isDev = isDev;
-    this.config = config(isDev)
   }
 
   log(message) {
@@ -515,4 +513,4 @@ const capitalizeFirstChar = (inputString) => {
   return inputString.charAt(0).toUpperCase() + inputString.slice(1).toLowerCase();
 }
 
-module.exports = SocketOSCServer;
+export default SocketOSCServer;

yarn.lock

@@ -1483,6 +1483,11 @@
   dependencies:
     chrome-trace-event "^1.0.3"
 
+"@electron-toolkit/preload@^3.0.0":
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/@electron-toolkit/preload/-/preload-3.0.0.tgz#34a801a7038e80fa7dd41cd5d114ce5b0ae3ffc4"
+  integrity sha512-DTyvNGits43J1RiQGFN00/OxjjcTcozLWMjgQBANt97FFptEYiLVasq7kMC24nMwwoOpdDYY9CE6C+4wQJ55/w==
+
 "@electron/asar@^3.2.1", "@electron/asar@^3.2.7":
   version "3.2.8"
   resolved "https://registry.yarnpkg.com/@electron/asar/-/asar-3.2.8.tgz#2ea722f3452583dbd4ffdcc4b4f5dc903f1d8178"