From 413b21c5447fffe1f6a70c39f0c7d3c374274171 Mon Sep 17 00:00:00 2001
From: Frederic Junod <frederic.junod@camptocamp.com>
Date: Mon, 29 Apr 2019 17:03:34 +0200
Subject: [PATCH] Support GmfGroup for the background layers in the api

---
 api/src/Themes.js                | 34 ++++++++++++++++++++++++++++----
 api/src/constants.js             |  2 +-
 contribs/gmf/src/theme/Themes.js |  8 +-------
 contribs/gmf/src/themes.js       |  2 +-
 4 files changed, 33 insertions(+), 13 deletions(-)

diff --git a/api/src/Themes.js b/api/src/Themes.js
index 690546587572..70d0ddc3294f 100644
--- a/api/src/Themes.js
+++ b/api/src/Themes.js
@@ -3,6 +3,7 @@ import ImageWMS from 'ol/source/ImageWMS.js';
 import WMTS, {optionsFromCapabilities} from 'ol/source/WMTS.js';
 import TileLayer from 'ol/layer/Tile.js';
 import ImageLayer from 'ol/layer/Image.js';
+import GroupLayer from 'ol/layer/Group.js';
 
 import constants from './constants.js';
 
@@ -31,13 +32,13 @@ let overlayDefPromise;
 
 /**
  * @hidden
- * @returns {Promise<Array<TileLayer|ImageLayer>>} Promise
+ * @returns {Promise<Array<TileLayer|ImageLayer|GroupLayer>>} Promise
  */
 export function getBackgroundLayers() {
   return getThemesPromise().then((themes) => {
     const promises = [];
     for (const config of themes.background_layers) {
-      if (config.type === 'WMTS') {
+      if (/** @type {import('gmf/themes.js').GmfLayer} */ (config).type === 'WMTS') {
         const layerWMTS = /** @type {import('gmf/themes.js').GmfLayerWMTS} */(config);
         promises.push(
           createWMTSLayer(layerWMTS).then((layer) => {
@@ -46,7 +47,7 @@ export function getBackgroundLayers() {
             return layer;
           })
         );
-      } else if (config.type === 'WMS') {
+      } else if (/** @type {import('gmf/themes.js').GmfLayer} */ (config).type === 'WMS') {
         const layerWMS = /** @type {import('gmf/themes.js').GmfLayerWMS} */(config);
         const ogcServer = themes.ogcServers[config.ogcServer];
         promises.push(
@@ -56,9 +57,34 @@ export function getBackgroundLayers() {
             return layer;
           })
         );
+      } else if (/** @type {import('gmf/themes.js').GmfGroup} */ (config).children) {
+        // reverse children order
+        const reversed = /** @type {import('gmf/themes.js').GmfGroup} */ (config).children.slice().reverse();
+
+        // create all the layers for the layer group
+        const groupPromise = Promise.all(reversed.map((item) => {
+          const child = /** @type {import('gmf/themes.js').GmfLayer} */ (item);
+          if (child.type === 'WMTS') {
+            const layerWMTS = /** @type {import('gmf/themes.js').GmfLayerWMTS} */ (child);
+            return createWMTSLayer(layerWMTS);
+          } else if (child.type === 'WMS') {
+            const layerWMS = /** @type {import('gmf/themes.js').GmfLayerWMS} */ (child);
+            return createWMSLayer(layerWMS, themes.ogcServers[child.ogcServer]);
+          }
+        }));
+        promises.push(
+          groupPromise.then((layers) => {
+            // create a layer group for the children.
+            const group = new GroupLayer({
+              layers: layers
+            });
+            group.set('config.name', config.name);
+            return group;
+          })
+        );
       }
     }
-    return Promise.all(promises);
+    return Promise.all(/** @type {Array<Promise<TileLayer|ImageLayer|GroupLayer>>} */ (promises));
   });
 }
 
diff --git a/api/src/constants.js b/api/src/constants.js
index 725645db2f80..f912f43fad2e 100644
--- a/api/src/constants.js
+++ b/api/src/constants.js
@@ -10,5 +10,5 @@ export default {
    * The name of the layer to use as background. May be a single value
    * (WMTS) or a comma-separated list of layer names (WMS).
    */
-  backgroundLayer: 'OSM map',
+  backgroundLayer: 'orthophoto',
 };
diff --git a/contribs/gmf/src/theme/Themes.js b/contribs/gmf/src/theme/Themes.js
index a0bc905f5b54..c2cb48550917 100644
--- a/contribs/gmf/src/theme/Themes.js
+++ b/contribs/gmf/src/theme/Themes.js
@@ -305,13 +305,7 @@ export class ThemesService extends olEventsEventTarget {
    */
   getBackgroundLayersObject() {
     console.assert(this.promise_ !== null);
-    return this.promise_.then(
-      /**
-       * @param {!import('gmf/themes.js').GmfThemesResponse} data The "themes" web service response.
-       * @return {!Array.<!import('gmf/themes.js').GmfLayer>} The background layers object.
-       */
-      data => data.background_layers
-    );
+    return this.promise_.then(data => data.background_layers);
   }
 
   /**
diff --git a/contribs/gmf/src/themes.js b/contribs/gmf/src/themes.js
index 746e731d28ef..091904a302cf 100644
--- a/contribs/gmf/src/themes.js
+++ b/contribs/gmf/src/themes.js
@@ -9,7 +9,7 @@
 
 /**
  * @typedef {Object} GmfThemesResponse
- * @property {!Array.<!GmfLayer>} background_layers
+ * @property {!Array.<!GmfLayer|!GmfGroup>} background_layers
  * @property {!Array.<string>} errors
  * @property {!GmfOgcServers} ogcServers
  * @property {!Array.<!GmfTheme>} themes