- new snippet geo_map_render.js: [map] inline geomaps (tree order, tint, theme-following), [gpx] stats card + elevation profile with hover cursor (km from start, d-height, vertical guide), [yt] privacy click-to-load facade, [video]/[audio] inline players fed from the new geoData indexes - 3d_model_viewer.js: [cad] keyword + title/ID resolution via geoData.cad, sizes/captions, real occt-wasm ESM pair (fixes 'STEP worker error'), code-span-safe keyword scan (docs can show examples) - blog_generator.js: buildGeoData() v6 – maps (geolocation + geoShape point/line/polygon + child GPX tracks), gpx/cad/media indexes, branch-change rebuild for route reordering - generated/geo_data.js placeholder; docs/embed-keywords.md (new) + embed-3d-model Option D; README layout/wiring/notes tables updated - license: runtime components (MapLibre ISC, VersaTiles MIT/ODbL, YouTube) - hygiene: removed leaked note IDs and instance domain from theme docs
52 lines
3.4 KiB
Markdown
52 lines
3.4 KiB
Markdown
# Inline embed keywords (map / gpx / cad / yt / video / audio)
|
|
|
|
The share renders small **text keywords** into interactive widgets, client-side, from two
|
|
`shareHtml` snippets: `scripts/geo_map_render.js` (`map`, `gpx`, `yt`, `video`, `audio`) and
|
|
`scripts/3d_model_viewer.js` (`cad`). Keywords are plain text, so they survive editor re-saves —
|
|
no raw HTML needed. Put one keyword **on its own line** (recommended) or inline in a sentence.
|
|
|
|
A keyword is ignored when it sits inside `code`/`pre` (that is how this file shows examples).
|
|
|
|
## Syntax
|
|
|
|
```
|
|
[map <id|title>] # geomap, optional: |small|medium|large
|
|
[gpx <id|title>] # track stats card + elevation profile, optional: |Custom title
|
|
[cad <id|title>] # 3D model viewer, optional: |small|medium|large or |Caption
|
|
[yt <videoId|url>] # YouTube click-to-load facade, optional: |Caption
|
|
[video <id|title>] # inline video player, optional: |Caption
|
|
[audio <id|title>] # inline audio player, optional: |Caption
|
|
```
|
|
|
|
`<id|title>` is either the **note ID** (12 chars) or the **note title / file name**
|
|
(case-insensitive; file extension optional).
|
|
|
|
## Requirements per keyword
|
|
|
|
| Keyword | References | Notes |
|
|
|---|---|---|
|
|
| `map` | a geoMap book note (`#viewType=geoMap` + `#publish=true`) | points via child `#geolocation` / `#geo:position` / `#geoShape` or child `.gpx` files; tree order = route order; reorder children in Trilium → auto refresh (`~runOnBranchChange`) |
|
|
| `gpx` | any `.gpx` **file note** in the blog tree | stats: distance, ascent/descent (0.5 m deadband), elevation range, duration, avg speed, pace (needs `<time>` in track points) + hover cursor on the profile (km from start · Δheight from start) |
|
|
| `cad` | `.stl` / `.step` / `.stp` file note | extension may live in the note title **or** `#originalFileName`; STEP parsed by occt-wasm in a module worker (~22 MB on first load) |
|
|
| `yt` | YouTube video ID or URL (`youtu.be`, `watch?v=`, `/shorts/`) | only the thumbnail loads initially; player comes from `youtube-nocookie.com` on click |
|
|
| `video` | `.mp4` / `.webm` / `.mov` / `.m4v` file note | use **faststart** MP4 (moov first). Trilium ignores `Range` requests → seeking may re-buffer |
|
|
| `audio` | `.mp3` / `.ogg` / `.oga` / `.wav` / `.flac` / `.m4a` / `.aac` / `.opus` file note | streamed from `api/notes/<id>/download` |
|
|
|
|
`gpx` (as card), `cad`, `video` and `audio` resolve through the **`geoData` indexes**
|
|
(`maps`, `gpx`, `cad`, `media`) which `blog_generator.js` builds automatically — so the files
|
|
must live somewhere **inside the blog tree** (they do not need their own `publish` label).
|
|
|
|
## Theme
|
|
|
|
Maps, GPX cards, players and captions follow the blog's day/night toggle
|
|
(`theme-dark` / `theme-light` class on `<html>`), **not** the OS setting. Map basemaps are
|
|
VersaTiles `muted` ("neutron" look) in day mode, CSS-inverted at night; a subtle sage/bone
|
|
tint overlay sits on the map in day mode only.
|
|
|
|
## Styling knobs (geo map render)
|
|
|
|
- map height: `[map x|small]` ≈ 280 px, `medium` ≈ 440 px, default `min(70vh, 640px)`, `large` ≈ 620 px (Cad: same words via `CAD_HEIGHTS`)
|
|
- map style label on the book note: `#map:style=auto|muted|neutron|osm-bright|liberty`
|
|
- tint: `.blog-geo-map::after` gradient + `mix-blend-mode: multiply`
|
|
- 3D shading: append `?render=normal` to the page URL to disable the electron-microscope shader
|