@gramps-connect/story 0.3.0 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +23 -5
- package/dist/editor.js +2065 -177
- package/dist/editor.js.map +4 -4
- package/dist/embed.js +1 -1
- package/dist/map-edit.js +361 -0
- package/dist/map-edit.js.map +7 -0
- package/dist/player.js +3 -1
- package/dist/player.js.map +2 -2
- package/dist/types/editor/MapEditor.d.ts +89 -0
- package/dist/types/editor/PlaceField.d.ts +24 -0
- package/dist/types/editor/PlaceMap.d.ts +12 -0
- package/dist/types/editor/PlaceMapDialog.d.ts +18 -0
- package/dist/types/editor/StoryEditor.d.ts +8 -1
- package/dist/types/editor/index.d.ts +7 -1
- package/dist/types/editor/mapEditorStrings.d.ts +50 -0
- package/dist/types/editor/model.d.ts +17 -1
- package/dist/types/editor/placeSearch.d.ts +22 -0
- package/dist/types/editor/placeShapes.d.ts +13 -0
- package/dist/types/editor/strings.d.ts +28 -0
- package/dist/types/mapEdit/geometry.d.ts +91 -0
- package/dist/types/mapEdit/index.d.ts +3 -0
- package/dist/types/mapEdit/mapFile.d.ts +77 -0
- package/dist/types/mapEdit/model.d.ts +55 -0
- package/package.json +18 -2
- package/src/editor/MapEditor.tsx +1545 -0
- package/src/editor/PlaceField.tsx +170 -0
- package/src/editor/PlaceMap.tsx +88 -0
- package/src/editor/PlaceMapDialog.tsx +228 -0
- package/src/editor/StoryEditor.tsx +50 -14
- package/src/editor/index.ts +11 -2
- package/src/editor/mapEditorStrings.ts +109 -0
- package/src/editor/model.ts +38 -1
- package/src/editor/placeSearch.ts +61 -0
- package/src/editor/placeShapes.ts +63 -0
- package/src/editor/strings.ts +56 -0
- package/src/mapEdit/geometry.ts +211 -0
- package/src/mapEdit/index.ts +15 -0
- package/src/mapEdit/mapFile.ts +199 -0
- package/src/mapEdit/model.ts +250 -0
- package/src/player/MapBackground.tsx +3 -1
package/README.md
CHANGED
|
@@ -15,9 +15,10 @@ writes them and presents them with this package's player.
|
|
|
15
15
|
Everything happens in the browser: an opened story is never uploaded.
|
|
16
16
|
- **Change a story, or make one:** the Story Editor, at
|
|
17
17
|
**https://dsblank.github.io/gramps-connect-stories/edit.html** (or
|
|
18
|
-
**Edit** on an open story in the viewer). Titles, dates, text, photos
|
|
19
|
-
and the order of slides; it saves a new `.story.zip`, back into
|
|
20
|
-
in Chrome and Edge. Also entirely in the browser
|
|
18
|
+
**Edit** on an open story in the viewer). Titles, dates, text, photos,
|
|
19
|
+
places, shapes and old maps on the map, and the order of slides; it saves a new `.story.zip`, back into
|
|
20
|
+
the opened file in Chrome and Edge. Also entirely in the browser, except
|
|
21
|
+
a place search on Wikidata when you ask for one.
|
|
21
22
|
- **Put a story on a web page:** the [`<gramps-connect-story>`](#on-any-web-page-gramps-connect-story)
|
|
22
23
|
element.
|
|
23
24
|
- **Format specification:** [`spec/1.0/README.md`](spec/1.0/README.md)
|
|
@@ -142,7 +143,7 @@ needed only by the player. With TypeScript 6 or later, add `"geojson"` to
|
|
|
142
143
|
## The editor: `@gramps-connect/story/editor`
|
|
143
144
|
|
|
144
145
|
A React component that edits a story: the slides on the left (drag to
|
|
145
|
-
reorder), the selected slide's title, date, text and photos in the middle,
|
|
146
|
+
reorder), the selected slide's title, date, text, place and photos in the middle,
|
|
146
147
|
and the player on the right showing it as it changes, with undo and redo
|
|
147
148
|
and the format's validation as you go. Photos are added by picking,
|
|
148
149
|
dropping or pasting, prepared in the browser (`optimizeImage`: resized,
|
|
@@ -174,11 +175,28 @@ Gramps' own date parser, in all of Gramps' languages. Pass
|
|
|
174
175
|
`parseDateText` to use another. Fields the editor doesn't know are kept as
|
|
175
176
|
they are, so opening and saving a story never loses anything.
|
|
176
177
|
|
|
178
|
+
A place is a name and a point: click the map or drag the pin, type the
|
|
179
|
+
coordinates, or pick one of the story's other places to use the very same
|
|
180
|
+
one (its shape and map overlays too). **Find on Wikidata** looks the name
|
|
181
|
+
up and puts the pin there; it's the only thing the editor sends anywhere,
|
|
182
|
+
the name only, and only when clicked. Pass `placeSearch` to use another
|
|
183
|
+
service, or `placeSearch={null}` to leave it out.
|
|
184
|
+
|
|
185
|
+
**Edit map** opens the place's map full screen: draw shapes (points,
|
|
186
|
+
lines, areas) or import them from a KML, GPX or GeoJSON file, and lay
|
|
187
|
+
scans of old maps over it (stored at up to 2048px, PNG when they have
|
|
188
|
+
transparency), moving, resizing, rotating or dragging their corners to
|
|
189
|
+
line them up, with the years each one shows. The map editor itself is
|
|
190
|
+
`MapEditor`, which Gramps Connect's own map overlay editor uses too; the
|
|
191
|
+
plain functions behind it (map files, the shape model, overlay geometry)
|
|
192
|
+
are `@gramps-connect/story/map-edit`. The editor also needs `terra-draw`
|
|
193
|
+
and `terra-draw-maplibre-gl-adapter` (optional peer dependencies).
|
|
194
|
+
|
|
177
195
|
The editor is built with [Mantine](https://mantine.dev) 8 (optional peer
|
|
178
196
|
dependencies `@mantine/core` and `@mantine/hooks`, needed only by the
|
|
179
197
|
editor): wrap it in a `MantineProvider` and load Mantine's stylesheet. The
|
|
180
198
|
pieces it's made of (`SlideList`, `StoryTextField`, `DateField`,
|
|
181
|
-
`PhotosField`) and its editing functions (`addSlide`, `moveSlide`,
|
|
199
|
+
`PlaceField`, `PhotosField`, `MapEditor`, `PlaceMapDialog`) and its editing functions (`addSlide`, `moveSlide`,
|
|
182
200
|
`updateSlide`, `addImage`, undo history, ...) are exported too.
|
|
183
201
|
|
|
184
202
|
## Writing stories from Python: `python/gramps_connect_story.py`
|