A field can be a place, and a question can be about one
`type: location` puts a pin on a map and stores {lat, lon, zoom}; a
record that holds one renders as a still, on a desk and in any
resource card. `place:` on a question is the counterpart to `event:`:
event makes a page an occasion with a time, place makes it somewhere,
shows the map under the question, and opens any location field on the
page there instead of on the globe.
Every tile and every still is fetched by portal and served from this
origin (src/maps.rs, MapLibre vendored in public/), so a page with a
map on it still talks to nobody but us: no third-party request, no
consent banner, and the token never leaves the server. MAPBOX_TOKEN
unset turns the whole thing off, the way GARAGE_* does for uploads.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
9ed8194484
commit
4fd60293fa
+169
-3
@@ -366,10 +366,26 @@ fn QuestionView(
|
||||
// (vendored, ~180KB) script runs - loaded once per page, and only
|
||||
// on pages where some alternative actually declares a deck.
|
||||
let needs_swiper = question.alternatives.iter().any(|a| a.images.len() > 1);
|
||||
// MapLibre is vendored and large, so it loads only where a field
|
||||
// actually asks for a place, and only where this instance can
|
||||
// serve tiles at all.
|
||||
// The page's place, in the form a location field opens on.
|
||||
let place_value = question.place.as_ref().map(crate::content::Place::as_value);
|
||||
let needs_map = site.maps
|
||||
&& question.alternatives.iter().any(|a| {
|
||||
a.features.iter().any(|f| f.requirements.iter().any(|r| r.kind == "location"))
|
||||
});
|
||||
|
||||
|
||||
view! {
|
||||
{needs_swiper.then(|| view! { <leptos_meta::Script src="/swiper-element-bundle.min.js"/> })}
|
||||
{needs_map
|
||||
.then(|| {
|
||||
view! {
|
||||
<leptos_meta::Stylesheet href="/maplibre-gl.css" />
|
||||
<leptos_meta::Script src="/maplibre-gl.js" />
|
||||
}
|
||||
})}
|
||||
<Hero
|
||||
title=question.name.clone()
|
||||
description=question.description.clone()
|
||||
@@ -377,6 +393,27 @@ fn QuestionView(
|
||||
site=site.clone()
|
||||
current_id=question_id.clone()
|
||||
/>
|
||||
// A page that is about somewhere says where, under the
|
||||
// question: a still from this origin, and the place in words
|
||||
// for anyone who cannot see it.
|
||||
{question
|
||||
.place
|
||||
.clone()
|
||||
.filter(|_| site.maps)
|
||||
.map(|place| {
|
||||
let name = place.name.clone().unwrap_or_else(|| format!("{}, {}", place.lat, place.lon));
|
||||
view! {
|
||||
<figure class="question-place">
|
||||
<img
|
||||
class="map-still"
|
||||
src=crate::maps::still_url(place.lat, place.lon, place.zoom, 640, 280)
|
||||
alt=format!("Map of {name}")
|
||||
loading="lazy"
|
||||
/>
|
||||
<figcaption>{name}</figcaption>
|
||||
</figure>
|
||||
}
|
||||
})}
|
||||
<div class="alternatives">
|
||||
<For
|
||||
each={
|
||||
@@ -407,6 +444,7 @@ fn QuestionView(
|
||||
alternative=alt
|
||||
parent_hash=parent_hash.clone()
|
||||
query_email=query_email.clone()
|
||||
place=place_value.clone().unwrap_or_default()
|
||||
/>
|
||||
}
|
||||
.into_any()
|
||||
@@ -591,6 +629,30 @@ mod voice {
|
||||
}
|
||||
}
|
||||
|
||||
// The `type: location` map (`map.js`, crate root): the same
|
||||
// hidden-input bridge, and a handle whose `stop()` tears the map down
|
||||
// on SPA navigation - MapLibre keeps a WebGL context and its own
|
||||
// listeners, and a page that has moved on must not keep either.
|
||||
#[cfg(feature = "hydrate")]
|
||||
mod map {
|
||||
use wasm_bindgen::prelude::*;
|
||||
|
||||
#[wasm_bindgen(module = "/map.js")]
|
||||
extern "C" {
|
||||
pub type MapWidget;
|
||||
|
||||
#[wasm_bindgen(js_name = mountMap)]
|
||||
pub fn mount_map(
|
||||
container: &web_sys::HtmlDivElement,
|
||||
hidden: &web_sys::HtmlInputElement,
|
||||
initial: &str,
|
||||
) -> MapWidget;
|
||||
|
||||
#[wasm_bindgen(method)]
|
||||
pub fn stop(this: &MapWidget);
|
||||
}
|
||||
}
|
||||
|
||||
#[cfg(feature = "hydrate")]
|
||||
mod gesture {
|
||||
use wasm_bindgen::prelude::*;
|
||||
@@ -765,7 +827,16 @@ fn AlternativeCard(
|
||||
alternative: Alternative,
|
||||
parent_hash: Option<String>,
|
||||
query_email: Option<String>,
|
||||
/// The page's own place as `lat,lon,zoom`, when it has one: where
|
||||
/// a `type: location` field opens if the field does not say
|
||||
/// otherwise. A question about a street corner should not hand the
|
||||
/// visitor the globe. Empty means the page is about nowhere.
|
||||
#[prop(optional)]
|
||||
place: String,
|
||||
) -> impl IntoView {
|
||||
// Only the browser mounts a map, so the server build never reads it.
|
||||
#[cfg(not(feature = "hydrate"))]
|
||||
let _ = &place;
|
||||
// A link carrying both ?chain= and ?email= against an alternative
|
||||
// that declares a self_transition renders as a one-button
|
||||
// confirmation instead of the normal form - the visitor already
|
||||
@@ -870,7 +941,7 @@ fn AlternativeCard(
|
||||
select_multi.insert(req.name.clone(), req.multiple);
|
||||
} else {
|
||||
// Widget-owned fields hold JSON objects, not strings.
|
||||
if req.kind == "gesture" || req.kind == "voice" {
|
||||
if req.kind == "gesture" || req.kind == "voice" || req.kind == "location" {
|
||||
gesture_fields.insert(req.name.clone());
|
||||
}
|
||||
// A voice field's preset is the key it records at,
|
||||
@@ -1245,6 +1316,60 @@ fn AlternativeCard(
|
||||
.into_any();
|
||||
}
|
||||
|
||||
if req.kind == "location" {
|
||||
let container_ref: NodeRef<leptos::html::Div> = NodeRef::new();
|
||||
let hidden_ref: NodeRef<leptos::html::Input> = NodeRef::new();
|
||||
|
||||
#[cfg(feature = "hydrate")]
|
||||
{
|
||||
// `value` opens the map somewhere useful
|
||||
// ("lat,lon,zoom"); without it the map
|
||||
// opens on the world.
|
||||
let initial = req
|
||||
.value
|
||||
.clone()
|
||||
.filter(|v| !v.is_empty())
|
||||
.unwrap_or_else(|| place.clone());
|
||||
let widget: StoredValue<Option<map::MapWidget>, LocalStorage> =
|
||||
StoredValue::new_local(None);
|
||||
Effect::new(move |_| {
|
||||
let (Some(container), Some(hidden)) =
|
||||
(container_ref.get(), hidden_ref.get())
|
||||
else {
|
||||
return;
|
||||
};
|
||||
if widget.with_value(|w| w.is_some()) {
|
||||
return;
|
||||
}
|
||||
widget.set_value(Some(map::mount_map(
|
||||
&container, &hidden, &initial,
|
||||
)));
|
||||
});
|
||||
on_cleanup(move || {
|
||||
widget.update_value(|opt| {
|
||||
if let Some(w) = opt.take() {
|
||||
w.stop();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
return view! {
|
||||
<div class="field">
|
||||
{label_text}
|
||||
<input
|
||||
id=field_id
|
||||
type="hidden"
|
||||
node_ref=hidden_ref
|
||||
prop:value=move || sig.get()
|
||||
on:input=move |ev| sig.set(event_target_value(&ev))
|
||||
/>
|
||||
<div class="map-wrap" node_ref=container_ref></div>
|
||||
</div>
|
||||
}
|
||||
.into_any();
|
||||
}
|
||||
|
||||
if req.kind == "voice" {
|
||||
let container_ref: NodeRef<leptos::html::Div> = NodeRef::new();
|
||||
let hidden_ref: NodeRef<leptos::html::Input> = NodeRef::new();
|
||||
@@ -1628,9 +1753,17 @@ fn ItemCard(item: serde_json::Value) -> impl IntoView {
|
||||
let audio = text_field(&obj, &["audio"]).filter(|a| a.starts_with("https://"));
|
||||
|
||||
let known = ["name", "title", "description", "url", "html_url", "audio"];
|
||||
// A place renders as a still from this origin, the same as one
|
||||
// stored on a record: the first location field wins, since a card
|
||||
// shows one map.
|
||||
let place = obj
|
||||
.iter()
|
||||
.filter(|(k, _)| !known.contains(&k.as_str()))
|
||||
.find_map(|(_, v)| crate::maps::read(v))
|
||||
.map(|(lat, lon, zoom)| (crate::maps::still_url(lat, lon, zoom, 480, 240), format!("{lat}, {lon}")));
|
||||
let extra: Vec<(String, String)> = obj
|
||||
.iter()
|
||||
.filter(|(k, v)| !known.contains(&k.as_str()) && !v.is_null())
|
||||
.filter(|(k, v)| !known.contains(&k.as_str()) && !v.is_null() && crate::maps::read(v).is_none())
|
||||
.map(|(k, v)| {
|
||||
let text = v.as_str().map(str::to_string).unwrap_or_else(|| v.to_string());
|
||||
(k.clone(), text)
|
||||
@@ -1669,6 +1802,13 @@ fn ItemCard(item: serde_json::Value) -> impl IntoView {
|
||||
{description
|
||||
.map(|d| view! { <p class="item-card-description" inner_html=render_inline_markdown(&d)></p> })}
|
||||
{audio.map(|src| view! { <audio class="item-card-audio" controls preload="none" src=src></audio> })}
|
||||
{place
|
||||
.map(|(src, coords)| {
|
||||
view! {
|
||||
<img class="map-still" src=src alt=format!("Map of {coords}") loading="lazy" />
|
||||
<span class="map-coords">{coords}</span>
|
||||
}
|
||||
})}
|
||||
{(!extra.is_empty())
|
||||
.then(|| {
|
||||
view! {
|
||||
@@ -1849,6 +1989,27 @@ fn AnswerRow(
|
||||
}
|
||||
key=|(k, _)| k.clone()
|
||||
children=move |(key, value)| {
|
||||
// A stored location is a place, so it renders as
|
||||
// one: a still from this origin, with the
|
||||
// coordinates under it for anyone who wants to
|
||||
// put them into something else.
|
||||
if let Some((lat, lon, zoom)) = crate::maps::read(&value) {
|
||||
return view! {
|
||||
<div class="answer-field answer-field-map">
|
||||
<span class="answer-field-key">{key}</span>
|
||||
<span class="answer-field-value">
|
||||
<img
|
||||
class="map-still"
|
||||
src=crate::maps::still_url(lat, lon, zoom, 480, 240)
|
||||
alt=format!("Map of {lat}, {lon}")
|
||||
loading="lazy"
|
||||
/>
|
||||
<span class="map-coords">{format!("{lat}, {lon}")}</span>
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
.into_any();
|
||||
}
|
||||
let text = value.as_str().map(str::to_string).unwrap_or_else(|| value.to_string());
|
||||
view! {
|
||||
<div class="answer-field">
|
||||
@@ -2027,7 +2188,12 @@ pub async fn get_question(
|
||||
pub async fn get_site() -> Result<SiteConfig, ServerFnError> {
|
||||
use crate::server::AppState;
|
||||
let state = expect_context::<AppState>();
|
||||
Ok(state.site.load().as_ref().clone())
|
||||
let mut site = state.site.load().as_ref().clone();
|
||||
// Not content: whether this instance can serve tiles at all is its
|
||||
// own configuration, and the browser has to know before it decides
|
||||
// whether to draw a map or ask for two numbers.
|
||||
site.maps = crate::maps::enabled();
|
||||
Ok(site)
|
||||
}
|
||||
|
||||
/// Every question the visitor may be offered from `current`, as (id,
|
||||
|
||||
Reference in New Issue
Block a user