From ec994a4e654ac7a8a85a7be8660377dab56ad63a Mon Sep 17 00:00:00 2001
From: Arthur Sonzogni <sonzogniarthur@gmail.com>
Date: Sun, 21 Aug 2022 23:04:32 +0200
Subject: [PATCH] Add support for emscripten screen resize. (#463)
This resolves:
https://github.com/ArthurSonzogni/FTXUI/issues/432
---
CHANGELOG.md | 3 ++
examples/index.html | 34 ++++++++++++++++++----
src/ftxui/component/screen_interactive.cpp | 11 +++++++
src/ftxui/screen/terminal.cpp | 5 +++-
4 files changed, 46 insertions(+), 7 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2d1e557a..04645335 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,7 @@ current (development)
requested
- Bugfix: Forward the selected/focused area from the child in gridbox.
- Bugfix: Fix incorrect Canvas computed dimensions.
+- Bugfix: Support `vscroll_indicator` with a zero inner size.
### Component:
- Feature: Add the `Modal` component.
@@ -20,6 +21,8 @@ current (development)
### Screen
- Feature: add `Box::Union(a,b) -> Box`
+- Bugfix: Fix resetting `dim` clashing with resetting of `bold`.
+- Feature: Add emscripten screen resize support.
3.0.0
-----
diff --git a/examples/index.html b/examples/index.html
index c714d54c..9245dc83 100644
--- a/examples/index.html
+++ b/examples/index.html
@@ -4,6 +4,7 @@
<title>FTXUI examples WebAssembly</title>
<script src="https://cdn.jsdelivr.net/npm/xterm@4.18.0/lib/xterm.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/xterm-addon-webgl@0.11.4/lib/xterm-addon-webgl.min.js"></script>
+ <script src="https://cdn.jsdelivr.net/npm/xterm-addon-fit@0.5.0/lib/xterm-addon-fit.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/xterm@4.11.0/css/xterm.css"></link>
<!--Add COOP/COEP via a ServiceWorker to use SharedArrayBuffer-->
<script>
@@ -79,9 +80,12 @@
}
}
const term = new Terminal();
- term.open(document.querySelector('#terminal'));
- term.resize(140,43);
- term.loadAddon(new (WebglAddon.WebglAddon)());
+ const term_element = document.querySelector('#terminal');
+ term.open(term_element);
+
+ const webgl_addon = new (WebglAddon.WebglAddon)();
+ term.loadAddon(webgl_addon);
+
const onBinary = e => {
for(c of e)
stdin_buffer.push(c.charCodeAt(0));
@@ -93,7 +97,23 @@
FS.init(stdin, stdout, stderr);
},
postRun: [],
- onRuntimeInitialized: () => {},
+ onRuntimeInitialized: () => {
+ // Handle screen resize:
+ const fit_addon = new (FitAddon.FitAddon)();
+ term.loadAddon(fit_addon);
+ fit_addon.fit();
+ const resize_handler = () => {
+ const {cols, rows} = fit_addon.proposeDimensions();
+ term.resize(cols, rows);
+ window.Module._ftxui_on_resize(cols, rows);
+ };
+ const resize_observer = new ResizeObserver(resize_handler);
+ resize_observer.observe(term_element);
+ resize_handler();
+
+ // Disable scrollbar
+ term.write('\x1b[?47h')
+ },
};
const words = example.split('/')
@@ -137,9 +157,11 @@
}
#terminal {
- padding:10px;
+ width:100%;
+ height: 500px;
+ height: calc(clamp(200px, 100vh - 300px, 900px));
+ overflow: hidden;
border:none;
- background-color:black;
padding:auto;
}
diff --git a/src/ftxui/component/screen_interactive.cpp b/src/ftxui/component/screen_interactive.cpp
index a0353e37..d836ac27 100644
--- a/src/ftxui/component/screen_interactive.cpp
+++ b/src/ftxui/component/screen_interactive.cpp
@@ -135,6 +135,17 @@ void EventListener(std::atomic<bool>* quit, Sender<Task> out) {
}
}
+extern "C" {
+ EMSCRIPTEN_KEEPALIVE
+ void ftxui_on_resize(int columns, int rows) {
+ Terminal::SetFallbackSize({
+ columns,
+ rows,
+ });
+ std::raise(SIGWINCH);
+ }
+}
+
#else
#include <sys/time.h> // for timeval
diff --git a/src/ftxui/screen/terminal.cpp b/src/ftxui/screen/terminal.cpp
index 4ea48a6b..4e1dd263 100644
--- a/src/ftxui/screen/terminal.cpp
+++ b/src/ftxui/screen/terminal.cpp
@@ -38,7 +38,10 @@ Dimensions& FallbackSize() {
constexpr int fallback_width = 80;
constexpr int fallback_height = 24;
#endif
- static Dimensions g_fallback_size{fallback_width, fallback_height};
+ static Dimensions g_fallback_size{
+ fallback_width,
+ fallback_height,
+ };
return g_fallback_size;
}
--
GitLab