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 2d1e557..0464533 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 c714d54..9245dc8 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 a0353e3..d836ac2 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 4ea48a6..4e1dd26 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;
 }