From fdcbd3512cfc326213f77c9127c1d895356225cd Mon Sep 17 00:00:00 2001 From: Shuanglei Tao Date: Thu, 10 Nov 2016 20:46:30 +0800 Subject: [PATCH] Show websocket connection error with overlay --- html/css/app.css | 27 ++++++++++++++++----------- html/js/app.js | 24 ++++++++---------------- src/index.html | 4 ++-- 3 files changed, 26 insertions(+), 29 deletions(-) diff --git a/html/css/app.css b/html/css/app.css index 0ca3942..e06be5b 100644 --- a/html/css/app.css +++ b/html/css/app.css @@ -1,21 +1,26 @@ body, #terminal-container { - position: absolute; - height: 100%; - width: 100%; - margin: 0px; - font-size:15px; - font-variant-ligatures: none; - -webkit-font-smoothing: antialiased; - background-color: #101010; + position: absolute; + height: 100%; + width: 100%; + margin: 0; + padding: 0; + font-size:15px; + font-variant-ligatures: none; + -webkit-font-smoothing: antialiased; + background-color: #101010; } .terminal { background-color: #101010; color: #f0f0f0; font-family: "DejaVu Sans Mono","Everson Mono",FreeMono,Menlo,Terminal,monospace; - border: 0; - height: 100%; - width: 100%; + position: fixed; + top: 0; + bottom: 0; + left: 0; + right: 0; + width: auto; + height: auto; } .terminal .xterm-viewport { diff --git a/html/js/app.js b/html/js/app.js index abca354..3e085ba 100644 --- a/html/js/app.js +++ b/html/js/app.js @@ -4,12 +4,13 @@ url = (httpsEnabled ? 'wss://' : 'ws://') + window.location.host + window.location.pathname + 'ws', protocols = ["tty"], autoReconnect = -1, - term, pingTimer; + term, pingTimer, wsError; var openWs = function() { var ws = new WebSocket(url, protocols); ws.onopen = function(event) { + wsError = false; if (typeof tty_auth_token !== 'undefined') { ws.send(JSON.stringify({AuthToken: tty_auth_token})); } @@ -76,7 +77,9 @@ if (term) { term.off('data'); term.off('resize'); - term.showOverlay("Connection Closed", null); + if (!wsError) { + term.showOverlay("Connection Closed", null); + } } clearInterval(pingTimer); if (autoReconnect > 0) { @@ -85,19 +88,8 @@ }; ws.onerror = function(event) { - var errorNode = document.createElement('div'); - errorNode.style.cssText = [ - "color: red", - "background-color: white", - "font-size: x-large", - "opacity: 0.75", - "text-align: center", - "margin: 1em", - "padding: 0.2em", - "border: 0.1em dotted #ccc" - ].join(";"); - errorNode.textContent = "Websocket handshake failed!"; - terminalContainer.insertBefore(errorNode, terminalContainer.firstChild); + wsError = true; + term.showOverlay("Websocket handshake failed", null); }; }; @@ -106,4 +98,4 @@ }; openWs(); -})() \ No newline at end of file +})(); \ No newline at end of file diff --git a/src/index.html b/src/index.html index 66772c4..5dffda6 100644 --- a/src/index.html +++ b/src/index.html @@ -6,7 +6,7 @@ ttyd - Terminal - + @@ -15,6 +15,6 @@
- + \ No newline at end of file -- 2.43.4