diff --git a/CHANGELOG.md b/CHANGELOG.md index 704319a4..51bd16e6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,7 @@ ### ✨ Features and improvements - Add german translation - Use same version number for web and desktop versions +- Add scheme type options for vector/raster tile - _...Add new stuff here..._ ### 🐞 Bug fixes diff --git a/cypress/e2e/modals.cy.ts b/cypress/e2e/modals.cy.ts index 02cb244f..b14b0175 100644 --- a/cypress/e2e/modals.cy.ts +++ b/cypress/e2e/modals.cy.ts @@ -61,9 +61,27 @@ describe("modals", () => { }); describe("sources", () => { + beforeEach(() => { + when.setStyle("layer"); + when.click("nav:sources"); + }); + it("active sources"); it("public source"); - it("add new source"); + + it("add new source", () => { + let sourceId = "n1z2v3r"; + when.setValue("modal:sources.add.source_id", sourceId); + when.select("modal:sources.add.source_type", "tile_vector"); + when.select("modal:sources.add.scheme_type", "tms"); + when.click("modal:sources.add.add_source"); + when.wait(200); + then( + get.styleFromLocalStorage().then((style) => style.sources[sourceId]) + ).shouldInclude({ + scheme: "tms", + }); + }); }); describe("inspect", () => { diff --git a/src/components/ModalSources.tsx b/src/components/ModalSources.tsx index dc636193..6884e57e 100644 --- a/src/components/ModalSources.tsx +++ b/src/components/ModalSources.tsx @@ -42,7 +42,7 @@ class PublicSource extends React.Component { function editorMode(source: SourceSpecification) { if(source.type === 'raster') { - if(source.tiles) return 'tilexyz_raster' + if(source.tiles) return 'tile_raster' return 'tilejson_raster' } if(source.type === 'raster-dem') { @@ -50,7 +50,7 @@ function editorMode(source: SourceSpecification) { return 'tilejson_raster-dem' } if(source.type === 'vector') { - if(source.tiles) return 'tilexyz_vector' + if(source.tiles) return 'tile_vector' return 'tilejson_vector' } if(source.type === 'geojson') { @@ -142,21 +142,23 @@ class AddSource extends React.Component { type: 'vector', url: (source as VectorSourceSpecification).url || `${protocol}//localhost:3000/tilejson.json` } - case 'tilexyz_vector': return { + case 'tile_vector': return { type: 'vector', tiles: (source as VectorSourceSpecification).tiles || [`${protocol}//localhost:3000/{x}/{y}/{z}.pbf`], minzoom: (source as VectorSourceSpecification).minzoom || 0, - maxzoom: (source as VectorSourceSpecification).maxzoom || 14 + maxzoom: (source as VectorSourceSpecification).maxzoom || 14, + scheme: (source as VectorSourceSpecification).scheme || 'xyz' } case 'tilejson_raster': return { type: 'raster', url: (source as RasterSourceSpecification).url || `${protocol}//localhost:3000/tilejson.json` } - case 'tilexyz_raster': return { + case 'tile_raster': return { type: 'raster', tiles: (source as RasterSourceSpecification).tiles || [`${protocol}//localhost:3000/{x}/{y}/{z}.pbf`], minzoom: (source as RasterSourceSpecification).minzoom || 0, - maxzoom: (source as RasterSourceSpecification).maxzoom || 14 + maxzoom: (source as RasterSourceSpecification).maxzoom || 14, + scheme: (source as RasterSourceSpecification).scheme || 'xyz' } case 'tilejson_raster-dem': return { type: 'raster-dem', @@ -222,6 +224,7 @@ class AddSource extends React.Component { fieldSpec={{doc: t("Unique ID that identifies the source and is used in the layer to reference the source.")}} value={this.state.sourceId} onChange={(v: string) => this.setState({ sourceId: v})} + data-wd-key="modal:sources.add.source_id" /> { ['geojson_json', t('GeoJSON (JSON)')], ['geojson_url', t('GeoJSON (URL)')], ['tilejson_vector', t('Vector (TileJSON URL)')], - ['tilexyz_vector', t('Vector (XYZ URLs)')], + ['tile_vector', t('Vector (Tile URLs)')], ['tilejson_raster', t('Raster (TileJSON URL)')], - ['tilexyz_raster', t('Raster (XYZ URL)')], + ['tile_raster', t('Raster (Tile URLs)')], ['tilejson_raster-dem', t('Raster DEM (TileJSON URL)')], ['tilexyz_raster-dem', t('Raster DEM (XYZ URLs)')], ['image', t('Image')], @@ -240,6 +243,7 @@ class AddSource extends React.Component { ]} onChange={mode => this.setState({mode: mode as EditorMode, source: this.defaultSource(mode as EditorMode)})} value={this.state.mode as string} + data-wd-key="modal:sources.add.source_type" /> { {t("Add Source")} diff --git a/src/components/ModalSourcesTypeEditor.tsx b/src/components/ModalSourcesTypeEditor.tsx index a45e6e4e..bc1944bb 100644 --- a/src/components/ModalSourcesTypeEditor.tsx +++ b/src/components/ModalSourcesTypeEditor.tsx @@ -11,7 +11,7 @@ import FieldCheckbox from './FieldCheckbox' import { WithTranslation, withTranslation } from 'react-i18next'; import { TFunction } from 'i18next' -export type EditorMode = "video" | "image" | "tilejson_vector" | "tilexyz_raster" | "tilejson_raster" | "tilexyz_raster-dem" | "tilejson_raster-dem" | "tilexyz_vector" | "geojson_url" | "geojson_json" | null; +export type EditorMode = "video" | "image" | "tilejson_vector" | "tile_raster" | "tilejson_raster" | "tilexyz_raster-dem" | "tilejson_raster-dem" | "tile_vector" | "geojson_url" | "geojson_json" | null; type TileJSONSourceEditorProps = { source: { @@ -45,6 +45,7 @@ type TileURLSourceEditorProps = { tiles: string[] minzoom: number maxzoom: number + scheme: 'xyz' | 'tms' } onChange(...args: unknown[]): unknown children?: React.ReactNode @@ -73,6 +74,20 @@ class TileURLSourceEditor extends React.Component { const t = this.props.t; return
{this.renderTileUrls()} + this.props.onChange({ + ...this.props.source, + scheme + })} + value={this.props.source.scheme} + data-wd-key="modal:sources.add.scheme_type" + /> case 'geojson_json': return case 'tilejson_vector': return - case 'tilexyz_vector': return + case 'tile_vector': return case 'tilejson_raster': return - case 'tilexyz_raster': return + case 'tile_raster': return case 'tilejson_raster-dem': return case 'tilexyz_raster-dem': return