Move project to typescript

.gitignore

@@ -1,4 +1,5 @@
 node_modules
-dist
 package-lock.json
-*.rcc
+*.rcc
+out/
+build/

App.ts

@@ -0,0 +1,4 @@
+import { app, BrowserWindow } from 'electron';
+import Main from './src/Main';
+
+Main.main(app, BrowserWindow);

README.md

@@ -21,10 +21,12 @@ Install the dependencies and start the main script.
 ```sh
 cd nekiro-rcc-editor
 npm i
+npm run compile
 npm run start
 ```
 
 ## Compilation
+
 Follow above instructions, but instead of **start** write **build**, build files are written to /dist directory
 
 ```sh
@@ -35,6 +37,6 @@ npm run build
 
 If you like my work and respect my time, consider becoming [Github Sponsor](https://github.com/sponsors/nekiro).
 
-
 ### Credits
+
 - [rccextended](https://github.com/zedxxx/rccextended) for awesome QT rcc lib

package.json

@@ -1,41 +1,45 @@
 {
-  "name": "nekiros_rcc_editor",
+  "name": "nekirosrcceditor",
   "version": "1.0.0",
   "description": "edit qt .rcc files",
-  "main": "main.js",
+  "main": "build/App.js",
   "scripts": {
-    "start": "electron .",
-    "pack": "electron-builder --dir",
-    "build": "electron-builder"
+    "start": "electron-forge start",
+    "compile": "tsc && copyfiles src/html/*.html src/css/*.css src/assets/* src/rcc/rcc.exe build",
+    "package": "electron-forge package",
+    "build": "npm run compile && electron-forge make"
   },
   "author": "Nekiro",
   "license": "MIT",
   "devDependencies": {
-    "prettier": "^2.5.1"
+    "@electron-forge/cli": "^6.0.0-beta.63",
+    "@electron-forge/maker-squirrel": "^6.0.0-beta.63",
+    "@tsconfig/recommended": "^1.0.1",
+    "@types/electron": "^1.6.10",
+    "@types/fs-extra": "^9.0.13",
+    "electron": "^13.0.1",
+    "prettier": "^2.5.1",
+    "typescript": "^4.5.4"
+  },
+  "dependencies": {
+    "electron-squirrel-startup": "^1.0.0",
+    "fs-extra": "^10.0.0"
   },
-  "build": {
-    "appId": "com.electron.nekiros_rcc_editor",
-    "icon": "./assets/icon.ico",
-    "win": {
-      "target": {
-        "target": "nsis",
-        "arch": [
-          "x64",
-          "ia32"
-        ]
+  "config": {
+    "forge": {
+      "packagerConfig": {
+        "icon": "./build/src/assets/icon.ico",
+        "extraResource": "./build/src/rcc",
+        "asar": true
       },
-      "extraResources": [
-        "rcc"
+      "makers": [
+        {
+          "name": "@electron-forge/maker-squirrel",
+          "config": {
+            "name": "NekirosRccEditor"
+          }
+        }
       ]
-    },
-    "nsis": {
-      "oneClick": false,
-      "allowToChangeInstallationDirectory": true
     }
-  },
-  "dependencies": {
-    "electron": "^13.0.1",
-    "electron-builder": "^22.10.5",
-    "fs-extra": "^10.0.0"
   }
 }

src/Main.ts

@@ -0,0 +1,107 @@
+import { BrowserWindow, Menu, dialog, shell, app } from 'electron';
+import { loadRcc, saveRcc, extractToPng } from './reader';
+import path from 'path';
+require('./ipc/main');
+
+export default class Main {
+  static mainWindow: Electron.BrowserWindow;
+  static application: Electron.App;
+  static BrowserWindow: any;
+
+  private static onWindowAllClosed() {
+    if (process.platform !== 'darwin') {
+      Main.application.quit();
+    }
+  }
+
+  private static createWindow() {
+    Main.mainWindow = new Main.BrowserWindow({
+      width: 800,
+      height: 600,
+      webPreferences: {
+        nodeIntegration: true,
+        contextIsolation: false,
+      },
+      title: "Nekiro's Rcc Editor",
+      show: false,
+    });
+
+    const template = [
+      {
+        label: 'Load rcc',
+        click: async () => {
+          const result: Electron.OpenDialogReturnValue =
+            await dialog.showOpenDialog(Main.mainWindow, {
+              defaultPath: path.join(
+                app.getPath('appData'),
+                '../Local/Tibia/packages/Tibia/bin'
+              ),
+              properties: ['openFile'],
+              filters: [{ name: 'Rcc File Type', extensions: ['rcc'] }],
+            });
+
+          if (!result.canceled) {
+            loadRcc(result.filePaths.pop() ?? null);
+          }
+        },
+      },
+      {
+        label: 'Extract assets',
+        click: async () => {
+          const result: Electron.OpenDialogReturnValue =
+            await dialog.showOpenDialog(Main.mainWindow, {
+              properties: ['openDirectory', 'createDirectory'],
+            });
+
+          if (!result.canceled) {
+            extractToPng(result.filePaths.pop() ?? null);
+          }
+        },
+      },
+      {
+        label: 'Save rcc',
+        click: () => saveRcc(),
+      },
+      {
+        label: 'Save rcc as',
+        click: async () => {
+          const result = await dialog.showSaveDialog(Main.mainWindow, {
+            filters: [{ name: 'Rcc File Type', extensions: ['rcc'] }],
+          });
+
+          if (!result.canceled) {
+            saveRcc(result.filePath);
+          }
+        },
+      },
+      {
+        label: 'Donate',
+        click: () => shell.openExternal('https://github.com/sponsors/nekiro'),
+      },
+    ];
+
+    Menu.setApplicationMenu(Menu.buildFromTemplate(template));
+  }
+
+  private static onReady() {
+    // create window
+    Main.createWindow();
+
+    // load layout
+    Main.mainWindow.loadURL(`file://${__dirname}/html/index.html`);
+
+    // show when its ready
+    Main.mainWindow.webContents.once('did-finish-load', () => {
+      Main.mainWindow.show();
+    });
+
+    //Main.mainWindow.webContents.openDevTools();
+  }
+
+  static main(app: Electron.App, browserWindow: typeof BrowserWindow) {
+    Main.BrowserWindow = browserWindow;
+    Main.application = app;
+    Main.application.on('window-all-closed', Main.onWindowAllClosed);
+    Main.application.on('ready', Main.onReady);
+  }
+}

html/index.html → src/html/index.html

@@ -16,6 +16,9 @@
         class="preview"
       />
     </div>
-    <script src="../js/mainRenderer.js"></script>
+    <script>
+      var exports = {};
+    </script>
+    <script src="../ipc/renderer.js"></script>
   </body>
 </html>