T44d Web · Gallery builds for wasm32: one story per section by URL, themed by the host

The gallery's entry runs natively or, on wasm32, from a wasm_bindgen start
through gpui_web, single-threaded with WebGL2 fallback. ?page, ?story and
?theme choose what shows; an unknown one fails in the page and the log.
set_theme switches the mode later. Pictures load from ELY_GALLERY_ASSETS.
scripts/stories.py writes examples/gallery/stories.json from the pages.

examples/gallery/pages/terminal/live.rs

@@ -16,7 +16,7 @@ use gpui::{
 
 use crate::{
     probe::probe,
-    ui::{keep, section, set},
+    ui::{keep, set},
 };
 
 /// A build's output as a terminal printed it, colors and all.
@@ -84,7 +84,8 @@ fn field(key: &'static str, text: &str, window: &mut Window, cx: &mut App) -> En
     })
 }
 
-pub fn live(window: &mut Window, cx: &mut App) -> impl IntoElement + use<> {
+/// The shell and the build's output, in tabs.
+pub fn shell(window: &mut Window, cx: &mut App) -> impl IntoElement + use<> {
     let tab = keep("terminal-tab", || SharedString::from("shell"), window, cx);
     let shell = keep("terminal-shell-choice", || (0usize, 0usize), window, cx);
     let (now_tab, (now_shell, start)) = (tab.read(cx).clone(), *shell.read(cx));
@@ -155,12 +156,7 @@ pub fn live(window: &mut Window, cx: &mut App) -> impl IntoElement + use<> {
         None => find,
     };
     let theme = cx.theme();
-    section(
-        "Terminal / TerminalTabs / TerminalSplit / TerminalToolbar / ShellSelector / TerminalSearch / TerminalLink",
-        "A real shell on a pseudo-terminal, drawn cell by cell in the theme's sixteen colors. Tabs hold shells and output; split for another shell beside it. Find lights every match through the scrollback. Cmd-press a link or a path:line.",
-        cx,
-    )
-    .child(
+    div().child(
         div()
             .w(px(840.))
             .rounded(theme.radius(Radius::Md))

examples/gallery/pages/terminal/mod.rs

@@ -1,11 +1,12 @@
 mod blocks;
+#[cfg(not(target_family = "wasm"))]
 mod live;
 mod panels;
 
 use gpui::{AnyElement, App, IntoElement, ParentElement, Window, div};
 
 use super::Page;
-use crate::script::Step;
+use crate::{step::Step, ui::section};
 
 pub const PAGE: Page = Page {
     number: 18,
@@ -36,9 +37,28 @@ const SCRIPT: &[Step] = &[
     Step::Rest,
 ];
 
+/// A live shell natively; a browser runs no processes, so there it says so.
+fn live(window: &mut Window, cx: &mut App) -> impl IntoElement + use<> {
+    let section = section(
+        "Terminal / TerminalTabs / TerminalSplit / TerminalToolbar / ShellSelector / TerminalSearch / TerminalLink",
+        "A real shell on a pseudo-terminal, drawn cell by cell in the theme's sixteen colors. Tabs hold shells and output; split for another shell beside it. Find lights every match through the scrollback. Cmd-press a link or a path:line.",
+        cx,
+    );
+    #[cfg(not(target_family = "wasm"))]
+    return section.child(live::shell(window, cx));
+    #[cfg(target_family = "wasm")]
+    {
+        let _ = window;
+        section.child(crate::ui::blocked(
+            "A browser starts no processes and has no pseudo-terminal, so no shell runs here, and alacritty's grid, which draws the build's output, does not build for the web. The blocks, colored output, logs and processes below draw without one.",
+            cx,
+        ))
+    }
+}
+
 fn render(window: &mut Window, cx: &mut App) -> AnyElement {
     div()
-        .child(live::live(window, cx))
+        .child(live(window, cx))
         .child(blocks::blocks(window, cx))
         .child(blocks::ansi(cx))
         .child(panels::logs(window, cx))