dsh-remotion 0.3.4 → 0.4.0

package/skills/remotion-best-practices/remotion-maps/REFERENCE.md

@@ -1,36 +1,36 @@
----
-name: remotion-maps
-description: Remotion Map animation knowledge
-version: 4.0.529
----
-
-# Remotion Maps
-
-Choose exactly one technique from the intended shot, then load only that technique's `TECHNIQUE.md`.
-Every technique directory is self-contained and may be removed without breaking the others.
-
-## [Static map](techniques/static-map/TECHNIQUE.md)
-
-- Requires you grab a satellite image and mount it in a `<Img>` tag, and animate on top
-
-## [Mapbox](techniques/mapbox/TECHNIQUE.md)
-
-- Requires a Mapbox key
-- Nicer styles by default
-- Map can display a round globe when zoomed out
-- Includes nice 3D buildings such as the Eiffel tower
-
-## [MapLibre](techniques/maplibre/TECHNIQUE.md)
-
-- Requires no API key, fully free
-- Does not include 3D building
-
-## [MapTiler](techniques/maptiler/TECHNIQUE.md)
-
-- Uses MapTiler
-- Annotations can be drawn on top of geographic features: borders, rivers, labels
-
-## [CesiumJS](techniques/cesium/TECHNIQUE.md)
-
-- Flythroughs through terrain and mountains
-- "Flight simulator" perspective
+---
+name: remotion-maps
+description: Remotion Map animation knowledge
+version: 4.0.529
+---
+
+# Remotion Maps
+
+Choose exactly one technique from the intended shot, then load only that technique's `TECHNIQUE.md`.
+Every technique directory is self-contained and may be removed without breaking the others.
+
+## [Static map](techniques/static-map/TECHNIQUE.md)
+
+- Requires you grab a satellite image and mount it in a `<Img>` tag, and animate on top
+
+## [Mapbox](techniques/mapbox/TECHNIQUE.md)
+
+- Requires a Mapbox key
+- Nicer styles by default
+- Map can display a round globe when zoomed out
+- Includes nice 3D buildings such as the Eiffel tower
+
+## [MapLibre](techniques/maplibre/TECHNIQUE.md)
+
+- Requires no API key, fully free
+- Does not include 3D building
+
+## [MapTiler](techniques/maptiler/TECHNIQUE.md)
+
+- Uses MapTiler
+- Annotations can be drawn on top of geographic features: borders, rivers, labels
+
+## [CesiumJS](techniques/cesium/TECHNIQUE.md)
+
+- Flythroughs through terrain and mountains
+- "Flight simulator" perspective

package/skills/remotion-best-practices/remotion-maps/agents/openai.yaml

@@ -1,7 +1,7 @@
-interface:
-  display_name: '/remotion-maps'
-  short_description: 'Create animated maps in Remotion videos'
-  icon_small: './assets/remotion-icon.svg'
-  icon_large: './assets/remotion-icon.svg'
-  brand_color: '#0B84F3'
-  default_prompt: '$remotion-maps: Animate a dot from Zurich to New York.'
+interface:
+  display_name: '/remotion-maps'
+  short_description: 'Create animated maps in Remotion videos'
+  icon_small: './assets/remotion-icon.svg'
+  icon_large: './assets/remotion-icon.svg'
+  brand_color: '#0B84F3'
+  default_prompt: '$remotion-maps: Animate a dot from Zurich to New York.'

package/skills/remotion-best-practices/remotion-maps/assets/remotion-icon.svg

@@ -1,4 +1,4 @@
-<svg width="100" height="100" viewBox="20 30 363 363" xmlns="http://www.w3.org/2000/svg">
-<title>Remotion</title>
-<path d="M148.332 92.9015C143.307 93.1742 139.259 93.9713 135.179 95.5236C133.144 96.2893 129.809 97.957 127.973 99.1108C120.295 103.925 114.443 111.162 111.391 119.584C110.782 121.252 109.136 126.57 108.076 130.23C101.018 154.7 97.0112 181.456 96.1511 209.776C96.0148 214.286 96.0148 225.026 96.1511 229.463C96.728 248.237 98.5216 265.187 101.773 282.472C103.095 289.468 105.213 298.866 106.44 303.135C108.947 311.809 114.065 319.193 121.344 324.605C126.221 328.234 131.759 330.668 137.895 331.863C140.853 332.44 144.755 332.702 147.629 332.514C151.604 332.251 159.491 331.192 165.9 330.049C194.786 324.899 221.469 315.679 245.666 302.485C260.99 294.125 274.09 285.074 286.729 274.092C299.326 263.163 310.066 251.405 319.516 238.21C321.708 235.158 322.81 233.375 323.911 231.131C326.743 225.341 328.075 219.583 328.064 213.143C328.064 207.143 326.932 201.815 324.488 196.361C323.313 193.728 322.191 191.84 319.674 188.253C310.402 175.048 300.112 163.542 287.568 152.361C268.122 135.034 245.026 120.822 219.235 110.302C213.644 108.026 208.138 106.022 201.509 103.851C187.475 99.2681 170.106 95.2929 155.411 93.3105C153.104 92.9959 149.968 92.8176 148.332 92.9015Z" fill="#0B84F3"/>
-</svg>
+<svg width="100" height="100" viewBox="20 30 363 363" xmlns="http://www.w3.org/2000/svg">
+<title>Remotion</title>
+<path d="M148.332 92.9015C143.307 93.1742 139.259 93.9713 135.179 95.5236C133.144 96.2893 129.809 97.957 127.973 99.1108C120.295 103.925 114.443 111.162 111.391 119.584C110.782 121.252 109.136 126.57 108.076 130.23C101.018 154.7 97.0112 181.456 96.1511 209.776C96.0148 214.286 96.0148 225.026 96.1511 229.463C96.728 248.237 98.5216 265.187 101.773 282.472C103.095 289.468 105.213 298.866 106.44 303.135C108.947 311.809 114.065 319.193 121.344 324.605C126.221 328.234 131.759 330.668 137.895 331.863C140.853 332.44 144.755 332.702 147.629 332.514C151.604 332.251 159.491 331.192 165.9 330.049C194.786 324.899 221.469 315.679 245.666 302.485C260.99 294.125 274.09 285.074 286.729 274.092C299.326 263.163 310.066 251.405 319.516 238.21C321.708 235.158 322.81 233.375 323.911 231.131C326.743 225.341 328.075 219.583 328.064 213.143C328.064 207.143 326.932 201.815 324.488 196.361C323.313 193.728 322.191 191.84 319.674 188.253C310.402 175.048 300.112 163.542 287.568 152.361C268.122 135.034 245.026 120.822 219.235 110.302C213.644 108.026 208.138 106.022 201.509 103.851C187.475 99.2681 170.106 95.2929 155.411 93.3105C153.104 92.9959 149.968 92.8176 148.332 92.9015Z" fill="#0B84F3"/>
+</svg>

package/skills/remotion-best-practices/remotion-maps/techniques/cesium/TECHNIQUE.md

@@ -1,89 +1,89 @@
-# CesiumJS — 3D flyovers in Remotion
-
-Instructions for achieving map animations with "flight-simulator" perspective in Remotion.
-
-## Modes
-
-| Mode        | Data                                                  | Use for                                                |
-| ----------- | ----------------------------------------------------- | ------------------------------------------------------ |
-| `landscape` | MapTiler `terrain-quantized-mesh-v2` + `satellite-v2` | Mountains, gorges, rivers, coastlines and rural routes |
-| `city`      | Google Photorealistic 3D Tiles                        | Cities, architecture and recognizable landmarks        |
-
-Do not use footprint extrusions for city flyovers. They produce crude building blocks rather than
-textured architecture.
-
-## Credentials
-
-For `landscape`, set:
-
-```text
-REMOTION_MAPTILER_KEY=...
-```
-
-Create a MapTiler key at https://cloud.maptiler.com/account/keys/.
-
-For `city`, set:
-
-```text
-REMOTION_GOOGLE_MAPS_API_KEY=...
-```
-
-Create a billing-enabled Google Map Tiles API key by following
-https://developers.google.com/maps/documentation/tile/get-api-key. Enable the **Map Tiles API** and
-restrict the key to that API. Ensure its application restriction permits local headless Remotion
-requests.
-
-## Build the flight
-
-1. Copy `assets/CesiumFlythrough.tsx`, a path JSON and `assets/example-Root.tsx` into the Remotion
-   project, or import the component directly.
-2. Supply the camera route as `[longitude, latitude][]`. Use only meaningful control points; do not hand-author dozens of tiny corrections.
-3. Leave `pathSmoothingPasses={3}` initially. The component applies repeated Chaikin corner cutting, turning straight-then-corner input into a continuous swerve. Increase to `4` for a softer route or reduce to `2` when the camera must follow a tight corridor.
-4. Set absolute camera altitudes for the location. City cameras normally fly lower than landscape
-   cameras.
-5. Render a middle-frame still before rendering the full video.
-
-```tsx
-<CesiumFlythrough
-  mode="city"
-  path={cameraPath}
-  pathSmoothingPasses={3}
-  altitudeStart={700}
-  altitudeEnd={500}
-  lookAheadKm={0.7}
-  travelKm={4.5}
-/>
-```
-
-## Camera behavior
-
-Walk the smoothed curve by arc length for constant ground speed. Aim at a real point farther along
-the curve rather than its next vertex. Derive roll from the change in look-ahead bearing so the
-camera banks into a turn instead of twitching left and right.
-
-For landscape routes, `scripts/prep-cesium-path.mjs` also clips, resamples, smooths and dampens a
-GeoJSON centerline before the component applies its final curve smoothing.
-
-
-## Mechanics
-
-- Set `viewer.useDefaultRenderLoop = false`.
-- Call `viewer.render()`, never `scene.render()`, while settling.
-- Use `preserveDrawingBuffer: true`.
-- Gate initialization and every frame with `delayRender`.
-- Drive camera animation from `useCurrentFrame()`; do not use CSS transitions or browser-timed animation.
-- Settle landscapes on `globe.tilesLoaded` and cities on `tileset.tilesLoaded`.
-- Keep all provider attribution visible.
-- Record the source and effective date of custom or disputed geography.
-- Inspect rendered pixels, not only Studio playback, at every required aspect ratio.
-- Read `references/3d-flyover-architecture.md` for camera math, `references/3d-data-sources.md` for provider details, and `references/3d-troubleshooting.md` for blank, coarse, unauthorized or timed-out renders.
-
-## Files
-
-- `assets/CesiumFlythrough.tsx` — reusable two-mode component.
-- `assets/flight-path.ts` — dependency-free Chaikin route smoothing.
-- `assets/example-Root.tsx` — landscape and city compositions.
-- `assets/cesium-path.json` — sample landscape route.
-- `assets/city-path.json` — sample city route.
-- `assets/sample-river.geojson` — sample path-preparation input.
-- `scripts/prep-cesium-path.mjs` — dependency-free landscape route preparation.
+# CesiumJS — 3D flyovers in Remotion
+
+Instructions for achieving map animations with "flight-simulator" perspective in Remotion.
+
+## Modes
+
+| Mode        | Data                                                  | Use for                                                |
+| ----------- | ----------------------------------------------------- | ------------------------------------------------------ |
+| `landscape` | MapTiler `terrain-quantized-mesh-v2` + `satellite-v2` | Mountains, gorges, rivers, coastlines and rural routes |
+| `city`      | Google Photorealistic 3D Tiles                        | Cities, architecture and recognizable landmarks        |
+
+Do not use footprint extrusions for city flyovers. They produce crude building blocks rather than
+textured architecture.
+
+## Credentials
+
+For `landscape`, set:
+
+```text
+REMOTION_MAPTILER_KEY=...
+```
+
+Create a MapTiler key at https://cloud.maptiler.com/account/keys/.
+
+For `city`, set:
+
+```text
+REMOTION_GOOGLE_MAPS_API_KEY=...
+```
+
+Create a billing-enabled Google Map Tiles API key by following
+https://developers.google.com/maps/documentation/tile/get-api-key. Enable the **Map Tiles API** and
+restrict the key to that API. Ensure its application restriction permits local headless Remotion
+requests.
+
+## Build the flight
+
+1. Copy `assets/CesiumFlythrough.tsx`, a path JSON and `assets/example-Root.tsx` into the Remotion
+   project, or import the component directly.
+2. Supply the camera route as `[longitude, latitude][]`. Use only meaningful control points; do not hand-author dozens of tiny corrections.
+3. Leave `pathSmoothingPasses={3}` initially. The component applies repeated Chaikin corner cutting, turning straight-then-corner input into a continuous swerve. Increase to `4` for a softer route or reduce to `2` when the camera must follow a tight corridor.
+4. Set absolute camera altitudes for the location. City cameras normally fly lower than landscape
+   cameras.
+5. Render a middle-frame still before rendering the full video.
+
+```tsx
+<CesiumFlythrough
+  mode="city"
+  path={cameraPath}
+  pathSmoothingPasses={3}
+  altitudeStart={700}
+  altitudeEnd={500}
+  lookAheadKm={0.7}
+  travelKm={4.5}
+/>
+```
+
+## Camera behavior
+
+Walk the smoothed curve by arc length for constant ground speed. Aim at a real point farther along
+the curve rather than its next vertex. Derive roll from the change in look-ahead bearing so the
+camera banks into a turn instead of twitching left and right.
+
+For landscape routes, `scripts/prep-cesium-path.mjs` also clips, resamples, smooths and dampens a
+GeoJSON centerline before the component applies its final curve smoothing.
+
+
+## Mechanics
+
+- Set `viewer.useDefaultRenderLoop = false`.
+- Call `viewer.render()`, never `scene.render()`, while settling.
+- Use `preserveDrawingBuffer: true`.
+- Gate initialization and every frame with `delayRender`.
+- Drive camera animation from `useCurrentFrame()`; do not use CSS transitions or browser-timed animation.
+- Settle landscapes on `globe.tilesLoaded` and cities on `tileset.tilesLoaded`.
+- Keep all provider attribution visible.
+- Record the source and effective date of custom or disputed geography.
+- Inspect rendered pixels, not only Studio playback, at every required aspect ratio.
+- Read `references/3d-flyover-architecture.md` for camera math, `references/3d-data-sources.md` for provider details, and `references/3d-troubleshooting.md` for blank, coarse, unauthorized or timed-out renders.
+
+## Files
+
+- `assets/CesiumFlythrough.tsx` — reusable two-mode component.
+- `assets/flight-path.ts` — dependency-free Chaikin route smoothing.
+- `assets/example-Root.tsx` — landscape and city compositions.
+- `assets/cesium-path.json` — sample landscape route.
+- `assets/city-path.json` — sample city route.
+- `assets/sample-river.geojson` — sample path-preparation input.
+- `scripts/prep-cesium-path.mjs` — dependency-free landscape route preparation.