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/documents/editing.rs

@@ -12,10 +12,7 @@ use crate::{
     ui::{keep, section, set},
 };
 
-const ATRIUM: &str = concat!(
-    env!("CARGO_MANIFEST_DIR"),
-    "/examples/gallery/assets/atrium.jpg"
-);
+const ATRIUM: &str = asset!("atrium.jpg");
 
 const PEOPLE: [&str; 4] = ["ada", "grace", "linus", "margaret"];
 

examples/gallery/pages/documents/knowledge.rs

@@ -20,18 +20,9 @@ use crate::{
 };
 
 const COVERS: [&str; 3] = [
-    concat!(
-        env!("CARGO_MANIFEST_DIR"),
-        "/examples/gallery/assets/atrium.jpg"
-    ),
-    concat!(
-        env!("CARGO_MANIFEST_DIR"),
-        "/examples/gallery/assets/dunes.jpg"
-    ),
-    concat!(
-        env!("CARGO_MANIFEST_DIR"),
-        "/examples/gallery/assets/atrium-olive.jpg"
-    ),
+    asset!("atrium.jpg"),
+    asset!("dunes.jpg"),
+    asset!("atrium-olive.jpg"),
 ];
 
 fn favorite(key: &str, icon: &str, title: &str) -> Favorite {

examples/gallery/pages/documents/mod.rs

@@ -5,7 +5,7 @@ mod reading;
 use gpui::{AnyElement, App, IntoElement, ParentElement, Window, div};
 
 use super::Page;
-use crate::script::Step;
+use crate::step::Step;
 
 pub const PAGE: Page = Page {
     number: 21,

examples/gallery/pages/documents/reading.rs

@@ -22,26 +22,8 @@ use crate::{
     ui::{keep, section, set},
 };
 
-const PAGES: [&str; 2] = [
-    concat!(
-        env!("CARGO_MANIFEST_DIR"),
-        "/examples/gallery/assets/pages/lift-1.png"
-    ),
-    concat!(
-        env!("CARGO_MANIFEST_DIR"),
-        "/examples/gallery/assets/pages/lift-2.png"
-    ),
-];
-const SLIDES: [&str; 2] = [
-    concat!(
-        env!("CARGO_MANIFEST_DIR"),
-        "/examples/gallery/assets/pages/slide-1.png"
-    ),
-    concat!(
-        env!("CARGO_MANIFEST_DIR"),
-        "/examples/gallery/assets/pages/slide-2.png"
-    ),
-];
+const PAGES: [&str; 2] = [asset!("pages/lift-1.png"), asset!("pages/lift-2.png")];
+const SLIDES: [&str; 2] = [asset!("pages/slide-1.png"), asset!("pages/slide-2.png")];
 const WORDS: &str = include_str!("../../assets/pages/lift.json");
 
 const GUIDE: &str = "# Lift\n\nA lift blends a color toward white.\n\n## In light\n\nPaper white under ink near black; accents at half a lift.\n\n## In dark\n\nWarm charcoal under off-white text; accents lift further, so they read with the same weight.\n\n### Surfaces\n\nA card sits one lift above the page, a menu one above the card.\n\n## In motion\n\nHover, press and focus are lifts of the accent, eased on one scale of durations.\n\n## Closing\n\nWhatever the hue, a step of lift means the same step of emphasis.";