From d6f65ee25914c28345f9eeab2ca1be66f153375b Mon Sep 17 00:00:00 2001 From: Matej Drzik Date: Wed, 16 Oct 2024 18:05:11 +0200 Subject: [PATCH] feat: layer management --- src/index.tsx | 185 +++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 184 insertions(+), 1 deletion(-) diff --git a/src/index.tsx b/src/index.tsx index 71a4967..e988902 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -36,7 +36,7 @@ interface Props { } const uri = - 'https://proximiio-map-mobile.ams3.cdn.digitaloceanspaces.com/1.0.0-b16/index.html'; + 'https://proximiio-map-mobile.ams3.cdn.digitaloceanspaces.com/1.0.0-b19/index.html'; export interface Feature { id: string; @@ -93,8 +93,125 @@ enum Action { getFeatures = 'getFeatures', routeFind = 'routeFind', routeStart = 'routeStart', + addImage = 'addImage', + hasImage = 'hasImage', + removeImage = 'removeImage', + addSource = 'addSource', + getSource = 'getSource', + hasSource = 'hasSource', + removeSource = 'removeSource', + addLayer = 'addLayer', + getLayer = 'getLayer', + hasLayer = 'hasLayer', + moveLayer = 'moveLayer', + removeLayer = 'removeLayer', } +export type PromoteIdSpecification = + | { + [_: string]: string; + } + | string; + +export type VectorSourceSpecification = { + type: 'vector'; + url?: string; + tiles?: Array; + bounds?: [number, number, number, number]; + scheme?: 'xyz' | 'tms'; + minzoom?: number; + maxzoom?: number; + attribution?: string; + promoteId?: PromoteIdSpecification; + volatile?: boolean; +}; + +export type RasterSourceSpecification = { + type: 'raster'; + url?: string; + tiles?: Array; + bounds?: [number, number, number, number]; + minzoom?: number; + maxzoom?: number; + tileSize?: number; + scheme?: 'xyz' | 'tms'; + attribution?: string; + volatile?: boolean; +}; + +export type RasterDEMSourceSpecification = { + type: 'raster-dem'; + url?: string; + tiles?: Array; + bounds?: [number, number, number, number]; + minzoom?: number; + maxzoom?: number; + tileSize?: number; + attribution?: string; + encoding?: 'terrarium' | 'mapbox' | 'custom'; + redFactor?: number; + blueFactor?: number; + greenFactor?: number; + baseShift?: number; + volatile?: boolean; +}; + +export type GeoJSONSourceSpecification = { + type: 'geojson'; + data: GeoJSON.GeoJSON | string; + maxzoom?: number; + attribution?: string; + buffer?: number; + filter?: unknown; + tolerance?: number; + cluster?: boolean; + clusterRadius?: number; + clusterMaxZoom?: number; + clusterMinPoints?: number; + clusterProperties?: unknown; + lineMetrics?: boolean; + generateId?: boolean; + promoteId?: PromoteIdSpecification; +}; + +export type VideoSourceSpecification = { + type: 'video'; + urls: Array; + coordinates: [ + [number, number], + [number, number], + [number, number], + [number, number], + ]; +}; + +export type ImageSourceSpecification = { + type: 'image'; + url: string; + coordinates: [ + [number, number], + [number, number], + [number, number], + [number, number], + ]; +}; + +export type SourceSpecification = + | VectorSourceSpecification + | RasterSourceSpecification + | RasterDEMSourceSpecification + | GeoJSONSourceSpecification + | VideoSourceSpecification + | ImageSourceSpecification; + +export type SourceInfo = { + id?: string; + type?: 'geojson' | 'vector' | 'raster' | 'raster-dem' | 'video' | 'image'; + minzoom?: number; + maxzoom?: number; + loaded: boolean; +}; + export function metersToSteps(meters: number) { return Math.round(meters * 1.31234); } @@ -104,6 +221,72 @@ export class ProximiioMap extends Component { callbacks: { [id: string]: (params: never) => void } = {}; ready = false; + async addImage(id: string, _uri: string): Promise { + const params = `'${id}', '${_uri}'`; + const result = await this.asyncTask(Action.addImage, params); + return result as boolean; + } + + async hasImage(id: string): Promise { + const result = await this.asyncTask(Action.hasImage, `'${id}'`); + return result as boolean; + } + + async removeImage(id: string): Promise { + const result = await this.asyncTask(Action.removeImage, `'${id}'`); + return result as boolean; + } + + async addSource(id: string, source: SourceSpecification): Promise { + const params = `'${id}', '${JSON.stringify(source)}'`; + const result = await this.asyncTask(Action.addSource, params); + return result as boolean; + } + + async getSource(id: string): Promise { + const result = await this.asyncTask(Action.getSource, `'${id}'`); + return result as SourceInfo | undefined; + } + + async hasSource(id: string): Promise { + const result = await this.asyncTask(Action.hasSource, `'${id}'`); + return result as boolean; + } + + async removeSource(id: string): Promise { + const result = await this.asyncTask(Action.removeSource, `'${id}'`); + return result as boolean; + } + + async addLayer(layer: never): Promise { + const params = `'${JSON.stringify(layer)}'`; + const result = await this.asyncTask(Action.addLayer, params); + return result as boolean; + } + + async getLayer(id: string): Promise { + const result = await this.asyncTask(Action.getLayer, `'${id}'`); + return result as SourceInfo | undefined; + } + + async hasLayer(id: string): Promise { + const result = await this.asyncTask(Action.hasLayer, `'${id}'`); + return result as boolean; + } + + async moveLayer(id: string, beforeId: string): Promise { + const result = await this.asyncTask( + Action.moveLayer, + `'${id}', '${beforeId}'` + ); + return result as boolean; + } + + async removeLayer(id: string): Promise { + const result = await this.asyncTask(Action.removeLayer, `'${id}'`); + return result as boolean; + } + setCenter(lat: number, lng: number) { this.dispatch(`mapController.setCenter(${lat}, ${lng});`); }