Make cesium-widget-component generic

src/apps/illumination/defaultConfig.ts

@@ -1,8 +1,8 @@
 import type {IIlluminationConfig} from './ingv-config-illumination.js';
 
 export const defaultConfig: IIlluminationConfig = {
+  languages: ['de', 'fr', 'en', 'it'],
   header: {
-    languages: ['de', 'fr', 'en', 'it'],
     title: {
       fr: 'Ma super app',
       en: 'My super app',
@@ -21,20 +21,33 @@ export const defaultConfig: IIlluminationConfig = {
   },
   app: {
     cesiumContext: {
+      catalogs: {
+        '@geoadmin': () => import('../../catalogs/geoadminCatalog.js'),
+      },
       layers: {
-        terrain: 'https://3d.geo.admin.ch/ch.swisstopo.terrain.3d/v1/',
-        buildings:
-          'https://vectortiles0.geo.admin.ch/3d-tiles/ch.swisstopo.swisstlm3d.3d/20201020/tileset.json',
-        vegetation:
-          'https://vectortiles.geo.admin.ch/3d-tiles/ch.swisstopo.vegetation.3d/20190313/tileset.json',
+        tiles3d: ['@geoadmin/buildings', '@geoadmin/vegetation'],
+        imageries: ['@geoadmin/pixel-karte-farbe'],
+        terrain: '@geoadmin/terrain',
+      },
+      quickLists: {
+        baseLayers: [
+          '@geoadmin/pixel-karte-farbe',
+          '@geodmin/pixel-karte-frau',
+          '@geoadmin/swissimage',
+        ],
       },
-      initialView: {
-        destination: [6.628484, 46.5, 1000],
+      camera: {
+        position: [6.628484, 46.5, 1000],
         orientation: {
           heading: 0,
           pitch: -30.0,
         },
       },
+      widgetOptions: {
+        shadows: true,
+        terrainShadows: 1,
+        scene3DOnly: true,
+      },
     },
   },
 };

src/apps/illumination/ngv-main-illumination.ts

@@ -3,7 +3,7 @@ import {css, html, LitElement} from 'lit';
 import {type CesiumWidget, JulianDate} from '@cesium/engine';
 import {IIlluminationConfig} from './ingv-config-illumination.js';
 
-import '../../plugins/ngv-plugin-cesium-widget.js';
+import '../../plugins/cesium/ngv-plugin-cesium-widget.js';
 
 const YEAR = new Date().getFullYear();
 const BASE_DATE = new Date(`${YEAR}-01-01T00:00:00`);
@@ -151,7 +151,7 @@ export class NgvMainIllumination extends LitElement {
           </div>
         </div>
         <ngv-plugin-cesium-widget
-          .config=${this.config.cesiumContext}
+          .cesiumContext=${this.config.cesiumContext}
           @viewerInitialized=${(evt: CustomEvent<CesiumWidget>) => {
             this.viewer = evt.detail;
             this.updateDayAndHour();

src/apps/permits/defaultConfig.json

@@ -1,6 +1,6 @@
 {
+  "languages": ["de", "fr", "en", "it"],
   "header": {
-    "languages": ["de", "fr", "en", "it"],
     "title": {
       "fr": "Ma super app",
       "en": "My super app",

src/catalogs/cesiumCatalog.ts

@@ -0,0 +1,9 @@
+import {INGVCatalog} from '../interfaces/ingv-catalog.js';
+
+export const catalog: INGVCatalog = {
+  id: '@cesium',
+  credits: '© Cesium',
+  layers: {
+    // to complete
+  },
+};

src/catalogs/geoadminCatalog.ts

@@ -0,0 +1,46 @@
+import {INGVCatalog} from '../interfaces/ingv-catalog.js';
+
+export const catalog: INGVCatalog = {
+  id: '@geoadmin',
+  credits: '© Swisstopo',
+  layers: {
+    terrain: {
+      type: 'terrain',
+      url: 'https://3d.geo.admin.ch/ch.swisstopo.terrain.3d/v1/',
+    },
+    buildings: {
+      type: '3dtiles',
+      url: 'https://vectortiles0.geo.admin.ch/3d-tiles/ch.swisstopo.swisstlm3d.3d/20201020/tileset.json',
+    },
+    vegetation: {
+      type: '3dtiles',
+      url: 'https://vectortiles.geo.admin.ch/3d-tiles/ch.swisstopo.vegetation.3d/20190313/tileset.json',
+    },
+    'pixel-karte-farbe': {
+      type: 'wmts',
+      options: {
+        url: 'https://wmts.geo.admin.ch/1.0.0/{layer}/default/{timestamp}/3857/{z}/{x}/{y}.{format}',
+        layer: 'ch.swisstopo.pixelkarte-farbe',
+        dimensions: {
+          timestamp: 'current',
+        },
+        format: 'jpeg',
+        style: 'what is this?',
+        tileMatrixSetID: 'idem',
+        maximumLevel: 18,
+      },
+    },
+    swissimage: {
+      type: 'urltemplate',
+      options: {
+        url: 'https://wmts.geo.admin.ch/1.0.0/{layer}/default/{timestamp}/3857/{z}/{x}/{y}.{format}',
+        customTags: {
+          layer: 'ch.swisstopo.swissimage',
+          timestamp: 'current',
+          format: 'jpeg',
+        },
+        maximumLevel: 20,
+      },
+    },
+  },
+};

src/interfaces/ingv-catalog.ts

@@ -0,0 +1,15 @@
+import {INGVCesiumAllTypes} from './ingv-layers.js';
+
+export interface NGVLayerDescr<Type, LayerType> {
+  type: Type;
+  options: LayerType;
+}
+
+/**
+ * A catalog is simply a flat set of layers
+ */
+export interface INGVCatalog {
+  id: string;
+  credits: string;
+  layers: Record<string, INGVCesiumAllTypes>;
+}

src/interfaces/ingv-cesium-context.ts

@@ -1,16 +1,35 @@
+import type {CesiumWidget} from '@cesium/engine';
+import type {INGVCatalog} from './ingv-catalog.js';
+
 export interface IngvCesiumContext {
   cesiumApiKey?: string;
   baseUrl?: string;
+  catalogs: Record<
+    string,
+    INGVCatalog | (() => Promise<{catalog: INGVCatalog}>) | string
+  >;
   layers: {
-    terrain: string;
-    buildings: string;
-    vegetation: string;
+    terrain?: string;
+    tiles3d?: string[];
+    imageries: string[];
   };
-  initialView: {
-    destination: [number, number, number];
+  /**
+   * These are lists of selected layers.
+   */
+  quickLists?: {
+    // Can we switch terrain?
+    terrains?: string[];
+    // imageries: string[];
+    baseLayers?: string[];
+  };
+  // FIXME: probably useful
+  // layerOptions: Record<string, any>;
+  camera: {
+    position: [number, number, number];
     orientation: {
       heading: number;
       pitch: number;
     };
   };
+  widgetOptions?: ConstructorParameters<typeof CesiumWidget>[1];
 }

src/interfaces/ingv-layers.ts

@@ -0,0 +1,45 @@
+import type {
+  Cesium3DTileset,
+  UrlTemplateImageryProvider,
+  WebMapServiceImageryProvider,
+  WebMapTileServiceImageryProvider,
+} from '@cesium/engine';
+
+import type {CesiumTerrainProvider} from '@cesium/engine';
+
+export type INGVCesiumImageryTypes =
+  | INGVCesiumWMSImagery
+  | INGVCesiumWMTSImagery
+  | INGVCesiumUrlTemplateImagery;
+
+export type INGVCesiumAllTypes =
+  | INGVCesium3DTiles
+  | INGVCesiumTerrain
+  | INGVCesiumImageryTypes;
+
+export interface INGVCesium3DTiles {
+  type: '3dtiles';
+  url: string | number;
+  options?: ConstructorParameters<typeof Cesium3DTileset>[0];
+}
+
+export interface INGVCesiumTerrain {
+  type: 'terrain';
+  url: string | number;
+  options?: ConstructorParameters<typeof CesiumTerrainProvider>[0];
+}
+
+export interface INGVCesiumWMTSImagery {
+  type: 'wmts';
+  options?: ConstructorParameters<typeof WebMapTileServiceImageryProvider>[0];
+}
+
+export interface INGVCesiumWMSImagery {
+  type: 'wms';
+  options?: ConstructorParameters<typeof WebMapServiceImageryProvider>[0];
+}
+
+export interface INGVCesiumUrlTemplateImagery {
+  type: 'urltemplate';
+  options?: ConstructorParameters<typeof UrlTemplateImageryProvider>[0];
+}