Terminal class and everything working

_boot.js

@@ -4,43 +4,36 @@ console.log(`
     ===========================================================
               Starting eDEX-UI v${app.getVersion()} with Node ${process.versions.node}
                            on Electron ${process.versions.electron}
-    ===========================================================`);
+    ===========================================================
+    `);
 
 const electron = require("electron");
-const pty = require("node-pty");
-const ws = require("ws").Server;
 const path = require("path");
 const url = require("url");
+const Terminal = require("./classes/terminal.class.js").Terminal;
 
-let win, wss, tty;
+let win, tty;
 
 app.on('ready', () => {
-    tty = pty.spawn(process.platform === 'win32' ? 'cmd.exe' : 'bash', [], {
-        name: 'xterm-color',
-        cols: 80,
-        rows: 24,
-        cwd: process.env.PWD,
-        env: process.env
-    });
 
-    wss = new ws({port: 3000});
-    wss.on('connection', (ws) => {
-        console.log("connected");
-        ws.on('message', (msg) => {
-            tty.write(msg);
-        });
-        tty.on('data', (data) => {
-            try {
-                ws.send(data);
-            } catch (e) {
-                // Websocket closed
-            }
-        });
-    });
-    wss.on('close', () => {
-        console.log("closed");
-        tty.kill();
+    tty = new Terminal({
+        role: "server",
+        shell: (process.platform === "win32") ? "cmd.exe" : "bash"
     });
+    tty.onclosed = (code, signal) => {
+        console.log("=> Terminal exited - "+code+", "+signal);
+        app.quit();
+    };
+    tty.onopened = () => {
+        console.log("=> Connected to front-end");
+    };
+    tty.onresized = (cols, rows) => {
+        console.log("=> Resized terminal to "+cols+"x"+rows);
+    };
+    tty.ondisconnected = () => {
+        tty.tty.kill();
+        app.quit();
+    };
 
     let {x, y, width, height} = electron.screen.getPrimaryDisplay().bounds;
     width++; height++;
@@ -76,3 +69,7 @@ app.on('ready', () => {
 app.on('window-all-closed', () => {
     app.quit();
 });
+
+app.on('before-quit', () => {
+    console.log("=> Shutting down...");
+})

_renderer.js

@@ -1,9 +1,7 @@
-const Terminal = require("xterm");
-Terminal.loadAddon('attach');
-
-let term = new Terminal();
-term.open(document.getElementById("terminal"));
-let socket = new WebSocket("ws://0.0.0.0:3000");
-socket.onopen = () => {
-    term.attach(socket);
-};
+window.term = new Terminal({
+    role: "client",
+    parentId: "terminal"
+});
+setTimeout(() => {
+    window.term.fit();
+}, 500);

classes/terminal.class.js

@@ -0,0 +1,116 @@
+class Terminal {
+    constructor(opts) {
+        if (opts.role === "client") {
+            if (!opts.parentId) throw "Missing options";
+
+            this.xTerm = require("xterm");
+            this.xTerm.loadAddon('attach');
+            this.xTerm.loadAddon('fit');
+
+            this.sendSizeToServer = () => {
+                let cols = this.term.cols.toString();
+                let rows = this.term.rows.toString();
+                while (cols.length < 3) {
+                    cols = "0"+cols;
+                }
+                while (rows.length < 3) {
+                    rows = "0"+rows;
+                }
+                this.socket.send("ESCAPED|-- RESIZE:"+cols+";"+rows);
+            };
+
+            this.term = new this.xTerm({
+                cols: 80,
+                rows: 24
+            });
+            this.term.open(document.getElementById(opts.parentId), true);
+
+            let sockHost = opts.host || "127.0.0.1";
+            let sockPort = opts.port || 3000;
+
+            this.socket = new WebSocket("ws://"+sockHost+":"+sockPort);
+            this.socket.onopen = () => {
+                this.term.attach(this.socket);
+            };
+            this.socket.onerror = (e) => {throw e};
+
+            this.fit = () => {
+                this.term.fit();
+                setTimeout(() => {
+                    this.sendSizeToServer();
+                }, 50);
+            }
+
+            this.resize = (cols, rows) => {
+                this.term.resize(cols, rows);
+                setTimeout(() => {
+                    this.sendSizeToServer();
+                }, 50);
+            }
+        } else if (opts.role === "server") {
+
+            this.Pty = require("node-pty");
+            this.Websocket = require("ws").Server;
+
+            this.onclosed = () => {};
+            this.onopened = () => {};
+            this.onresize = () => {};
+            this.ondisconnected = () => {};
+
+            this.tty = this.Pty.spawn(opts.shell || "bash", [], {
+                name: 'xterm-color',
+                cols: 80,
+                rows: 24,
+                cwd: process.env.PWD,
+                env: process.env
+            });
+
+            this.tty.on('exit', (code, signal) => {
+                this.onclosed(code, signal);
+            });
+            this.wss = new this.Websocket({
+                port: opts.port || 3000,
+                clientTracking: true,
+                verifyClient: (info) => {
+                    if (this.wss.clients.length >= 1) {
+                        return false;
+                    } else {
+                        return true;
+                    }
+                }
+            });
+            this.wss.on('connection', (ws) => {
+                this.onopened();
+                ws.on('message', (msg) => {
+                    if (msg.startsWith("ESCAPED|-- ")) {
+                        if (msg.startsWith("ESCAPED|-- RESIZE:")) {
+                            msg = msg.substr(18);
+                            let cols = msg.slice(0, -4);
+                            let rows = msg.substr(4);
+                            this.tty.resize(Number(cols), Number(rows));
+                            this.onresized(cols, rows);
+                        }
+                    } else {
+                        this.tty.write(msg);
+                    }
+                });
+                this.tty.on('data', (data) => {
+                    try {
+                        ws.send(data);
+                    } catch (e) {
+                        // Websocket closed
+                    }
+                });
+            });
+            this.wss.on('close', () => {
+                this.ondisconnected();
+            });
+        } else {
+            throw "Unknow purpose";
+        }
+    }
+}
+
+module.exports = {
+    Terminal
+};

ui.html

@@ -6,11 +6,14 @@
 
         <link rel="stylesheet" href="assets/css/main.css" />
         <link rel="stylesheet" href="assets/css/fonts.css" />
+        <link rel="stylesheet" href="assets/css/main_shell.css" />
 
-        <link rel="stylesheet" href="node_modules/xterm/dist/xterm.css" />
+        <script src="classes/terminal.class.js"></script>
     </head>
     <body>
-        <div id="terminal"></div>
+        <section id="main_shell">
+            <pre id="terminal"></pre>
+        </section>
 
         <script src="_renderer.js"></script>
     </body>