From 57330afd153851af0051dd34ec5dfad7f44d3a03 Mon Sep 17 00:00:00 2001 From: Jesse Luehrs Date: Fri, 22 Nov 2019 08:29:00 -0500 Subject: use vt100 to render the terminal data in the browser(!) --- Cargo.lock | 1 + teleterm-web/Cargo.toml | 1 + teleterm-web/src/lib.rs | 7 +--- teleterm-web/src/model.rs | 18 +++++++- teleterm/static/teleterm_web.js | 78 +++++++++++++++++------------------ teleterm/static/teleterm_web_bg.wasm | Bin 402627 -> 681898 bytes 6 files changed, 60 insertions(+), 45 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index b8d6565..d56d7df 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -2155,6 +2155,7 @@ dependencies = [ "seed", "serde", "serde_json", + "vt100", "wasm-bindgen", "web-sys", ] diff --git a/teleterm-web/Cargo.toml b/teleterm-web/Cargo.toml index a7c82b6..47496de 100644 --- a/teleterm-web/Cargo.toml +++ b/teleterm-web/Cargo.toml @@ -18,5 +18,6 @@ log = "0.4" seed = "0.4" serde = "1" serde_json = "1" +vt100 = "0.6" wasm-bindgen = "0.2" web-sys = { version = "0.3", features = ["ErrorEvent", "MessageEvent", "WebSocket"] } diff --git a/teleterm-web/src/lib.rs b/teleterm-web/src/lib.rs index 030ac45..5dd5a33 100644 --- a/teleterm-web/src/lib.rs +++ b/teleterm-web/src/lib.rs @@ -59,11 +59,7 @@ fn update( serde_json::from_str(&json).unwrap(); match msg { crate::protocol::Message::TerminalOutput { data } => { - log::info!( - "{}: got bytes: {}", - id, - String::from_utf8_lossy(&data) - ); + model.process(&data); } } } @@ -87,6 +83,7 @@ fn view(model: &crate::model::Model) -> impl View { seed::h1!["it's a seed app"], seed::ul![list], seed::button![simple_ev(Ev::Click, Msg::Refresh), "refresh"], + seed::pre![model.screen()], ] } diff --git a/teleterm-web/src/model.rs b/teleterm-web/src/model.rs index 263dd7c..a90ebe2 100644 --- a/teleterm-web/src/model.rs +++ b/teleterm-web/src/model.rs @@ -6,6 +6,7 @@ const WATCH_URL: &str = "ws://127.0.0.1:4145/watch"; struct WatchConn { #[allow(dead_code)] // no idea why it thinks this is dead ws: WebSocket, + term: vt100::Parser, } impl Drop for WatchConn { @@ -44,7 +45,8 @@ impl Model { crate::Msg::Watch, orders, ); - self.watch_conn = Some(WatchConn { ws }) + let term = vt100::Parser::default(); + self.watch_conn = Some(WatchConn { ws, term }) } pub fn sessions(&self) -> &[Session] { @@ -54,4 +56,18 @@ impl Model { pub fn update_sessions(&mut self, sessions: Vec) { self.sessions = sessions; } + + pub fn process(&mut self, bytes: &[u8]) { + if let Some(conn) = &mut self.watch_conn { + conn.term.process(bytes); + } + } + + pub fn screen(&self) -> String { + if let Some(conn) = &self.watch_conn { + conn.term.screen().contents() + } else { + "".to_string() + } + } } diff --git a/teleterm/static/teleterm_web.js b/teleterm/static/teleterm_web.js index ffeb4a4..afcfaf9 100644 --- a/teleterm/static/teleterm_web.js +++ b/teleterm/static/teleterm_web.js @@ -18,31 +18,31 @@ function addHeapObject(obj) { return idx; } function __wbg_elem_binding0(arg0, arg1, arg2) { - wasm.__wbg_function_table.get(41)(arg0, arg1, addHeapObject(arg2)); + wasm.__wbg_function_table.get(55)(arg0, arg1, addHeapObject(arg2)); } function __wbg_elem_binding1(arg0, arg1, arg2) { - wasm.__wbg_function_table.get(41)(arg0, arg1, addHeapObject(arg2)); + wasm.__wbg_function_table.get(55)(arg0, arg1, addHeapObject(arg2)); } -function __wbg_elem_binding2(arg0, arg1) { - wasm.__wbg_function_table.get(195)(arg0, arg1); +function __wbg_elem_binding2(arg0, arg1, arg2) { + wasm.__wbg_function_table.get(59)(arg0, arg1, arg2); } function __wbg_elem_binding3(arg0, arg1, arg2) { - wasm.__wbg_function_table.get(46)(arg0, arg1, arg2); + wasm.__wbg_function_table.get(55)(arg0, arg1, addHeapObject(arg2)); } -function __wbg_elem_binding4(arg0, arg1, arg2) { - wasm.__wbg_function_table.get(265)(arg0, arg1, addHeapObject(arg2)); +function __wbg_elem_binding4(arg0, arg1) { + wasm.__wbg_function_table.get(216)(arg0, arg1); } function __wbg_elem_binding5(arg0, arg1, arg2) { - wasm.__wbg_function_table.get(41)(arg0, arg1, addHeapObject(arg2)); + wasm.__wbg_function_table.get(55)(arg0, arg1, addHeapObject(arg2)); } function __wbg_elem_binding6(arg0, arg1, arg2) { - wasm.__wbg_function_table.get(41)(arg0, arg1, addHeapObject(arg2)); + wasm.__wbg_function_table.get(286)(arg0, arg1, addHeapObject(arg2)); } function __wbg_elem_binding7(arg0, arg1, arg2, arg3, arg4) { - wasm.__wbg_function_table.get(292)(arg0, arg1, addHeapObject(arg2), arg3, addHeapObject(arg4)); + wasm.__wbg_function_table.get(313)(arg0, arg1, addHeapObject(arg2), arg3, addHeapObject(arg4)); } function __wbg_elem_binding8(arg0, arg1, arg2, arg3) { - wasm.__wbg_function_table.get(296)(arg0, arg1, addHeapObject(arg2), addHeapObject(arg3)); + wasm.__wbg_function_table.get(317)(arg0, arg1, addHeapObject(arg2), addHeapObject(arg3)); } /** */ @@ -228,13 +228,16 @@ function init(module) { imports.wbg.__wbindgen_object_drop_ref = function(arg0) { takeObject(arg0); }; + imports.wbg.__wbindgen_object_clone_ref = function(arg0) { + const ret = getObject(arg0); + return addHeapObject(ret); + }; imports.wbg.__wbindgen_string_new = function(arg0, arg1) { const ret = getStringFromWasm(arg0, arg1); return addHeapObject(ret); }; - imports.wbg.__wbindgen_object_clone_ref = function(arg0) { - const ret = getObject(arg0); - return addHeapObject(ret); + imports.wbg.__wbindgen_cb_forget = function(arg0) { + takeObject(arg0); }; imports.wbg.__wbindgen_cb_drop = function(arg0) { const obj = takeObject(arg0).original; @@ -245,9 +248,6 @@ function init(module) { const ret = false; return ret; }; - imports.wbg.__wbindgen_cb_forget = function(arg0) { - takeObject(arg0); - }; imports.wbg.__wbindgen_json_parse = function(arg0, arg1) { const ret = JSON.parse(getStringFromWasm(arg0, arg1)); return addHeapObject(ret); @@ -884,16 +884,16 @@ function init(module) { imports.wbg.__wbindgen_throw = function(arg0, arg1) { throw new Error(getStringFromWasm(arg0, arg1)); }; - imports.wbg.__wbindgen_closure_wrapper232 = function(arg0, arg1, arg2) { + imports.wbg.__wbindgen_closure_wrapper241 = function(arg0, arg1, arg2) { const state = { a: arg0, b: arg1, cnt: 1 }; const real = (arg0) => { state.cnt++; const a = state.a; state.a = 0; try { - return __wbg_elem_binding3(a, state.b, arg0); + return __wbg_elem_binding2(a, state.b, arg0); } finally { - if (--state.cnt === 0) wasm.__wbg_function_table.get(42)(a, state.b); + if (--state.cnt === 0) wasm.__wbg_function_table.get(56)(a, state.b); else state.a = a; } } @@ -902,16 +902,16 @@ function init(module) { const ret = real; return addHeapObject(ret); }; - imports.wbg.__wbindgen_closure_wrapper541 = function(arg0, arg1, arg2) { + imports.wbg.__wbindgen_closure_wrapper239 = function(arg0, arg1, arg2) { const state = { a: arg0, b: arg1, cnt: 1 }; - const real = () => { + const real = (arg0) => { state.cnt++; const a = state.a; state.a = 0; try { - return __wbg_elem_binding2(a, state.b, ); + return __wbg_elem_binding3(a, state.b, arg0); } finally { - if (--state.cnt === 0) wasm.__wbg_function_table.get(196)(a, state.b); + if (--state.cnt === 0) wasm.__wbg_function_table.get(56)(a, state.b); else state.a = a; } } @@ -920,16 +920,16 @@ function init(module) { const ret = real; return addHeapObject(ret); }; - imports.wbg.__wbindgen_closure_wrapper949 = function(arg0, arg1, arg2) { + imports.wbg.__wbindgen_closure_wrapper243 = function(arg0, arg1, arg2) { const state = { a: arg0, b: arg1, cnt: 1 }; const real = (arg0) => { state.cnt++; const a = state.a; state.a = 0; try { - return __wbg_elem_binding4(a, state.b, arg0); + return __wbg_elem_binding5(a, state.b, arg0); } finally { - if (--state.cnt === 0) wasm.__wbg_function_table.get(266)(a, state.b); + if (--state.cnt === 0) wasm.__wbg_function_table.get(56)(a, state.b); else state.a = a; } } @@ -938,16 +938,16 @@ function init(module) { const ret = real; return addHeapObject(ret); }; - imports.wbg.__wbindgen_closure_wrapper228 = function(arg0, arg1, arg2) { + imports.wbg.__wbindgen_closure_wrapper245 = function(arg0, arg1, arg2) { const state = { a: arg0, b: arg1, cnt: 1 }; const real = (arg0) => { state.cnt++; const a = state.a; state.a = 0; try { - return __wbg_elem_binding0(a, state.b, arg0); + return __wbg_elem_binding1(a, state.b, arg0); } finally { - if (--state.cnt === 0) wasm.__wbg_function_table.get(42)(a, state.b); + if (--state.cnt === 0) wasm.__wbg_function_table.get(56)(a, state.b); else state.a = a; } } @@ -956,16 +956,16 @@ function init(module) { const ret = real; return addHeapObject(ret); }; - imports.wbg.__wbindgen_closure_wrapper236 = function(arg0, arg1, arg2) { + imports.wbg.__wbindgen_closure_wrapper247 = function(arg0, arg1, arg2) { const state = { a: arg0, b: arg1, cnt: 1 }; const real = (arg0) => { state.cnt++; const a = state.a; state.a = 0; try { - return __wbg_elem_binding5(a, state.b, arg0); + return __wbg_elem_binding0(a, state.b, arg0); } finally { - if (--state.cnt === 0) wasm.__wbg_function_table.get(42)(a, state.b); + if (--state.cnt === 0) wasm.__wbg_function_table.get(56)(a, state.b); else state.a = a; } } @@ -974,16 +974,16 @@ function init(module) { const ret = real; return addHeapObject(ret); }; - imports.wbg.__wbindgen_closure_wrapper230 = function(arg0, arg1, arg2) { + imports.wbg.__wbindgen_closure_wrapper607 = function(arg0, arg1, arg2) { const state = { a: arg0, b: arg1, cnt: 1 }; - const real = (arg0) => { + const real = () => { state.cnt++; const a = state.a; state.a = 0; try { - return __wbg_elem_binding1(a, state.b, arg0); + return __wbg_elem_binding4(a, state.b, ); } finally { - if (--state.cnt === 0) wasm.__wbg_function_table.get(42)(a, state.b); + if (--state.cnt === 0) wasm.__wbg_function_table.get(217)(a, state.b); else state.a = a; } } @@ -992,7 +992,7 @@ function init(module) { const ret = real; return addHeapObject(ret); }; - imports.wbg.__wbindgen_closure_wrapper234 = function(arg0, arg1, arg2) { + imports.wbg.__wbindgen_closure_wrapper1018 = function(arg0, arg1, arg2) { const state = { a: arg0, b: arg1, cnt: 1 }; const real = (arg0) => { state.cnt++; @@ -1001,7 +1001,7 @@ function init(module) { try { return __wbg_elem_binding6(a, state.b, arg0); } finally { - if (--state.cnt === 0) wasm.__wbg_function_table.get(42)(a, state.b); + if (--state.cnt === 0) wasm.__wbg_function_table.get(287)(a, state.b); else state.a = a; } } diff --git a/teleterm/static/teleterm_web_bg.wasm b/teleterm/static/teleterm_web_bg.wasm index 320e714..1539609 100644 Binary files a/teleterm/static/teleterm_web_bg.wasm and b/teleterm/static/teleterm_web_bg.wasm differ -- cgit v1.2.3-54-g00ecf