mirror of
https://github.com/tsl0922/ttyd.git
synced 2026-01-22 02:34:23 +01:00
Optimize client js
This commit is contained in:
Shuanglei Tao
230
src/index.html
vendored
230
src/index.html
vendored
@@ -571,123 +571,123 @@
|
||||
"Ch6PdwAAAGyWjFW4yScjaWa2mGcofHxWxewKALglWBpLUvwwk+UOh5eNGyUOs1/EF+pZr+ud5Ozo"+"GwYdAABg2p52LiSgAY/ZVlOmilEgHn6G3OcwYjzI7vOj1t6xsx4S3lBY96EUQBF6AIBAmPYH4PoG"+"YCoJAADWe+OZJZi7/x76/yH7Lzf9M5XzRKnFPmveMsilQHwVAAAAAKB3LQD8PCIAAADga0QujBLy"+"wzeJ4a6Z/ERVBAUlAEDqvoM7BQBAuAguzFqILtmjH3Kd4wfKobnOhA3z85qWoRPm9hwoOHoDAAlC"+"bwDAA56FHAuXflHo3fe2ttG9XUDeA9YmYCBQ0oPr/1QC8IvuCwAAApbUAQCK22MmE3O78VAbHQT9"+"PIPNoT9zNc3l2Oe7TAVLANBufT8MAQAAAGzT4PS8AQAAoELGHb2uaCwwEv1EWhFriUkbAaAZ27/f"+"VZnTZXbWz3BwWpjUaMZKRj7dZ0J//gUeTdpVEwAAZOFsNxKAjQSgA+ABPoY8Jj5y2wje81jsXc/1"+
|
||||
"TOQWTDYZBmAkNDiqVwuA2NJ9AQAAEBKAt9Vrsfs/2N19MO91S9rd8EHTZHnzC5MYmfQEACy/FBcA"+"AADA5c4gi4z8RANs/m6FNXVo9DV46JG1BBDukqlw/Va5G7QbuGVSI+2aZaoLXJrdVj2zlC9Z5QEA"+"EFz/5QzgVZwAAAAA/oXcxyC6WfTu+09Ve/c766J4VTAGUFmA51+VANKi/QPoPwYgYAkA715OH4S0"+"s5KDHvj99MMq8TPFc3roKZnGOoT1bmIhVgc7XAMBAAAAAMAW1VbQw3gapzOpJd+Kd2fc4iSO62fJ"+"v9+movui1wUNPAj059N3OVxzk4gV73PmE8FIA2F5mRq37Evc76vLXfF4rD5UJJAw46hW6LZCb5sN"+"Ldx+kzMCAAB+hfy95+965ZCLP7B3/VlTHCvDEKtQhTm4KiCgAEAbrfbWTPssAAAAXpee1tVrozYY"+"n41wD1aeYtkKfswN5/SXPO0JDnhO/4laUortv/s412fybe/nONdncoCHnBVliu0CQGBWlPY/5Kwo"+
|
||||
"m2L/kruPM6Q7oz4tvDQy+bZ3HzOi+gNHA4DZEgA="+"");lib.resource.add("hterm/concat/date","text/plain","Sat, 10 Sep 2016 08:51:57 +0000"+"");lib.resource.add("hterm/changelog/version","text/plain","1.58"+"");lib.resource.add("hterm/changelog/date","text/plain","2016-07-12"+"");lib.resource.add("hterm/git/HEAD","text/plain","49f8641dd055afaad9eadcd8553804eff0dd2637"+"");</script>
|
||||
<script src="auth_token.js"></script>
|
||||
<script type="text/javascript">
|
||||
(function() {
|
||||
var httpsEnabled = window.location.protocol == "https:";
|
||||
var url = (httpsEnabled ? 'wss://' : 'ws://') + window.location.host + window.location.pathname + 'ws';
|
||||
var protocols = ["tty"];
|
||||
var autoReconnect = -1;
|
||||
|
||||
var openWs = function() {
|
||||
var ws = new WebSocket(url, protocols);
|
||||
var term, pingTimer;
|
||||
|
||||
ws.onopen = function(event) {
|
||||
if (typeof tty_auth_token !== 'undefined') {
|
||||
ws.send(JSON.stringify({AuthToken: tty_auth_token}));
|
||||
}
|
||||
pingTimer = setInterval(sendPing, 30 * 1000, ws);
|
||||
|
||||
hterm.defaultStorage = new lib.Storage.Local();
|
||||
hterm.defaultStorage.clear();
|
||||
|
||||
term = new hterm.Terminal();
|
||||
|
||||
term.getPrefs().set("send-encoding", "raw");
|
||||
|
||||
term.onTerminalReady = function() {
|
||||
var io = term.io.push();
|
||||
|
||||
io.onVTKeystroke = function(str) {
|
||||
if (ws.readyState === WebSocket.OPEN) {
|
||||
ws.send("0" + str);
|
||||
}
|
||||
};
|
||||
|
||||
io.sendString = io.onVTKeystroke;
|
||||
|
||||
io.onTerminalResize = function(columns, rows) {
|
||||
if (ws.readyState === WebSocket.OPEN) {
|
||||
ws.send("2" + JSON.stringify({columns: columns, rows: rows}));
|
||||
}
|
||||
};
|
||||
|
||||
term.installKeyboard();
|
||||
};
|
||||
|
||||
var termContainer = document.getElementById('terminal');
|
||||
while (termContainer.firstChild) {
|
||||
termContainer.removeChild(termContainer.firstChild);
|
||||
}
|
||||
term.decorate(termContainer);
|
||||
};
|
||||
|
||||
ws.onmessage = function(event) {
|
||||
var data = event.data.slice(1);
|
||||
switch(event.data[0]) {
|
||||
case '0':
|
||||
term.io.writeUTF8(window.atob(data));
|
||||
break;
|
||||
case '1':
|
||||
// pong
|
||||
break;
|
||||
case '2':
|
||||
term.setWindowTitle(data);
|
||||
break;
|
||||
case '3':
|
||||
var preferences = JSON.parse(data);
|
||||
Object.keys(preferences).forEach(function(key) {
|
||||
console.log("Setting " + key + ": " + preferences[key]);
|
||||
term.getPrefs().set(key, preferences[key]);
|
||||
});
|
||||
break;
|
||||
case '4':
|
||||
autoReconnect = JSON.parse(data);
|
||||
console.log("Enabling reconnect: " + autoReconnect + " seconds")
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
ws.onclose = function(event) {
|
||||
if (term) {
|
||||
term.uninstallKeyboard();
|
||||
setTimeout(function(){
|
||||
term.io.showOverlay("Connection Closed", null);
|
||||
}, 300);
|
||||
}
|
||||
clearInterval(pingTimer);
|
||||
if (autoReconnect > 0) {
|
||||
setTimeout(openWs, autoReconnect * 1000);
|
||||
}
|
||||
};
|
||||
|
||||
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!";
|
||||
document.getElementById('terminal').appendChild(errorNode);
|
||||
};
|
||||
};
|
||||
|
||||
var sendPing = function(ws) {
|
||||
ws.send("1");
|
||||
};
|
||||
|
||||
openWs();
|
||||
})()
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="terminal"></div>
|
||||
<script src="auth_token.js"></script>
|
||||
<script type="text/javascript">
|
||||
(function() {
|
||||
var httpsEnabled = window.location.protocol == "https:";
|
||||
var url = (httpsEnabled ? 'wss://' : 'ws://') + window.location.host + window.location.pathname + 'ws';
|
||||
var protocols = ["tty"];
|
||||
var autoReconnect = -1;
|
||||
|
||||
var openWs = function() {
|
||||
var termContainer = document.getElementById('terminal');
|
||||
var ws = new WebSocket(url, protocols);
|
||||
var term, pingTimer;
|
||||
|
||||
ws.onopen = function(event) {
|
||||
if (typeof tty_auth_token !== 'undefined') {
|
||||
ws.send(JSON.stringify({AuthToken: tty_auth_token}));
|
||||
}
|
||||
pingTimer = setInterval(sendPing, 30 * 1000, ws);
|
||||
|
||||
hterm.defaultStorage = new lib.Storage.Local();
|
||||
hterm.defaultStorage.clear();
|
||||
|
||||
term = new hterm.Terminal();
|
||||
|
||||
term.getPrefs().set("send-encoding", "raw");
|
||||
|
||||
term.onTerminalReady = function() {
|
||||
var io = term.io.push();
|
||||
|
||||
io.onVTKeystroke = function(str) {
|
||||
if (ws.readyState === WebSocket.OPEN) {
|
||||
ws.send("0" + str);
|
||||
}
|
||||
};
|
||||
|
||||
io.sendString = io.onVTKeystroke;
|
||||
|
||||
io.onTerminalResize = function(columns, rows) {
|
||||
if (ws.readyState === WebSocket.OPEN) {
|
||||
ws.send("2" + JSON.stringify({columns: columns, rows: rows}));
|
||||
}
|
||||
};
|
||||
|
||||
term.installKeyboard();
|
||||
};
|
||||
|
||||
while (termContainer.firstChild) {
|
||||
termContainer.removeChild(termContainer.firstChild);
|
||||
}
|
||||
term.decorate(termContainer);
|
||||
};
|
||||
|
||||
ws.onmessage = function(event) {
|
||||
var data = event.data.slice(1);
|
||||
switch(event.data[0]) {
|
||||
case '0':
|
||||
term.io.writeUTF8(window.atob(data));
|
||||
break;
|
||||
case '1':
|
||||
// pong
|
||||
break;
|
||||
case '2':
|
||||
term.setWindowTitle(data);
|
||||
break;
|
||||
case '3':
|
||||
var preferences = JSON.parse(data);
|
||||
Object.keys(preferences).forEach(function(key) {
|
||||
console.log("Setting " + key + ": " + preferences[key]);
|
||||
term.getPrefs().set(key, preferences[key]);
|
||||
});
|
||||
break;
|
||||
case '4':
|
||||
autoReconnect = JSON.parse(data);
|
||||
console.log("Enabling reconnect: " + autoReconnect + " seconds")
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
ws.onclose = function(event) {
|
||||
if (term) {
|
||||
term.uninstallKeyboard();
|
||||
setTimeout(function(){
|
||||
term.io.showOverlay("Connection Closed", null);
|
||||
}, 300);
|
||||
}
|
||||
clearInterval(pingTimer);
|
||||
if (autoReconnect > 0) {
|
||||
setTimeout(openWs, autoReconnect * 1000);
|
||||
}
|
||||
};
|
||||
|
||||
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!";
|
||||
termContainer.appendChild(errorNode);
|
||||
};
|
||||
};
|
||||
|
||||
var sendPing = function(ws) {
|
||||
ws.send("1");
|
||||
};
|
||||
|
||||
openWs();
|
||||
})()
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user