Reconnect button (#3)

* Add a reconnect button on logout Prior to this, the only way to return to a session after logging out or login timeout was to manually reload the page. This gives you a nice button to do it for you. Ping @joshsamuelson * Forgot the z-index * Whoa, there's two copies? Not sure why there are two index.html files, but... * Forgot the z-index
8 years ago · a143c3b580
4 changed files with 38 additions and 1 deletions
--- a/app.js
+++ b/app.js
@ -120,7 +120,8 @@ io.on('connection', function(socket){
        socket.emit('output', data);
    });
    term.on('exit', function(code) {
-        console.log((new Date()) + " PID=" + term.pid + " ENDED")
+        console.log((new Date()) + " PID=" + term.pid + " ENDED");
+        socket.emit('logout');
    });
    socket.on('resize', function(data) {
        term.resize(data.col, data.row);
--- a/public/index.html
+++ b/public/index.html
@ -14,6 +14,20 @@
            width: 100%;
            margin: 0px;
        }
+        #overlay {
+            position: absolute;
+            height: 100%;
+            width: 100%;
+            background-color: rgba(0,0,0,0.75);;
+            display: none;
+        }
+        #overlay input {
+            display: block;
+            margin: auto;
+            position: relative;
+            top: 50%;
+            transform: translateY(-50%);
+        }
        #terminal {
            display: block;
            position: relative;
@ -24,6 +38,7 @@
 </head>

 <body>
+    <div id="overlay"><input type="button" onclick="javascript:location.reload();" value="reconnect" /></div>
    <div id="terminal"></div>
 	<script type="application/javascript">
 window.addEventListener('beforeunload', function(e) {
--- a/public/wetty/index.html
+++ b/public/wetty/index.html
@ -14,6 +14,21 @@
            width: 100%;
            margin: 0px;
        }
+        #overlay {
+            position: absolute;
+            height: 100%;
+            width: 100%;
+            background-color: rgba(0,0,0,0.75);;
+            display: none;
+            z-index: 100;
+        }
+        #overlay input {
+            display: block;
+            margin: auto;
+            position: relative;
+            top: 50%;
+            transform: translateY(-50%);
+        }
        #terminal {
            display: block;
            position: relative;
@ -24,6 +39,7 @@
 </head>

 <body>
+    <div id="overlay"><input type="button" onclick="javascript:location.reload();" value="reconnect" /></div>
    <div id="terminal"></div>
 </body>

--- a/public/wetty/wetty.js
+++ b/public/wetty/wetty.js
@ -59,6 +59,11 @@ socket.on('output', function(data) {
    term.io.writeUTF16(data);
 });

+socket.on('logout', function(data) {
+      console.log("user logout");
+      document.getElementById("overlay").style.display = "block";
+});
+
 socket.on('disconnect', function() {
    console.log("Socket.io connection closed");
 });