You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
174 lines
5.0 KiB
174 lines
5.0 KiB
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta charset="utf-8" /> |
|
<script type="text/javascript" src="%2/node_modules/xterm/lib/xterm.js"></script> |
|
<script type="text/javascript" src="%2/node_modules/xterm-addon-attach/lib/xterm-addon-attach.js"></script> |
|
<script type="text/javascript" src="%2/node_modules/xterm-addon-fit/lib/xterm-addon-fit.js"></script> |
|
<script type="text/javascript" src="%2/node_modules/xterm-addon-search/lib/xterm-addon-search.js"></script> |
|
<script type="text/javascript" src="%2/node_modules/xterm-addon-web-links/lib/xterm-addon-web-links.js"></script> |
|
<script type="text/javascript" src="%2/%3_theme.js"></script> |
|
<link rel="stylesheet" href="%2/node_modules/xterm/css/xterm.css" /> |
|
|
|
<style> |
|
/* Make terminal fit full area of window */ |
|
html, body, #xterm, .xterm-screen, canvas { |
|
width: 100%; |
|
height: 100%; |
|
padding: 0; |
|
margin: 0; |
|
} |
|
|
|
.xterm-viewport { |
|
display: none; |
|
} |
|
|
|
/* Hide scrollbar */ |
|
.xterm-viewport { |
|
overflow: hidden !important; |
|
} |
|
</style> |
|
</head> |
|
<body> |
|
<div id="xterm" class="xterm"/> |
|
|
|
<script> |
|
try { |
|
var socket = new WebSocket("ws://127.0.0.1:%1"); |
|
} |
|
catch(err) { |
|
location.reload(); |
|
} |
|
const term = new Terminal({ |
|
fontSize: "%4", |
|
cursorBlink: true, |
|
theme: theme |
|
}); |
|
if ("%6") { |
|
term.setOption("fontFamily", "%6"); |
|
} |
|
|
|
var title = "%5" |
|
var executing_command = "" |
|
|
|
const searchAddon = new SearchAddon.SearchAddon(); |
|
|
|
function get_selection() { |
|
return term.getSelection(); |
|
} |
|
|
|
function paste(text) { |
|
term.paste(text); |
|
} |
|
|
|
function scroll_line(number) { |
|
term.scrollLines(number); |
|
} |
|
|
|
function scroll_page(number) { |
|
term.scrollPages(number); |
|
} |
|
|
|
function scroll_to_begin() { |
|
term.scrollToTop(); |
|
} |
|
|
|
function scroll_to_bottom() { |
|
term.scrollToBottom(); |
|
} |
|
|
|
function select_all() { |
|
term.selectAll(); |
|
} |
|
|
|
function clear_selection() { |
|
term.clearSelection(); |
|
} |
|
|
|
function find_next(text) { |
|
searchAddon.findNext(text); |
|
} |
|
|
|
function find_prev(text) { |
|
searchAddon.findPrevious(text); |
|
} |
|
|
|
socket.onopen = () => { |
|
const attachAddon = new AttachAddon.AttachAddon(socket); |
|
const fitAddon = new FitAddon.FitAddon(); |
|
term.loadAddon(attachAddon); |
|
term.loadAddon(fitAddon); |
|
term.loadAddon(searchAddon); |
|
term.loadAddon(new WebLinksAddon.WebLinksAddon()); |
|
term.open(document.getElementById('xterm')); |
|
fitAddon.fit(); |
|
term.focus(); |
|
|
|
setTimeout(() => { |
|
sendSizeToServer(); |
|
}, 50); |
|
|
|
function sendSizeToServer() { |
|
/* After window resize, make terminal fit before get term size */ |
|
fitAddon.fit() |
|
|
|
let cols = term.cols.toString(); |
|
let rows = term.rows.toString(); |
|
while (cols.length < 3) { |
|
cols = "0"+cols; |
|
} |
|
while (rows.length < 3) { |
|
rows = "0"+rows; |
|
} |
|
|
|
console.log("ESCAPED|-- RESIZE:"+cols+";"+rows); |
|
|
|
socket.send("ESCAPED|-- RESIZE:"+cols+";"+rows); |
|
} |
|
|
|
window.addEventListener("resize", sendSizeToServer); |
|
|
|
term.onLineFeed(() => { |
|
const buffer = term.buffer; |
|
const new_line = buffer.getLine(buffer.baseY + buffer.cursorY); |
|
if (new_line && !new_line.isWrapped) { |
|
var input_data = get_line_data(buffer, buffer.baseY + buffer.cursorY - 1); |
|
if (input_data.indexOf('$')!=-1){ |
|
executing_command = input_data.slice(input_data.indexOf('$')+1).trim() |
|
if(executing_command.startsWith("cd ")) { |
|
executing_command = "" |
|
} |
|
} |
|
} |
|
}) |
|
function get_line_data(buffer, line_index) { |
|
let line = buffer.getLine(line_index); |
|
if (!line) { |
|
return; |
|
} |
|
let line_data = line.translateToString(true); |
|
while (line_index > 0 && line.isWrapped) { |
|
line = buffer.getLine(--line_index); |
|
if (!line) { |
|
break; |
|
} |
|
line_data = line.translateToString(false) + line_data; |
|
} |
|
return line_data; |
|
} |
|
} |
|
|
|
socket.onmessage = (msg) => { |
|
var re = /:([^\x07].*?)\x07/g; |
|
arr = re.exec(msg.data) |
|
if(arr) { |
|
title = arr[1]; |
|
executing_command = "" |
|
} |
|
} |
|
|
|
socket.onclose = () => {} |
|
socket.onerror = () => {} |
|
</script> |
|
</body> |
|
</html>
|
|
|