import { browser } from '$app/environment'; import { get, writable, type Readable, type Writable } from 'svelte/store'; import type { Feature, FeatureCollection, LineString, Point } from 'geojson'; import type { FileStatistics, FileStructure, Selection } from 'gpx-rs'; export type { FileStatistics, FileStructure, FilesUpdate, Selection, TrackNode, SegmentNode, WaypointNode, } from 'gpx-rs'; type Wasm = typeof import('gpx-rs'); export type SegmentProperties = { fileId: string; trackId: string; segmentId: string; trackIndex: number; segmentIndex: number; /** Changes when the trackpoints of the segment change. */ rev: string; }; export type WaypointProperties = { fileId: string; waypointId: string; index: number; name?: string; }; /** Everything the UI knows about one file. */ export type FileState = { structure: FileStructure; /** Global statistics of the file. */ statistics: FileStatistics; /** One LineString feature per track segment, in file order. */ segments: FeatureCollection; /** One Point feature per waypoint, in file order. */ waypoints: FeatureCollection; }; const EMPTY_STATISTICS: FileStatistics = { totalDistance: 0, elevationGain: 0, elevationLoss: 0 }; function toPositions(flat: Float64Array): [number, number][] { const positions: [number, number][] = new Array(flat.length / 2); for (let i = 0; i < positions.length; i++) { positions[i] = [flat[2 * i], flat[2 * i + 1]]; } return positions; } /** Hyphenated UUID strings (as found in the file structures) to the concatenated 16-byte form. */ function idsToBytes(ids: string[]): Uint8Array { const bytes = new Uint8Array(ids.length * 16); ids.forEach((id, i) => { const hex = id.replaceAll('-', ''); for (let j = 0; j < 16; j++) { bytes[i * 16 + j] = parseInt(hex.slice(2 * j, 2 * j + 2), 16); } }); return bytes; } /** * Thin wrapper around the WASM engine. * * The engine owns the files; this class mirrors what the UI needs in stores. After each action, * only what the engine reports as changed is read again: the order of the files, and the state * of the files that were added or modified. Within a modified file, the GeoJSON features of the * segments and waypoints that did not change are reused. */ class Engine { private wasm: Wasm | null = null; /** Resolves once the engine can be used (never on the server). */ readonly ready: Promise; private _order = writable([]); private _files = writable>>(new Map()); private _selection = writable({ type: 'empty' }); /** Ids of the files in display order. */ readonly order: Readable = { subscribe: this._order.subscribe }; /** What is currently selected. */ readonly selection: Readable = { subscribe: this._selection.subscribe }; /** * The state of each file, in its own store. The map store only notifies when files are added * or removed; editing a file only notifies the subscribers of that file's store. */ readonly files: Readable>> = { subscribe: this._files.subscribe, }; constructor() { this.ready = browser ? import('gpx-rs').then((wasm) => { wasm.start(); this.wasm = wasm; }) : new Promise(() => {}); } // Actions. Each one resolves to whether the engine changed something. newFile(name: string) { return this.run((w) => w.new_file(name)); } loadFile(data: Uint8Array) { return this.run((w) => w.load_file(data)); } duplicate() { return this.run((w) => w.duplicate()); } delete() { return this.run((w) => w._delete()); } deleteAll() { return this.run((w) => w.delete_all()); } undo() { return this.run((w) => w.undo()); } redo() { return this.run((w) => w.redo()); } select(fileIds: string[]) { return this.run((w) => w.select(idsToBytes(fileIds))); } addSelect(fileIds: string[]) { return this.run((w) => w.add_select(idsToBytes(fileIds))); } selectAll() { return this.run((w) => w.select_all()); } /** Moves the files, in the given order, to `index` among the other files. */ reorder(fileIds: string[], index: number) { return this.run((w) => w.reorder(idsToBytes(fileIds), index)); } // Coordinates, as flat [lng, lat, ...] arrays. They are copied out of the WASM memory. // Refetch them when the `rev` of the segment (or the `waypointsRev` of the file) changed. segmentCoordinates(segmentId: string): Float64Array { return this.wasm?.segment_coordinates(segmentId).slice() ?? new Float64Array(); } waypointCoordinates(fileId: string): Float64Array { return this.wasm?.waypoint_coordinates(fileId).slice() ?? new Float64Array(); } private async run(action: (wasm: Wasm) => boolean): Promise { await this.ready; const wasm = this.wasm!; const changed = action(wasm); this.sync(wasm); return changed; } /** Reads what the last action changed. */ private sync(wasm: Wasm) { const update = wasm.last_update(); if (update.selectionChanged) { this._selection.set(wasm.selection()); } if (update.orderChanged) { this._order.set(wasm.file_order()); } const added: [string, FileState][] = []; for (const id of update.added) { const state = this.readFile(wasm, id); if (state) { added.push([id, state]); } } if (added.length > 0 || update.removed.length > 0) { this._files.update((files) => { const next = new Map(files); update.removed.forEach((id) => next.delete(id)); added.forEach(([id, state]) => next.set(id, writable(state))); return next; }); } if (update.modified.length > 0) { const files = get(this._files); for (const id of update.modified) { const store = files.get(id); const state = store && this.readFile(wasm, id, get(store)); if (store && state) { store.set(state); } } } } /** Reads the state of a file, reusing from `previous` what did not change. */ private readFile(wasm: Wasm, id: string, previous?: FileState): FileState | null { const structure = wasm.file_structure(id); if (!structure) { return null; } const previousSegments = new Map( previous?.segments.features.map((f) => [f.properties.segmentId, f]) ?? [] ); const segments: Feature[] = []; structure.tracks.forEach((track, trackIndex) => { track.segments.forEach((segment, segmentIndex) => { const old = previousSegments.get(segment.id); const unchanged = old?.properties.rev === segment.rev && old.properties.trackId === track.id && old.properties.trackIndex === trackIndex && old.properties.segmentIndex === segmentIndex; segments.push( unchanged ? old : { type: 'Feature', geometry: { type: 'LineString', coordinates: toPositions(wasm.segment_coordinates(segment.id)), }, properties: { fileId: id, trackId: track.id, segmentId: segment.id, trackIndex, segmentIndex, rev: segment.rev, }, } ); }); }); const previousStructure = previous?.structure; const waypointsUnchanged = previousStructure !== undefined && previousStructure.waypointsRev === structure.waypointsRev && previousStructure.waypoints.length === structure.waypoints.length && previousStructure.waypoints.every( (w, i) => w.id === structure.waypoints[i].id && w.name === structure.waypoints[i].name ); let waypoints = previous?.waypoints; if (!waypoints || !waypointsUnchanged) { const coordinates = toPositions(wasm.waypoint_coordinates(id)); waypoints = { type: 'FeatureCollection', features: structure.waypoints.map((waypoint, index) => ({ type: 'Feature', geometry: { type: 'Point', coordinates: coordinates[index] }, properties: { fileId: id, waypointId: waypoint.id, index, name: waypoint.name }, })), }; } return { structure, statistics: wasm.file_statistics(id) ?? EMPTY_STATISTICS, segments: { type: 'FeatureCollection', features: segments }, waypoints, }; } } export const engine = new Engine();