Add fit addon
This commit is contained in:
parent
0e97d58f6e
commit
6e6df46341
@ -21,7 +21,7 @@
|
|||||||
<body style="background: black; height: 100%">
|
<body style="background: black; height: 100%">
|
||||||
<div style="background: black; color: white; display: flex; flex-direction: column; margin: 0px; height: 100%; width: 100%">
|
<div style="background: black; color: white; display: flex; flex-direction: column; margin: 0px; height: 100%; width: 100%">
|
||||||
<h1 style="text-align: center">Play Blastmud</h1>
|
<h1 style="text-align: center">Play Blastmud</h1>
|
||||||
<div id="console" style="flex: 1"> </div>
|
<div id="console" style="min-height: 40pt; flex: 1"> </div>
|
||||||
</div>
|
</div>
|
||||||
<div id="over18" style="position: absolute; top: 0; left: 0; background: rgba(80,80,80,0.8); width: 100%; height: 100%">
|
<div id="over18" style="position: absolute; top: 0; left: 0; background: rgba(80,80,80,0.8); width: 100%; height: 100%">
|
||||||
<div style="display: block; padding: 10px; background: white; width: 80%; margin-left: auto; margin-right: auto; margin-top: 10%; border-radius: 10px;">
|
<div style="display: block; padding: 10px; background: white; width: 80%; margin-left: auto; margin-right: auto; margin-top: 10%; border-radius: 10px;">
|
||||||
|
15
package-lock.json
generated
15
package-lock.json
generated
@ -6,6 +6,7 @@
|
|||||||
"": {
|
"": {
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"xterm": "^5.1.0",
|
"xterm": "^5.1.0",
|
||||||
|
"xterm-addon-fit": "^0.7.0",
|
||||||
"xterm-readline": "^1.1.0"
|
"xterm-readline": "^1.1.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
@ -8682,6 +8683,14 @@
|
|||||||
"resolved": "https://registry.npmjs.org/xterm/-/xterm-5.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/xterm/-/xterm-5.1.0.tgz",
|
||||||
"integrity": "sha512-LovENH4WDzpwynj+OTkLyZgJPeDom9Gra4DMlGAgz6pZhIDCQ+YuO7yfwanY+gVbn/mmZIStNOnVRU/ikQuAEQ=="
|
"integrity": "sha512-LovENH4WDzpwynj+OTkLyZgJPeDom9Gra4DMlGAgz6pZhIDCQ+YuO7yfwanY+gVbn/mmZIStNOnVRU/ikQuAEQ=="
|
||||||
},
|
},
|
||||||
|
"node_modules/xterm-addon-fit": {
|
||||||
|
"version": "0.7.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/xterm-addon-fit/-/xterm-addon-fit-0.7.0.tgz",
|
||||||
|
"integrity": "sha512-tQgHGoHqRTgeROPnvmtEJywLKoC/V9eNs4bLLz7iyJr1aW/QFzRwfd3MGiJ6odJd9xEfxcW36/xRU47JkD5NKQ==",
|
||||||
|
"peerDependencies": {
|
||||||
|
"xterm": "^5.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/xterm-readline": {
|
"node_modules/xterm-readline": {
|
||||||
"version": "1.1.0",
|
"version": "1.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/xterm-readline/-/xterm-readline-1.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/xterm-readline/-/xterm-readline-1.1.0.tgz",
|
||||||
@ -15438,6 +15447,12 @@
|
|||||||
"resolved": "https://registry.npmjs.org/xterm/-/xterm-5.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/xterm/-/xterm-5.1.0.tgz",
|
||||||
"integrity": "sha512-LovENH4WDzpwynj+OTkLyZgJPeDom9Gra4DMlGAgz6pZhIDCQ+YuO7yfwanY+gVbn/mmZIStNOnVRU/ikQuAEQ=="
|
"integrity": "sha512-LovENH4WDzpwynj+OTkLyZgJPeDom9Gra4DMlGAgz6pZhIDCQ+YuO7yfwanY+gVbn/mmZIStNOnVRU/ikQuAEQ=="
|
||||||
},
|
},
|
||||||
|
"xterm-addon-fit": {
|
||||||
|
"version": "0.7.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/xterm-addon-fit/-/xterm-addon-fit-0.7.0.tgz",
|
||||||
|
"integrity": "sha512-tQgHGoHqRTgeROPnvmtEJywLKoC/V9eNs4bLLz7iyJr1aW/QFzRwfd3MGiJ6odJd9xEfxcW36/xRU47JkD5NKQ==",
|
||||||
|
"requires": {}
|
||||||
|
},
|
||||||
"xterm-readline": {
|
"xterm-readline": {
|
||||||
"version": "1.1.0",
|
"version": "1.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/xterm-readline/-/xterm-readline-1.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/xterm-readline/-/xterm-readline-1.1.0.tgz",
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
{
|
{
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"xterm": "^5.1.0",
|
"xterm": "^5.1.0",
|
||||||
|
"xterm-addon-fit": "^0.7.0",
|
||||||
"xterm-readline": "^1.1.0"
|
"xterm-readline": "^1.1.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
@ -1,13 +1,17 @@
|
|||||||
import {Terminal} from 'xterm';
|
import {Terminal} from 'xterm';
|
||||||
import { Readline } from "xterm-readline";
|
import { Readline } from "xterm-readline";
|
||||||
|
import { FitAddon } from 'xterm-addon-fit';
|
||||||
|
|
||||||
let isScreened = false, sendLessExplicit = false;
|
let isScreened = false, sendLessExplicit = false;
|
||||||
|
|
||||||
const term = new Terminal();
|
const term = new Terminal();
|
||||||
const rl = new Readline();
|
const rl = new Readline();
|
||||||
term.options.scrollback = 1000;
|
term.options.scrollback = 1000;
|
||||||
|
const fit = new FitAddon();
|
||||||
|
term.loadAddon(fit);
|
||||||
term.loadAddon(rl);
|
term.loadAddon(rl);
|
||||||
term.open(document.getElementById('console'));
|
term.open(document.getElementById('console'));
|
||||||
|
fit.fit();
|
||||||
|
|
||||||
let lineHandler = (l: string) => { console.log("Default handler", l); };
|
let lineHandler = (l: string) => { console.log("Default handler", l); };
|
||||||
|
|
||||||
@ -25,6 +29,7 @@ function connectTerm() {
|
|||||||
const wsurl = document.location.href.replace(/^https:\/\/(.*)\/game(.html)?(\?.*)?(\#.*)?/, 'wss:\/\/$1/wsgame');
|
const wsurl = document.location.href.replace(/^https:\/\/(.*)\/game(.html)?(\?.*)?(\#.*)?/, 'wss:\/\/$1/wsgame');
|
||||||
let webSocket = new WebSocket(wsurl);
|
let webSocket = new WebSocket(wsurl);
|
||||||
webSocket.addEventListener('open', (event) => {
|
webSocket.addEventListener('open', (event) => {
|
||||||
|
fit.fit();
|
||||||
lineHandler = (l: string) => { console.log("Send handler", l); webSocket.send(l); }
|
lineHandler = (l: string) => { console.log("Send handler", l); webSocket.send(l); }
|
||||||
term.writeln("\x1b[0mConnected");
|
term.writeln("\x1b[0mConnected");
|
||||||
});
|
});
|
||||||
@ -36,6 +41,7 @@ function connectTerm() {
|
|||||||
term.writeln("\x1b[0mNetwork error with connection.");
|
term.writeln("\x1b[0mNetwork error with connection.");
|
||||||
});
|
});
|
||||||
webSocket.addEventListener('message', (msg) => {
|
webSocket.addEventListener('message', (msg) => {
|
||||||
|
fit.fit();
|
||||||
term.write(msg.data);
|
term.write(msg.data);
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user