diff options
-rw-r--r-- | src/App.js | 28 |
1 files changed, 23 insertions, 5 deletions
@@ -59,6 +59,7 @@ class TerminalComponent extends React.Component { selection: "#fff", }, }); + this.isConnecting = false; } componentDidMount() { @@ -73,11 +74,13 @@ class TerminalComponent extends React.Component { // Terminal events this.term.onData((data) => { - this.socket.send(this.encoder.encode("\x00" + data)); + //this.socket.send(this.encoder.encode("\x00" + data)); + this.handleSend(this.encoder.encode("\x00" + data)); }); this.term.onResize((evt) => { - this.socket.send(this.encoder.encode("\x01" + JSON.stringify({ cols: evt.cols, rows: evt.rows }))) + //this.socket.send(this.encoder.encode("\x01" + JSON.stringify({ cols: evt.cols, rows: evt.rows }))); + this.handleSend(this.encoder.encode("\x01" + JSON.stringify({ cols: evt.cols, rows: evt.rows }))); }); this.term.onTitleChange((title) => { @@ -106,6 +109,21 @@ class TerminalComponent extends React.Component { this.fitAddon.fit(); } + handleSend(message) { + if (this.socket.readyState === WebSocket.OPEN) { + this.isConnecting = false; + this.socket.send(message); + } + else if (this.socket.readyState === WebSocket.CONNECTING && !this.isConnecting) { + this.isConnecting = true; + this.socket.addEventListener('open', this.handleSend(message)); + } + else { + + } + }; + + render() { return ( <div className="terminalContainer"> @@ -144,9 +162,9 @@ class Sidebar extends React.Component { return ( <div className="sidenav"> <ul> - <li><div class="sidenavButton" onClick={() => this.createTemplate()}>Create Template</div></li> - <li><div class="sidenavButton" onClick={() => this.toStudentView()}>View as Student</div></li> - <li><div class="sidenavButton" onClick={() => this.logOut()}>Log Out</div></li> + <li><div className="sidenavButton" onClick={() => this.createTemplate()}>Create Template</div></li> + <li><div className="sidenavButton" onClick={() => this.toStudentView()}>View as Student</div></li> + <li><div className="sidenavButton" onClick={() => this.logOut()}>Log Out</div></li> </ul> </div> ); |