removed express backend & added new ipc

frontend/forge.config.js

@@ -1,22 +0,0 @@
-module.exports = {
-  packagerConfig: {},
-  rebuildConfig: {},
-  makers: [
-    {
-      name: '@electron-forge/maker-squirrel',
-      config: {},
-    },
-    {
-      name: '@electron-forge/maker-zip',
-      platforms: ['darwin'],
-    },
-    {
-      name: '@electron-forge/maker-deb',
-      config: {},
-    },
-    {
-      name: '@electron-forge/maker-rpm',
-      config: {},
-    },
-  ],
-};

frontend/package.json

@@ -23,30 +23,19 @@
     "electron:build": "vue-cli-service electron:build",
     "electron:serve": "vue-cli-service electron:serve",
     "postinstall": "electron-builder install-app-deps",
-    "postuninstall": "electron-builder install-app-deps",
-    "start": "electron-forge start",
-    "package": "electron-forge package",
-    "make": "electron-forge make"
+    "postuninstall": "electron-builder install-app-deps"
   },
   "main": "background.js",
   "dependencies": {
     "child_process": "^1.0.2",
     "core-js": "^3.8.3",
-    "cors": "^2.8.5",
     "electron-squirrel-startup": "^1.0.0",
-    "socket.io": "^4.6.2",
-    "socket.io-client": "^4.6.2",
     "vue": "^3.2.13",
     "vue-router": "^4.0.3"
   },
   "devDependencies": {
     "@babel/core": "^7.12.16",
     "@babel/eslint-parser": "^7.12.16",
-    "@electron-forge/cli": "^6.1.1",
-    "@electron-forge/maker-deb": "^6.1.1",
-    "@electron-forge/maker-rpm": "^6.1.1",
-    "@electron-forge/maker-squirrel": "^6.1.1",
-    "@electron-forge/maker-zip": "^6.1.1",
     "@vue/cli-plugin-babel": "~5.0.0",
     "@vue/cli-plugin-eslint": "~5.0.0",
     "@vue/cli-plugin-router": "~5.0.0",

frontend/src/app.js

@@ -1,67 +1,40 @@
-const express = require( 'express' );
-let app = express();
-const dialog = require( 'electron' ).dialog;
-const cors = require( 'cors' );
-const bodyParser = require( 'body-parser' );
-const exec = require( 'child_process' ).exec;
-const upscaling = require( './upscalingHandler.js' );
-const upscalingHandler = new upscaling();
-const http = require( 'http' );
-const server = require( 'socket.io' ).Server;
-const Server = http.createServer( app );
+module.exports = function ( win ) {
+    const dialog = require( 'electron' ).dialog;
+    const upscaling = require( './upscalingHandler.js' );
+    const upscalingHandler = new upscaling();
+    const ipcMain = require( 'electron' ).ipcMain;
 
-const io = new server( Server, {
-    cors: {
-        origin: 'http://localhost:8080'
-    }
-} );
+    ipcMain.on( 'selectInputFile', ( event, data ) => {
+        event.reply( 'selectInputFile', { 'data': dialog.showOpenDialogSync( { 
+            properties: [ 'openFile' ], 
+            title: 'Select an input file to upscale',
+            filters: [
+                { name: 'Images (.jpg, .png)', extensions: ['jpg', 'png'] },
+                { name: 'Movies (.mkv, .mp4)', extensions: ['mkv', 'mp4'] },
+                { name: 'All Files', extensions: ['*'] }
+            ]
+        } ) } );
+    } );
 
-app.use( bodyParser.urlencoded( { extended: false } ) );
-app.use( bodyParser.json() );
-app.use( cors() );
+    ipcMain.on( 'selectOutputFile', ( event, data ) => {
+        event.reply( 'selectOutputFile', { 'data': dialog.showSaveDialogSync( { 
+            properties: [ 'promptToCreate' ], 
+            title: 'Select an output file',
+            filters: [
+                { name: 'Images (.jpg, .png)', extensions: ['jpg', 'png'] },
+                { name: 'Movies (.mkv, .mp4)', extensions: ['mkv', 'mp4'] },
+                { name: 'All Files', extensions: ['*'] }
+            ] 
+        } ) } );
+    } );
 
-io.on( 'connection', ( socket ) => {
-    console.log( 'connected' );
-} )
-
-
-app.get( '/api/getEngines', ( request, response ) => {
-    console.log( 'engines' );
-    response.send( { 'data': 'not finished yet' } );
-} );
-
-app.get( '/api/getInputFile', ( request, response ) => {
-    response.send( { 'data': dialog.showOpenDialogSync( { 
-        properties: [ 'openFile' ], 
-        title: 'Select an input file to upscale',
-        filters: [
-            { name: 'Images (.jpg, .png)', extensions: ['jpg', 'png'] },
-            { name: 'Movies (.mkv, .mp4)', extensions: ['mkv', 'mp4'] },
-            { name: 'All Files', extensions: ['*'] }
-        ]
-    } ) } );
-} );
-
-app.get( '/api/getOutputFile', ( request, response ) => {
-    response.send( { 'data': dialog.showSaveDialogSync( { 
-        properties: [ 'promptToCreate' ], 
-        title: 'Select an output file',
-        filters: [
-            { name: 'Images (.jpg, .png)', extensions: ['jpg', 'png'] },
-            { name: 'Movies (.mkv, .mp4)', extensions: ['mkv', 'mp4'] },
-            { name: 'All Files', extensions: ['*'] }
-        ] 
-    } ) } );
-} );
-
-app.post( '/api/startUpscaling', ( request, response ) => {
-    let checks = upscalingHandler.verifyDataIntegrity( request.body );
-    if ( checks[ 0 ] ) {
-        response.send( { 'data': checks[ 1 ] } );
-        upscalingHandler.upscale( request.body, io );
-    } else {
-        response.send( { 'data': checks[ 1 ] } );
-    }
-} );
-
-Server.listen( 49369 );
+    ipcMain.on( 'startUpscaling', ( event, data ) => {
+        let checks = upscalingHandler.verifyDataIntegrity( JSON.parse( data ), ipcMain );
+        if ( checks[ 0 ] ) {
+            event.reply( 'startUpscaling', { 'data': checks[ 1 ] } );
+            upscalingHandler.upscale( JSON.parse( data ), win );
+        } else {
+            event.reply( 'startUpscaling', { 'data': checks[ 1 ] } );
+        }
+    } );
+}

frontend/src/background.js

@@ -4,8 +4,8 @@ import { app, protocol, BrowserWindow } from 'electron';
 import { createProtocol } from 'vue-cli-plugin-electron-builder/lib';
 import installExtension, { VUEJS3_DEVTOOLS } from 'electron-devtools-installer';
 const isDevelopment = process.env.NODE_ENV !== 'production';
+const path = require( 'path' );
 
-require( './app.js' )
 
 // Scheme must be registered before the app is ready
 protocol.registerSchemesAsPrivileged([
@@ -22,10 +22,10 @@ async function createWindow() {
       // Use pluginOptions.nodeIntegration, leave this alone
       // See nklayman.github.io/vue-cli-plugin-electron-builder/guide/security.html#node-integration for more info
       nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION,
-      contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION
+      contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION,
     }
   })
-
+  
   if (process.env.WEBPACK_DEV_SERVER_URL) {
     // Load the url of the dev server if in development mode
     await win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
@@ -35,6 +35,7 @@ async function createWindow() {
     // Load the index.html when not in development
     win.loadURL('app://./index.html')
   }
+  require( './app.js' )( win );
 }
 
 // Quit when all windows are closed.

frontend/src/socket.js

@@ -1,29 +0,0 @@
-import { reactive } from "vue";
-import { io } from "socket.io-client";
-
-export const state = reactive({
-  connected: false,
-  fooEvents: [],
-  barEvents: []
-});
-
-// "undefined" means the URL will be computed from the `window.location` object
-const URL = process.env.NODE_ENV === "production" ? undefined : "http://localhost:49369";
-
-export const socket = io(URL);
-
-socket.on("connect", () => {
-  state.connected = true;
-});
-
-socket.on("disconnect", () => {
-  state.connected = false;
-});
-
-socket.on("foo", (...args) => {
-  state.fooEvents.push(args);
-});
-
-socket.on("bar", (...args) => {
-  state.barEvents.push(args);
-});

frontend/src/upscalingHandler.js

@@ -17,7 +17,7 @@ class UpscalingHandler {
         this.os = process.platform
     }
 
-    upscale( options, io ) {
+    upscale( options, win ) {
         // required options: engine, algorithm, scale, sharpening, InputFile & OutputFile
         // Options is an object!
 
@@ -46,7 +46,7 @@ class UpscalingHandler {
         
         child.stdout.on( 'data', data => {
             console.log( '' + data );
-            io.emit( 'progress', '\n' + data );
+            win.send( 'progress', '\n' + data );
         } );
         
         child.stderr.on( 'data', ( data ) => {

frontend/src/views/HomeView.vue

@@ -28,7 +28,7 @@
 
         <div class="output-box-wrapper">
             <p id="cmd" @click="showCmdOutput()">Command output</p>
-            <div class="output-box" v-html="output" id="output">
+            <div class="output-box" id="output" v-html="output">
             </div>
         </div>
 
@@ -65,7 +65,7 @@
 </template>
 
 <script>
-import { socket } from "@/socket";
+import { ipcRenderer } from 'electron';
 
 export default {
     name: 'HomeView',
@@ -79,42 +79,33 @@ export default {
     },
     methods: {
         runCommand ( command ) {
-            fetch( 'http://127.0.0.1:49369/api/get' + command ).then( res => {
-                res.json().then( data => {
-                    this.upscaleSettings[ command ] = data[ 'data' ];
-                } ).catch( error => {
-                    console.log( error );
-                } );
+            ipcRenderer.send( 'select' + command );
+            ipcRenderer.on( 'select' + command, ( event, data ) => {
+                this.upscaleSettings[ command ] = data[ 'data' ];
             } );
         },
         start() {
-            let fetchOptions = {
-                method: 'post',
-                body: JSON.stringify( this.upscaleSettings ),
-                headers: {
-                    'Content-Type': 'application/json',
-                    'charset': 'utf-8'
-                },
-            }
-            fetch( 'http://127.0.0.1:49369/api/startUpscaling', fetchOptions ).then( res => {
-                res.json().then( data => {
-                    console.log( this.upscaleSettings );
-                    if ( data.data == 'upscaling' ) {
-                        document.getElementById( 'processing' ).showModal();
-                    } else if ( data.data == 'dataMissing' ) {
-                        document.getElementById( 'wrong' ).showModal();
-                    } else {
-                        document.getElementById( 'fileExtension' ).showModal();
-                    }
-                } ).catch( error => {
-                    console.log( error );
-                } )
-            } );
             this.output = '';
+            ipcRenderer.send( 'startUpscaling', JSON.stringify ( this.upscaleSettings ) );
+            ipcRenderer.on( 'startUpscaling', ( event, data ) => {
+                if ( data.data == 'upscaling' ) {
+                    try {
+                        document.getElementById( 'processing' ).showModal();
+                    } catch ( error ) {
+                        console.log( error );
+                    }
+                } else if ( data.data == 'dataMissing' ) {
+                    document.getElementById( 'wrong' ).showModal();
+                } else {
+                    document.getElementById( 'fileExtension' ).showModal();
+                }
+            } );
 
-            socket.on( 'progress', ( ...args) => {
-                this.output += args + '<br>';
-            } )
+            let self = this;
+
+            ipcRenderer.on( 'progress', function ( evt, message ) {
+                self.output += message;
+            });
         },
         showCmdOutput () {
             document.getElementById( 'output' ).classList.toggle( 'shown' );
@@ -125,12 +116,6 @@ export default {
             this.fixed = true;
         }
     },
-    created() {
-        socket.connect();
-    },
-    deactivated() {
-        socket.disconnect();
-    }
 }
 </script>
 

frontend/vue.config.js

@@ -1,4 +1,7 @@
-const { defineConfig } = require('@vue/cli-service')
-module.exports = defineConfig({
-  transpileDependencies: true
-})
+module.exports = {
+  pluginOptions: {
+    electronBuilder: {
+      nodeIntegration: true
+    }
+  }
+}

packaging/stopTesting.sh

@@ -4,12 +4,12 @@ cd ../frontend
 
 rm -rf ./bin
 rm -rf ./config
+rm -rf ./lib-dynload
 rm -rf ./libdynload
 rm ./image*
 rm ./lib*
 rm ./ld*
 rm ./base_library.zip
-rm ./imagevideoupscaler-cli.py
 rm ./LICENSE
 
 cd ..