WIP to handle outside of electron build

angular.json

@@ -48,7 +48,6 @@
                             "src/assets/css/ace-overrides.css"
                         ],
                         "scripts":[
-                            "src/libs/showdown.min.js"
                         ],
                         "optimization": true
                     },

package.json

@@ -13,14 +13,14 @@
         "electron-start": "electron . --trace-warnings --start-as=build --ipc-port=4588",
         "electron-pack": "ng build --base-href ./ && electron-builder --dir",
         "electron-dist": "ng build --base-href ./ && electron-builder",
-        "electron-dist-appimage-linux": "ng build --base-href ./ && electron-builder --linux AppImage",
-        "electron-dist-deb-linux": "ng build --base-href ./ && electron-builder --linux deb",
         "electron-dist-zip-linux": "ng build --base-href ./ && electron-builder --linux zip",
+        "electron-dist-deb-linux": "ng build --base-href ./ && electron-builder --linux deb",
+        "electron-dist-appimage-linux": "ng build --base-href ./ && electron-builder --linux AppImage",
         "electron-dist-all-linux": "ng build --base-href ./ && electron-builder --linux deb zip AppImage",
         "electron-dist-all": "ng build --base-href ./ && electron-builder -mwl",
         "electron-concurrently": "concurrently 'ng serve' 'electron . --trace-warnings --start-as=ng-serve'",
         "ng-serve": "ng serve",
-        "ng-build": "ng build",
+        "ng-build": "ng build --base-href ./",
         "ng-watch-build": "ng build --watch --configuration development",
         "ng-test": "ng test",
         "test": "echo \"Error: no test specified\" && exit 1"

src/app/app.component.ts

@@ -1,4 +1,6 @@
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
+
+import { WebsocketService } from './common/services/websocket.service';
 
 import { InfoBarComponent } from './editor/info-bar/info-bar.component';
 import { TabsComponent } from './editor/tabs/tabs.component';
@@ -28,6 +30,69 @@ import { LspManagerComponent } from "./editor/lsp-manager/lsp-manager.component"
 export class AppComponent {
     title = 'Newton';
 
-    constructor() {}
+    protected ws: WebsocketService = inject(WebsocketService);
+
+
+    constructor() {
+        this.checkIfNotElectronMode();
+    }
+
+
+    ngOnInit() {}
+
+    checkIfNotElectronMode() {
+        if (
+            window.electron ||
+            window.main     ||
+            window.fs
+        ) { return; }
+
+        this.setupWebsocket();
+        this.setupWindowBindings();
+    }
+
+    setupWindowBindings() {
+        window.electron ??= {
+            node: () => { return "" },
+            chrome: () => { return "" },
+            electron: () => { return "" },
+        };
+
+        window.main ??= {
+            onMenuActions: () => {},
+            onTerminalActions: () => {},
+            quit: () => {},
+            toggleFullScreen: () => {},
+        };
+
+        window.fs ??= {
+            getLspConfigData: () => {
+                return new Promise((resolve, reject) => {
+                    resolve("{}");
+                });
+            },
+            getFileContents: () => {},
+            openFiles: () => {},
+            saveFile: () => {},
+            saveFileAs: () => {},
+            chooseFolder: () => {},
+            closeFile: () => {},
+            getPathForFile: () => {},
+            onLoadFiles: () => {},
+            onUpdateFilePath: () => {},
+            onSavedFile: () => {},
+            onChangedFile: () => {},
+            onDeletedFile: () => {},
+        };
+    }
+
+    setupWebsocket() {
+        // TODO: Set with dynamic address and port
+        this.ws.connect('ws://localhost:7272').subscribe(msg => {
+            console.log(msg);
+            console.log(window.fs);
+            // this.ws.send("{ 'text': 'Hello server!' }");
+        });
+    }
 
 }

src/app/common/services/editor/lsp-manager/lsp-manager.service.ts

@@ -42,7 +42,7 @@ export class LspManagerService {
     }
 
     private getLspConfigData(): Promise<string> {
-        return window.fs.getLspConfigData();
+        return window?.fs.getLspConfigData();
     }
 
     private parseAndReturnLSPConfigData(): {} {

src/app/common/services/files.service.ts

@@ -55,7 +55,7 @@ export class FilesService {
 
     public unset(file: NewtonFile) {
         file.session.destroy();
-        window.fs.closeFile(file.path);
+        window?.fs.closeFile(file.path);
         this.files.delete(file.path);
     }
 
@@ -76,7 +76,7 @@ export class FilesService {
     ): Promise<NewtonFile | undefined | null> {
 	    for (let i = 0; i < files.length; i++) {
 		    const file = files[i];
-		    const path = window.fs.getPathForFile(file);
+		    const path = window?.fs.getPathForFile(file);
 
 		    if (!file || !path) continue;
 		    if ( this.files.get(path) ) continue;
@@ -101,7 +101,7 @@ export class FilesService {
 	        file.hash     = btoa(file.path);
 
 	        if (loadFileContents)
-	            data = await window.fs.getFileContents(file.path);
+	            data = await window?.fs.getFileContents(file.path);
 
             file.session       = new EditSession(data);
             file.session["id"] = path;

src/app/common/services/websocket.service.ts

@@ -0,0 +1,35 @@
+import { Injectable } from '@angular/core';
+import { webSocket, WebSocketSubject } from 'rxjs/webSocket';
+import { Observable } from 'rxjs';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class WebsocketService {
+
+    private socket$!: WebSocketSubject<any>;
+
+    connect(url: string): Observable<any> {
+        if (!this.socket$ || this.socket$.closed) {
+            this.socket$ = webSocket(
+                {
+                    url,
+                    deserializer: msg => msg.data
+                }
+            );
+        }
+        return this.socket$.asObservable();
+    }
+
+    send(message: any) {
+        if (this.socket$) {
+            this.socket$.next(message);
+        }
+    }
+
+    close() {
+        if (this.socket$) {
+            this.socket$.complete();
+        }
+    }
+}

src/app/editor/code-view/view.base.ts

@@ -187,7 +187,7 @@ export class CodeViewBase {
     }
 
     public toggleFullScreen() {
-        window.main.toggleFullScreen();
+        window?.main.toggleFullScreen();
     }
 
     public setAsReadOnly() {
@@ -300,7 +300,7 @@ export class CodeViewBase {
             startDir = pathParts.join( '/' );
         }
 
-        window.fs.openFiles(startDir);
+        window?.fs.openFiles(startDir);
     }
 
     protected saveFile() {
@@ -312,18 +312,18 @@ export class CodeViewBase {
         }
 
         const text = this.activeFile.session.getValue();
-        window.fs.saveFile(this.activeFile.path, text);
+        window?.fs.saveFile(this.activeFile.path, text);
         this.activeFile.session.getUndoManager().markClean();
     }
 
     protected saveFileAs() {
-        window.fs.saveFileAs().then((path: string) => {
+        window?.fs.saveFileAs().then((path: string) => {
             if (!path) return;
 
             let file: NewtonFile = new File([""], path, {});
             const text           = this.editor.session.getValue();
 
-            window.fs.saveFile(path, text);
+            window?.fs.saveFile(path, text);
             this.filesService.addFile(
                 path,
                 file,
@@ -364,6 +364,6 @@ export class CodeViewBase {
     }
 
     private quit() {
-        window.main.quit();
+        window?.main.quit();
     }
 }

src/app/editor/editors.component.ts

@@ -76,7 +76,7 @@ export class EditorsComponent {
     }
 
     private loadMainSubscribers() {
-        window.main.onMenuActions(async (action: string) => {
+        window?.main.onMenuActions(async (action: string) => {
             let editorComponent = this.editorsService.getActiveEditorComponent();
             let editor          = editorComponent.editor;
 
@@ -112,7 +112,7 @@ export class EditorsComponent {
                 case "show-about":
                     break;
                 case "quit":
-                    window.main.quit();
+                    window?.main.quit();
                     break;
                 default:
                     editor.execCommand(action);
@@ -120,7 +120,7 @@ export class EditorsComponent {
             }
         });
 
-        window.fs.onLoadFiles(async (paths: []) => {
+        window?.fs.onLoadFiles(async (paths: []) => {
             for (let i = 0; i < paths.length; i++) {
                 let file = new File([], "") as NewtonFile;
 
@@ -135,7 +135,7 @@ export class EditorsComponent {
             this.editorsService.setSession(file);
         });
 
-        window.fs.onChangedFile(async (path: string, data: string) => {
+        window?.fs.onChangedFile(async (path: string, data: string) => {
             let file = this.filesService.get(path);
             file.session.setValue(data);
 
@@ -147,7 +147,7 @@ export class EditorsComponent {
             this.tabsService.sendMessage(message);
         });
 
-        window.fs.onDeletedFile(async (path: string) => {
+        window?.fs.onDeletedFile(async (path: string) => {
             let message      = new ServiceMessage();
             message.action   = "file-deleted";
             message.filePath = path;
@@ -156,7 +156,7 @@ export class EditorsComponent {
             this.filesService.sendMessage(message);
         });
 
-        window.fs.onSavedFile(async (path: string) => {
+        window?.fs.onSavedFile(async (path: string) => {
             let message      = new ServiceMessage();
             message.action   = "file-saved";
             message.filePath = path;
@@ -164,7 +164,7 @@ export class EditorsComponent {
             this.tabsService.sendMessage(message);
         });
 
-        window.fs.onUpdateFilePath(async (path: string) => {
+        window?.fs.onUpdateFilePath(async (path: string) => {
             console.log("TODO (onUpdateFilePath) :", path);
             // this.tabsService.sendMessage(message);
             // this.filesService.sendMessage(message);

src/app/editor/lsp-manager/lsp-manager.component.ts

@@ -134,7 +134,7 @@ export class LspManagerComponent {
     }
 
     public setWorkspaceFolder() {
-        window.fs.chooseFolder().then((folder: string) => {
+        window?.fs.chooseFolder().then((folder: string) => {
             if (!folder) return;
 
             this.lspManagerService.workspaceFolder = folder;

src/polyfills.ts

@@ -11,33 +11,35 @@
 import 'zone.js';  // Included with Angular CLI.
 
 
+// Note: Is set to 'any' b/c of desire to set 'render'
+// side if running outside of electron mode.
 declare global {
     interface Window {
         electron: {
-            node: () => Promise<string>,
+            node: any,
-            chrome: () => Promise<string>,
+            chrome: any,
-            electron: () => Promise<string>,
+            electron: any,
         },
         main: {
-            onMenuActions: (arg0: any) => Promise<string>,
+            onMenuActions: any,
-            onTerminalActions: (arg0: any) => Promise<string>,
+            onTerminalActions: any,
             quit: any,
             toggleFullScreen: any,
         },
         fs: {
-            getLspConfigData: () => Promise<string>,
+            getLspConfigData: any,
-            getFileContents: (arg0: any) => Promise<string>,
+            getFileContents: any,
-            openFiles: (arg0) => Promise<string>,
+            openFiles: any,
-            saveFile: (arg0: any, arg1: any) => Promise<string>,
+            saveFile: any,
-            saveFileAs: () => Promise<string>,
+            saveFileAs: any,
-            chooseFolder: () => Promise<string>,
+            chooseFolder: any,
-            closeFile: (arg0: any) => Promise<string>,
+            closeFile: any,
             getPathForFile: any,
-            onLoadFiles: (arg0: any) => Promise<string>,
+            onLoadFiles: any,
-            onUpdateFilePath: (arg0: any) => Promise<string>,
+            onUpdateFilePath: any,
-            onSavedFile: (arg0: any) => Promise<string>,
+            onSavedFile: any,
-            onChangedFile: (arg0: any) => Promise<string>,
+            onChangedFile: any,
-            onDeletedFile: (arg0: any) => Promise<string>,
+            onDeletedFile: any,
         }
     }
 }

src/typings.d.ts

@@ -1 +0,0 @@
-// declare var showdown: any;

tsconfig.json

@@ -16,50 +16,6 @@
         "declaration": false,
         "skipLibCheck": true,
         "strict": false,
-        "forceConsistentCasingInFileNames": true,
+        "forceConsistentCasingInFileNames": true
-    },
-    "includes": [
-        "src/typings.d.ts"
-    ]
     }
-
-
-
-/*
-
-{
-    "compileOnSave": false,
-    "compilerOptions": {
-        "outDir": "./build/app",
-        "strict": true,
-        "noImplicitOverride": true,
-        "noPropertyAccessFromIndexSignature": true,
-        "noImplicitReturns": true,
-        "noFallthroughCasesInSwitch": true,
-        "skipLibCheck": true,
-        "esModuleInterop": true,
-        "sourceMap": true,
-        "declaration": false,
-        "experimentalDecorators": true,
-        "moduleResolution": "bundler",
-        "importHelpers": true,
-        "target": "ES2022",
-        "module": "ES2022",
-        "useDefineForClassFields": false,
-        "lib": [
-            "ES2022",
-            "dom"
-        ]
-    },
-    "angularCompilerOptions": {
-        "enableI18nLegacyMessageIdFormat": false,
-        "strictInjectionParameters": true,
-        "strictInputAccessModifiers": true,
-        "strictTemplates": true
-    },
-    "includes": [
-        "src/typings.d.ts"
-    ]
 }
-
-*/