Merge pull request #547 from geoadmin/develop

New Release v1.4.0 - #minor

.env.development

@@ -9,3 +9,5 @@ VITE_API_SERVICES_BASE_URL=https://sys-map.dev.bgdi.ch/api/
 VITE_API_SERVICE_KML_BASE_URL=https://sys-public.dev.bgdi.ch/
 VITE_API_SERVICE_KML_STORAGE_BASE_URL=https://sys-public.dev.bgdi.ch/
 VITE_APP_API_SERVICE_SHORTLINK_BASE_URL=https://sys-s.dev.bgdi.ch/
+VITE_APP_3D_TILES_BASE_URL=https://sys-3d.dev.bgdi.ch/
+VITE_APP_VECTORTILES_BASE_URL=https://sys-verctortiles.dev.bgdi.ch/

.env.integration

@@ -8,3 +8,5 @@ VITE_API_SERVICES_BASE_URL=https://sys-map.int.bgdi.ch/api/
 VITE_API_SERVICE_KML_BASE_URL=https://sys-public.int.bgdi.ch/
 VITE_API_SERVICE_KML_STORAGE_BASE_URL=https://sys-public.int.bgdi.ch/
 VITE_APP_API_SERVICE_SHORTLINK_BASE_URL=https://sys-s.int.bgdi.ch/
+VITE_APP_3D_TILES_BASE_URL=https://sys-3d.int.bgdi.ch/
+VITE_APP_VECTORTILES_BASE_URL=https://sys-verctortiles.int.bgdi.ch/

.env.production

@@ -8,3 +8,5 @@ VITE_API_SERVICES_BASE_URL=https://map.geo.admin.ch/api/
 VITE_API_SERVICE_KML_BASE_URL=https://public.geo.admin.ch/
 VITE_API_SERVICE_KML_STORAGE_BASE_URL=https://public.geo.admin.ch/
 VITE_APP_API_SERVICE_SHORTLINK_BASE_URL=https://s.geo.admin.ch/
+VITE_APP_3D_TILES_BASE_URL=https://3d.geo.admin.ch/
+VITE_APP_VECTORTILES_BASE_URL=https://vectortiles.geo.admin.ch/

.eslintrc.js

@@ -3,20 +3,47 @@ require('@rushstack/eslint-patch/modern-module-resolution')
 
 module.exports = {
     root: true,
+    ignorePatterns: ['node_modules', '.github', 'dist'],
     extends: [
+        'eslint:recommended',
         'plugin:vue/vue3-recommended',
+        'plugin:cypress/recommended',
         'prettier',
     ],
     env: {
+        node: true,
         'vue/setup-compiler-macros': true,
     },
+    rules: {
+        'no-unused-vars': [
+            'error',
+            {
+                argsIgnorePattern: '^_',
+                destructuredArrayIgnorePattern: '^_',
+            },
+        ],
+    },
+    globals: {
+        VITE_ENVIRONMENT: true,
+        __APP_VERSION__: true,
+    },
     overrides: [
         {
-            files: ['cypress/integration/**.spec.{js,ts,jsx,tsx}'],
-            extends: ['plugin:cypress/recommended'],
-            plugins: [
-                "cypress"
-            ],
+            files: ['tests/**/*.{js,ts,jsx,tsx}', 'src/**/__test__/**/*.spec.js'],
+            rules: {
+                'no-prototype-builtins': 'off',
+            },
+        },
+        {
+            files: ['*.md'],
+            excludedFiles: ['LICENSE.md'],
+            parser: 'eslint-plugin-markdownlint/parser',
+            extends: ['plugin:markdownlint/recommended'],
+            rules: {
+                'markdownlint/md013': 'off',
+                'markdownlint/md028': 'off',
+                'no-irregular-whitespace': 'off',
+            },
         },
     ],
 }

.github/workflows/add-testlink-to-pr.yml

@@ -11,7 +11,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Create/update test link on DEV
-        if: ${{ github.base_ref == 'develop' }}
+        if: ${{ github.base_ref == 'develop' || startsWith(github.base_ref, 'develop-') }}
         uses: tzkhan/pr-update-action@v2
         with:
           repo-token: "${{ secrets.GITHUB_TOKEN }}"

.gitignore

@@ -30,3 +30,11 @@ tests/results/*
 
 # Git
 *.orig
+
+# script check-external-layers-providers.mjs
+scripts/check-layer-providers-results/*invalid_providers_cors.yaml
+scripts/check-layer-providers-results/*invalid_providers.yaml
+scripts/check-layer-providers-results/*invalid_providers_wms.yaml
+scripts/check-layer-providers-results/*invalid_providers_wmts.yaml
+scripts/check-layer-providers-results/*invalid_providers_content.yaml
+scripts/check-layer-providers-results/*valid_providers.json

.prettierrc

@@ -5,6 +5,7 @@
   "trailingComma": "es5",
   "tabWidth": 4,
   "jsxSingleQuote": false,
+  "plugins": ["prettier-plugin-jsdoc"],
   "overrides": [{
     "files": "*.md",
     "options": {

CONTRIBUTING.md

@@ -39,8 +39,8 @@ This tag will be a bump in :
 
 CI is managed by AWS CodeBuild.
 
-- Every merge (commit) on `develop` will trigger a deploy on https://sys-map.dev.bgdi.ch/ by the CI
-- Every merge (commit) on `master` will trigger a deploy on https://sys-map.int.bgdi.ch/ by the CI
+- Every merge (commit) on `develop` will trigger a deploy on <https://sys-map.dev.bgdi.ch/> by the CI
+- Every merge (commit) on `master` will trigger a deploy on <https://sys-map.int.bgdi.ch/> by the CI
 
 ### structure/architecture of the app
 

LICENSE.md

@@ -31,4 +31,3 @@ Portions of web-mapviewer are based on works by others. A non-extensive list:
 [Font Awesome Fonts](https://scripts.sil.org/OFL)
 
 [Font Awesome Code](https://opensource.org/licenses/MIT)
-

ROADMAP.md

@@ -1,46 +1,61 @@
 # Roadmap
 
-Geo.admin.ch, in particular the map viewer of the Geoportal Bund https://map.geo.admin.ch, is being used actively (80K visits/day) by the public, authorities and third parties in version [mf-geoadmin3](https://github.com/geoadmin/mf-geoadmin3) and covers all functions according to the currently valid [NGDI](https://cms.geo.admin.ch/www.e-geo.ch/archives/pdf_egeo_de/ngdigesamtkonzeptv2.0.pdf) concept.
+Geo.admin.ch, in particular the map viewer of the Geoportal Bund <https://map.geo.admin.ch>, is being used actively (80K visits/day) by the public, authorities and third parties in version [mf-geoadmin3](https://github.com/geoadmin/mf-geoadmin3) and covers all functions according to the currently valid [NGDI](https://cms.geo.admin.ch/www.e-geo.ch/archives/pdf_egeo_de/ngdigesamtkonzeptv2.0.pdf) concept.
 
 geo.admin.ch receives a large number of feature requests, both from inside federal offices and from the broader open-source community. At the same time, backend, services and viewer (frameworks version used such as angular, python, cesium etc ) of mf-geoadmin3 are at the end of their life cycle and must be replaced. We bring together representatives from authorites coordinating agency for Federal geographical information, [GCG](https://www.geo.admin.ch/gkg), and engineering to prioritize this list. As new projects come into the queue, we regularly position them based on relative priority to other projects. As work gets done, projects will move up in the queue.
 
 The projects below are not associated with a particular map.geo.admin.ch version. We'll release them on completion, and they will be part of a specific version based on our release schedule, following semantic versioning. For example, features are released in the next minor after they are complete, or the next major if they include breaking changes.
 
-### Done
-#### Create basic application structure
+## Done
+
+### Create basic application structure
+
 We are setting up JS Code Structure, a bare map viewer with panning and investigate PWA technologies. This includes a set up of CI/CD and deployment processes. To ease collaboration , basic documentation is implemented
 
 #### Basic mapviewer with MVP feature set
+
 A basic viewer consisting of basic Permalink,/ URL mgmt., basic dataset mgmt., basic infoboxes (incl improvements), basic drawing, basic iFrame support and basic 3D.
 
 #### Draw & measure functions
+
 We will redefine the user learning journeys and refresh the approach to Add symbol, Add text, Add line / polygon, Measure, Measure Azimut, Profile, Share drawing / KML
 
 ### In progress
+
 #### Map window
+
 We will redefine the user learning journeys and refresh the approach to change language, display coordinates/ show mouse positons, Zoom to rectangle, copyright and possibly fullscreen.
 
 #### Navigation & orientation
+
 We will redefine the user learning journeys and refresh the approach to Geographical search (centre on coordinates), Geographical search (place name or postcode),Geolocation,
 
 #### Selection and display of data
-We will redefine the user learning journeys and refresh the approach to Full text search for data, Search for data attributes, Topic switcher, Search for data (catalogue/topics), Change the cartographic background, Change the visibility of the selected dataset, Change the order of the selected datasets, Remove selected datasets, View additional information about a data-set. View information about an object on the map , View information about an object on the map including highly customized tooltips with logic and dynamic data fetching) (EXPERTTOOLTIP),  Position information, Aerial photography, Time slider, Time copy/compare.
+
+We will redefine the user learning journeys and refresh the approach to Full text search for data, Search for data attributes, Topic switcher, Search for data (catalogue/topics), Change the cartographic background, Change the visibility of the selected dataset, Change the order of the selected datasets, Remove selected datasets, View additional information about a data-set. View information about an object on the map , View information about an object on the map including highly customized tooltips with logic and dynamic data fetching) (EXPERTTOOLTIP), Position information, Aerial photography, Time slider, Time copy/compare.
 
 #### Linking & integration
+
 We will redefine the user learning journeys and refresh the approach to Send/save/iFrame of the current map, Save/send a link to an object, Use parameters to call up a map (incl. drawings, external ogc layers), Mobile, Mobile Add link to homescreen/App, Mobile Offline SAVE VIEW DELETE.
 
 ### Future
+
 #### 3D
+
 We will redefine the user learning journeys and refresh the approach to Navigation, Mouse position, Feature tooltip, WMS import: preset, WMS import: permalink, KML import, Time support vector, Time support Raster.
 
 #### Advanced functions
+
 We will redefine the user learning journeys and refresh the approach to Import preset, Import URL WMS/WMTS/GeoJSON and KML, import: PRINT, Import permalink, Compare, Keyboard shortcuts, Report problem, Landscape mode (mobile)
 
 #### Print
+
 We will redefine the user learning journeys and refresh the approach to Print and Printing grids and annotation
 
 #### 3D nextgen
+
 We will define the user learning journeys to shadow calculation
 
 #### Draw & measure functions nextgen
+
 We will define the user learning journeys to shadow snapping and routing

adr/2020_04_06_javascript_framework_choice.md

@@ -1 +1,3 @@
-Please refer to https://github.com/geoadmin/doc-guidelines/blob/master/adr/2020_04_06_next_gen_viewer.md
+# Javascript Framework Choice
+
+Please refer to <https://github.com/geoadmin/doc-guidelines/blob/master/adr/2020_04_06_next_gen_viewer.md>

adr/2020_05_28_test_framework.md

@@ -29,7 +29,6 @@ Good alternative to Selenium, is compatible with Saucelab (we already have some
 
 This could also be a good cross browser testing framework, but the cross browser feature will be hard to have deployed on every developers' machine.
 
-
 ### Cypress
 
 Made by devs for devs.
@@ -39,7 +38,6 @@ Made by devs for devs.
 - Solid and clear documentation
 - Newest addition (2017) to the big frameworks (very active community)
 
-
 ## Decision
 
 After playing a bit with these frameworks, Cypress clearly had something for it.
@@ -49,7 +47,6 @@ The documentation is well maintained and complete, tests are described with Moch
 Cypress will be a great help during the development phase of the new viewer.
 But we have to keep in mind that it doesn't really do cross browser testing.
 
-
 ## Consequences
 
 We start to use Cypress as our Unit test and integration test framework.

adr/2021_03_16_url_param_structure.md

@@ -4,11 +4,13 @@
 
 > Date: 16.03.2021
 
+> Updated: 17.11.2023
+
 ## Context
 
 The mapviewer application is configured with several URL parameters. The current format for the layer configuration looks as follows (example for topic "Snow"):
 
-```
+```text
 ...
 layers=ch.swisstopo.pixelkarte-farbe-winter,ch.swisstopo.hangneigung-ueber_30,ch.swisstopo-karto.hangneigung,ch.bafu.wrz-jagdbanngebiete_select,ch.bafu.wrz-wildruhezonen_portal,ch.bazl.gebirgslandeplaetze,ch.swisstopo.schneeschuhwandern,ch.swisstopo-karto.schneeschuhrouten,ch.swisstopo-karto.skitouren,ch.swisstopo.skitourenkarte-50.metadata,ch.bav.haltestellen-oev&
 layers_opacity=0.85,0.5,0.2,0.6,0.6,1,0.7,0.8,0.8,1,1&
@@ -18,7 +20,7 @@ layers_visibility=true,false,true,true,true,false,true,true,true,false,false
 
 and including layers with different timestamps probably also
 
-```
+```text
 layers_timestamp=18641231,,,
 ```
 
@@ -33,7 +35,7 @@ The current format has some limitations:
 
 The new format looks as follows (in the generic form):
 
-```
+```text
 layers={layerID1},{visibility=t|f},{opacity=%f};{layerID2},{visibility=t|f},{opacity=%f}
 ```
 
@@ -56,7 +58,7 @@ In case a wrong format is given, the errors are printed on the console.
 
 The above example boils down to the following (given that all opacity values are the defaults defined in the topic):
 
-```
+```text
 ...
 layers=ch.swisstopo.pixelkarte-farbe-winter;
 ch.swisstopo.hangneigung-ueber_30,f;
@@ -87,15 +89,23 @@ The timestamp format must be ISO8601 compliant, i.e.
 - `YYYY-MM-DDThh:mm:ss.sss`
 - `YYYY-MM-DDThh:mm:ss+hh:mm`
 
-External Layers are in the following format (note that only one `|` is used and the WMS order is changed to have consistently `TYPE|URL|OTHER OPTIONS`)
-
-- an external WMS: `WMS|wms.geo.gr.ch%2Fadmineinteilung%3F|Gemeinden,layerb,layerc|1.3.0|Gemeinden`
-- an external WMTS: `WMTS|wmts.geo.ti.ch%2Fwmts%2F1.0.0%2FWMTSCapabilities.xml|ch.ti.051_1.piano_registro_fondiario_catasto_rdpp@time=18641231|Optionales Label`
-- an external KML: `KML|www.slf.ch/avalanche/accidents/accidents_season_de.kml|Mein Titel`
-- a geoadmin KML: `KML|public.geo.admin.ch/api/files/KML_ID|Mein Titel`
-- a geoadmin KML with adminId: `KML|public.geo.admin.ch/api/files/KML_ID|Mein Titel@adminId=ADMIN_ID`
-- an external GPX: `GPX|www.slf.ch/avalanche/accidents/accidents_season_de.gpx`
-- an external KMZ: `KMZ|www.slf.ch/avalanche/accidents/accidents_season_de.kmz` (needs to pass by proxy to be unzipped)
+### External Layers
+
+The layer ID of the external Layers are in the following format (note that only one `|` is used and the WMS order is changed to have consistently `TYPE|URL|OTHER OPTIONS`)
+
+- an external WMS: `WMS|GET_CAP_BASE_URL|LAYER_ID`
+  - The WMS version is taken from the Get Capabilities
+- an external WMTS: `WMTS|GET_CAP_BASE_URL|LAYER_ID`
+  - The WMTS version is taken from the Get Capabilities
+- an external KML: `KML|URL|TITLE`
+  - TITLE is optional and used as display in the active layers, if omitted then it will be displayed as `KML`
+- a geoadmin KML: `KML|URL|TITLE`
+  - TITLE is set to `Drawing` upon drawing creation and in the current language at that time
+- a geoadmin KML with adminId: `KML|URL|TITLE@adminId=ADMIN_ID`
+- an external GPX: `GPX|GPX|TITLE`
+  - TITLE is optional and used as display in the active layers, if omitted then it will be displayed as `GPX`
+- an external KMZ: `KMZ|KMZ|TITLE` (needs to pass by proxy to be unzipped)
+  - TITLE is optional and used as display in the active layers, if omitted then it will be displayed as `KMZ`
 
 ## Consequences
 

adr/2021_04_14_drawing_library.md

@@ -30,4 +30,4 @@ This leaves us with the OpenLayers approach, that has already proven itself on t
 
 Development of the drawing module can now start with OpenLayers as its backbone.
 
-In order to make it clear it is a different module as the map module, we will inject the current OpenLayers map instance with [Vue's provide/inject](https://v3.vuejs.org/guide/component-provide-inject.html) 
+In order to make it clear it is a different module as the map module, we will inject the curren/component-provide-inject.html)

adr/2022_05_09_mobile_click_behavior.md

@@ -10,7 +10,7 @@ Currently, a short click will switch the app in fullscreen mode. A long click (w
 
 The issue is that there is no location popup possibilities with that (or at least it's unwanted if it pops up after a long click). We need to rework that.
 
-# Decision
+## Decision
 
 - Mobile layout (menu must be opened through header button)
   - Single touch (click) : identify, if no feature found, fullscreen toggle
@@ -26,5 +26,5 @@ This would allow mobile users to use all the features we provide (identify, loca
 
 ## Links
 
-* [JIRA ticket this ADR is based on](https://jira.swisstopo.ch/browse/BGDIINF_SB-2235)
-* [JIRA ticket where this became a problem](https://jira.swisstopo.ch/browse/BGDIINF_SB-2323)
+- [JIRA ticket this ADR is based on](https://jira.swisstopo.ch/browse/BGDIINF_SB-2235)
+- [JIRA ticket where this became a problem](https://jira.swisstopo.ch/browse/BGDIINF_SB-2323)

adr/2023_11_08_vue_composition_api.md

@@ -0,0 +1,29 @@
+# Vue Composition API
+
+> Status: accepted
+
+> Date: 08.11.2023
+
+## Context
+
+Vue3 is already our Vue version for a while, but we haven't yet utilized all its potential. One of them is to use the Composition API, which is a more succinct way of describing components (less boilerplate code).
+Composition API should help us, in many cases, to build more reusable portions of code (replacing the mixins for instance, which is a quite confusing concept)
+
+This, in return, gives new challenges as it doesn't force us to structure our component in the same way (props, computed, etc...) through the linter.
+
+## Decision
+
+We will now be using the Composition API for new components, and transform Option API components into Composition API when extensive work is required on them
+
+## Consequences
+
+- New components should be written with the Composition API
+  - `<script setup>` tag should be the first tag of the `.vue` file (instead of `<template>`, that's the new best practice with this approach)
+  - declares things in this order in the `<script setup>` tag
+    - imports
+    - props (input)
+    - store link (input)
+    - computed (transformation of inputs)
+    - life-cycle hooks (mounted and such)
+    - interaction with the user (was called `methods` in the OptionAPI)
+- Components that are extensively edited should be rewritten using the Composition API

cypress.config.ts

@@ -1,16 +1,16 @@
 import { defineConfig } from 'cypress'
 import vitePreprocessor from 'cypress-vite'
-import { readdirSync, existsSync, unlinkSync } from 'node:fs'
+import { existsSync, readdirSync, unlinkSync } from 'node:fs'
 import { join } from 'node:path'
 import { cypressBrowserPermissionsPlugin } from 'cypress-browser-permissions'
 
 module.exports = defineConfig({
     video: false,
-    defaultCommandTimeout: 10000,
-    requestTimeout: 15000,
-    numTestsKeptInMemory: 5,
+    defaultCommandTimeout: 5000,
+    requestTimeout: 5000,
+    numTestsKeptInMemory: 2,
     retries: {
-        runMode: 5,
+        runMode: 1,
         openMode: 0,
     },
     reporter: 'cypress-multi-reporters',
@@ -74,6 +74,6 @@ module.exports = defineConfig({
         },
         baseUrl: 'http://localhost:8080',
         specPattern: 'tests/e2e-cypress/integration/**/*.*',
-        supportFile: 'tests/e2e-cypress/support/index.js'
+        supportFile: 'tests/e2e-cypress/support/index.js',
     },
 })