<!doctype html>
<head>
<meta charset="UTF-8" />
<title>pyxterm</title>
<!--
pyxterm: Basic Python socket implementation for term.js
Example template
Modified by: R. Saravanan <sarava@sarava.net> 2014
Original Copyright (c) 2012-2013, Christopher Jeffrey (MIT License)
-->
<style>
html {
background: #555;
}
h1 {
margin-bottom: 20px;
font: 20px/1.5 sans-serif;
}
</style>
<script src="{{ xstatic('termjs', 'term.js') }}"></script>
<script src="{{ static('terminado.js') }}"></script>
<script>
window.onload = function () {
// Test size: 25x80
var termRowHeight =
0.0 + (1.0 * document.getElementById("dummy-screen").offsetHeight) / 25;
var termColWidth =
0.0 +
(1.02 * document.getElementById("dummy-screen-rows").offsetWidth) / 80;
document
.getElementById("dummy-screen")
.setAttribute("style", "display: none");
var protocol =
window.location.protocol.indexOf("https") === 0 ? "wss" : "ws";
var ws_url = protocol + "://" + window.location.host + "{{ws_url_path}}";
function calculate_size(element) {
var rows = Math.max(
2,
Math.floor(element.innerHeight / termRowHeight) - 1,
);
var cols = Math.max(
3,
Math.floor(element.innerWidth / termColWidth) - 1,
);
console.log(
"resize:",
termRowHeight,
termColWidth,
element.innerHeight,
element.innerWidth,
rows,
cols,
);
return { rows: rows, cols: cols };
}
size = calculate_size(window);
var terminal = make_terminal(document.body, size, ws_url);
window.onresize = function () {
var geom = calculate_size(window);
terminal.term.resize(geom.cols, geom.rows);
terminal.socket.send(
JSON.stringify([
"set_size",
geom.rows,
geom.cols,
window.innerHeight,
window.innerWidth,
]),
);
};
};
</script>
</head>
<body>
<!-- test size: 25x80 -->
<pre
id="dummy-screen"
style="
visibility: hidden;
border: white solid 5px;
font-family: "DejaVu Sans Mono", "Liberation Mono",
monospace;
font-size: 11px;
"
>0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
<span id="dummy-screen-rows" style="visibility:hidden;">01234567890123456789012345678901234567890123456789012345678901234567890123456789</span>
</pre>
</body>