mirror of
https://github.com/zhaojh329/rttys.git
synced 2026-02-27 09:53:21 +08:00
103 lines
2.3 KiB
HTML
Executable File
103 lines
2.3 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>RTTY</title>
|
|
<link rel="stylesheet" type="text/css" href="/css/app.css"/>
|
|
<link rel="stylesheet" href="/css/xterm.css" />
|
|
<script src="/js/jquery-1.12.4.min.js"></script>
|
|
<script src="/js/xterm.js"></script>
|
|
<script src="/js/fit.js"></script>
|
|
<script src="/js/base64.min.js"></script>
|
|
</head>
|
|
<body>
|
|
<div id="box">
|
|
<h1>RTTY</h1>
|
|
<input id="did" type="text" placeholder="Please input device id" name="did"></input>
|
|
<span id="msg" style="color:red;"></span>
|
|
<button id="connect" class="btn" type="button">Connect</button>
|
|
</div>
|
|
<div id="terminal-container"></div>
|
|
<script>
|
|
var ws;
|
|
var term;
|
|
var sid;
|
|
var did;
|
|
|
|
function getQueryString(name) {
|
|
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
|
|
var r = window.location.search.substr(1).match(reg);
|
|
if (r != null)
|
|
return unescape(r[2]);
|
|
return null;
|
|
}
|
|
|
|
function new_session(did) {
|
|
ws = new WebSocket('ws://' + location.host + '/ws/browser?did=' + did);
|
|
ws.onopen = function() {
|
|
term = new Terminal({
|
|
focus: true,
|
|
cursorBlink: true,
|
|
screenKeys: true
|
|
});
|
|
|
|
term.on('data', function(data) {
|
|
ws.send(JSON.stringify({type: 'data', did: did, sid: sid, data: Base64.encode(data)}));
|
|
});
|
|
|
|
term.on('open', function() {
|
|
window.addEventListener("resize", function(event) {
|
|
term.fit();
|
|
});
|
|
|
|
term.fit();
|
|
});
|
|
|
|
ws.onmessage = function(evt) {
|
|
var resp = JSON.parse(evt.data);
|
|
|
|
var type = resp.type
|
|
if (type == 'login') {
|
|
if (resp.err) {
|
|
$('#msg').text(resp.err);
|
|
return;
|
|
}
|
|
sid = resp.sid;
|
|
term.open($('#terminal-container')[0], true);
|
|
} else if (type == 'data') {
|
|
term.write(Base64.decode(resp.data));
|
|
} else if (type == 'logout') {
|
|
ws.close();
|
|
}
|
|
};
|
|
|
|
ws.onclose = function () {
|
|
term.destroy();
|
|
};
|
|
};
|
|
}
|
|
|
|
function do_connect() {
|
|
if (did == '') {
|
|
$('#msg').text('Please input device id');
|
|
} else {
|
|
$('#msg').text('');
|
|
new_session(did);
|
|
}
|
|
}
|
|
|
|
$("#connect").click(function() {
|
|
did = $('#did').val().trim();
|
|
do_connect();
|
|
});
|
|
|
|
$(function() {
|
|
did = getQueryString('id');
|
|
if (did && did != '') {
|
|
do_connect();
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|