feat(gallery-layer-type): add boilerplate

ubilabs · Aug 28, 2020 · 811cf12 · 811cf12
1 parent 1234893
commit 811cf12
Show file tree

Hide file tree

Showing 12 changed files with 82 additions and 34 deletions.
diff --git a/src/scripts/config/main.ts b/src/scripts/config/main.ts
@@ -62,6 +62,7 @@ export default {
     layer: `${baseUrlTiles}/{id}/metadata.json`,
     layerTiles: `${baseUrlTiles}/{id}/tiles/{timeIndex}/{z}/{x}/{reverseY}.png`,
     layerImage: `${baseUrlTiles}/{id}/tiles/{timeIndex}/full.png`,
+    layerGalleryImage: `${baseUrlTiles}/{id}/tiles/{timeIndex}/full.jpg`,
     layerOfflinePackage: `${baseUrlTiles}/{id}/package.zip`,
     storyOfflinePackage: `${baseUrlStorage}/stories/{id}/package.zip`,
     storyMediaBase: `${baseUrlStorage}/stories/{id}`,

diff --git a/src/scripts/hooks/use-globe-layer.ts b/src/scripts/hooks/use-globe-layer.ts
@@ -8,7 +8,7 @@ import {
 } from 'cesium';
 
 import {GlobeImageLayerData} from '../types/globe-image-layer-data';
-import {GlobeLayerType} from '../types/globe-layer-type';
+import {LayerType} from '../types/globe-layer-type';
 
 // update layer image when url changes
 export function useGlobeLayer(
@@ -53,12 +53,12 @@ export function useGlobeLayer(
           layersToRemove.forEach(layer => layers.remove(layer, true));
 
           // preload next images
-          if (imageLayer.type === GlobeLayerType.Image) {
+          if (imageLayer.type === LayerType.Image) {
             preloadNext(imageLayer.nextUrls);
           }
         };
 
-        if (imageLayer.type === GlobeLayerType.Tiles) {
+        if (imageLayer.type === LayerType.Tiles) {
           setTimeout(cleanAndCache, 500);
         } else {
           requestAnimationFrame(cleanAndCache);
@@ -72,7 +72,7 @@ export function useGlobeLayer(
 }
 
 function getImageProvider(imageLayer: GlobeImageLayerData) {
-  return imageLayer.type === GlobeLayerType.Tiles
+  return imageLayer.type === LayerType.Tiles
     ? new UrlTemplateImageryProvider({
         url: imageLayer.url,
         tilingScheme: new GeographicTilingScheme(),

diff --git a/src/scripts/libs/electron/get-offline-tiles-url.ts b/src/scripts/libs/electron/get-offline-tiles-url.ts
@@ -1,27 +1,37 @@
-import {GlobeLayerType} from '../../types/globe-layer-type';
+import {LayerType} from '../../types/globe-layer-type';
 
 // Returns the url template for offline usage
-export function getOfflineTilesUrl(type: GlobeLayerType): string {
+export function getOfflineTilesUrl(type: LayerType): string {
   if (!window.cfs) {
     console.error('Calling electron function from a non-electron environment');
     return '';
   }
 
-  return type === GlobeLayerType.Tiles
-    ? window.cfs.getDownloadsPath(
-        'downloads',
-        '{id}',
-        'tiles',
-        '{timeIndex}',
-        '{z}',
-        '{x}',
-        '{reverseY}.png'
-      )
-    : window.cfs.getDownloadsPath(
-        'downloads',
-        '{id}',
-        'tiles',
-        '{timeIndex}',
-        'full.png'
-      );
+  return {
+    [LayerType.Tiles]: window.cfs.getDownloadsPath(
+      'downloads',
+      '{id}',
+      'tiles',
+      '{timeIndex}',
+      '{z}',
+      '{x}',
+      '{reverseY}.png'
+    ),
+
+    [LayerType.Image]: window.cfs.getDownloadsPath(
+      'downloads',
+      '{id}',
+      'tiles',
+      '{timeIndex}',
+      'full.png'
+    ),
+
+    [LayerType.Gallery]: window.cfs.getDownloadsPath(
+      'downloads',
+      '{id}',
+      'tiles',
+      '{timeIndex}',
+      'full.jpg'
+    )
+  }[type];
 }
diff --git a/src/scripts/libs/get-image-layer-data.ts b/src/scripts/libs/get-image-layer-data.ts
@@ -4,7 +4,7 @@ import {isElectron, isOffline, getOfflineTilesUrl} from './electron/index';
 
 import {Layer} from '../types/layer';
 import {GlobeImageLayerData} from '../types/globe-image-layer-data';
-import {GlobeLayerType} from '../types/globe-layer-type';
+import {LayerType} from '../types/globe-layer-type';
 
 const NUM_PRELOAD_URLS = 5;
 
@@ -20,10 +20,11 @@ export function getImageLayerData(
     return null;
   }
 
-  let url =
-    layer.type === GlobeLayerType.Tiles
-      ? config.api.layerTiles
-      : config.api.layerImage;
+  let url = {
+    [LayerType.Tiles]: config.api.layerTiles,
+    [LayerType.Image]: config.api.layerImage,
+    [LayerType.Gallery]: config.api.layerGalleryImage
+  }[layer.type];
 
   // use local tiles when offline and in electron
   if (isElectron() && isOffline()) {

diff --git a/src/scripts/types/globe-image-layer-data.ts b/src/scripts/types/globe-image-layer-data.ts
@@ -1,8 +1,8 @@
-import {GlobeLayerType} from './globe-layer-type';
+import {LayerType} from './globe-layer-type';
 
 export interface GlobeImageLayerData {
   id: string;
-  type: GlobeLayerType;
+  type: LayerType;
   url: string;
   nextUrls: string[];
   zoomLevels: number;

diff --git a/src/scripts/types/globe-layer-type.ts b/src/scripts/types/globe-layer-type.ts
@@ -1,4 +1,5 @@
-export enum GlobeLayerType {
+export enum LayerType {
   Tiles = 'tiles',
-  Image = 'image'
+  Image = 'image',
+  Gallery = 'gallery'
 }
diff --git a/src/scripts/types/layer.d.ts b/src/scripts/types/layer.d.ts
@@ -1,10 +1,10 @@
 import {BasemapId} from '../types/basemap';
 import {GlobeView} from './globe-view';
-import {GlobeLayerType} from './globe-layer-type';
+import {LayerType} from './globe-layer-type';
 
 export interface Layer {
   id: string;
-  type: GlobeLayerType;
+  type: LayerType;
   zoomLevels: number;
   basemap: BasemapId | null;
   timestamps: string[]; // ISO 8601 timestamps

diff --git a/storage/layers/layers-de.json b/storage/layers/layers-de.json
@@ -163,5 +163,12 @@
     "shortName": "Lakes Color",
     "description": "",
     "link": "http://..."
+  },
+  {
+    "id": "ozone.ozone_profile",
+    "type": "Layertype",
+    "name": "Ozone Profile",
+    "shortName": "Ozone Profile",
+    "description": ""
   }
 ]
diff --git a/storage/layers/layers-en.json b/storage/layers/layers-en.json
@@ -164,5 +164,12 @@
     "shortName": "Lakes Color",
     "description": "",
     "link": "http://..."
+  },
+  {
+    "id": "ozone.ozone_profile",
+    "type": "Layertype",
+    "name": "Ozone Profile",
+    "shortName": "Ozone Profile",
+    "description": ""
   }
 ]
diff --git a/storage/layers/layers-es.json b/storage/layers/layers-es.json
@@ -164,5 +164,12 @@
     "shortName": "Lakes Color",
     "description": "",
     "link": "http://..."
+  },
+  {
+    "id": "ozone.ozone_profile",
+    "type": "Layertype",
+    "name": "Ozone Profile",
+    "shortName": "Ozone Profile",
+    "description": ""
   }
 ]
diff --git a/storage/layers/layers-fr.json b/storage/layers/layers-fr.json
@@ -164,5 +164,12 @@
     "shortName": "Lakes Color",
     "description": "",
     "link": "http://..."
+  },
+  {
+    "id": "ozone.ozone_profile",
+    "type": "Layertype",
+    "name": "Ozone Profile",
+    "shortName": "Ozone Profile",
+    "description": ""
   }
 ]
diff --git a/storage/layers/layers-nl.json b/storage/layers/layers-nl.json
@@ -164,5 +164,12 @@
     "shortName": "Lakes Color",
     "description": "",
     "link": "http://..."
+  },
+  {
+    "id": "ozone.ozone_profile",
+    "type": "Layertype",
+    "name": "Ozone Profile",
+    "shortName": "Ozone Profile",
+    "description": ""
   }
 ]