Merge branch 'refresh' of https://github.com/unepwcmc/ocean-plus-habi…

…tats into refresh
unepwcmc · Jun 8, 2021 · 38e7122 · 38e7122
2 parents b4e18c1 + e8e330a
commit 38e7122
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 14 deletions.
diff --git a/app/javascript/components/map/mixins/mixin-add-layers.js b/app/javascript/components/map/mixins/mixin-add-layers.js
@@ -1,21 +1,29 @@
 import { getFirstDataLayerId } from '../helpers/map-helpers'
 
-const addImagePaintOptions = (map, options, layer) => {
-  addFillPaintOptions(options, layer)
-  const patternId = 'pattern' + layer.id
-
-  options['paint']['fill-pattern'] = patternId
-
+const addImageLayer = (map, options, layer, nextLayer) => {
   map.loadImage(
     layer.image,
     (err, image) => {
-      if (err) { throw err }
-
-      map.addImage(patternId, image)
+      if (err) { 
+        console.warn(`Image ${layer.image} not found. Falling back to solid fill.`)
+
+        delete options['paint']['fill-pattern']
+
+        map.addLayer(options, nextLayer)
+      } else {
+        map.addImage(getPatternId(layer), image)
+        map.addLayer(options, nextLayer)
+      }
     }
   )
 }
 
+const addImagePaintOptions = (options, layer) => {
+  addFillPaintOptions(options, layer)
+
+  options['paint']['fill-pattern'] = getPatternId(layer)
+}
+
 const addFillPaintOptions = (options, layer) => {
   options['type'] = 'fill'
   options['paint'] = {
@@ -54,6 +62,8 @@ const addLinePaintOptions = (options, layer) => {
   } 
 }
 
+const getPatternId = layer => 'pattern' + layer.id
+
 const getOpacity = opacity => opacity || 1
 
 export default {
@@ -74,14 +84,19 @@ export default {
       } else if (layer.type === 'line') {
         addLinePaintOptions(options, layer)
       } else if (layer.image) {
-        addImagePaintOptions(this.map, options, layer)
+        addImagePaintOptions(options, layer)
       } else {
         addFillPaintOptions(options, layer)
       }
 
       const nextLayer = layer.addUnderneath ? getFirstDataLayerId(this.map) : this.firstForegroundLayerId
 
-      this.map.addLayer(options, nextLayer)
+      if (layer.image) {
+        // Need to wait until image is loaded in case falling back to solid fill
+        addImageLayer(this.map, options, layer, nextLayer)
+      } else {
+        this.map.addLayer(options, nextLayer)
+      }
     }
   }
 }
diff --git a/app/serializers/serializers/map_datasets_serializer.rb b/app/serializers/serializers/map_datasets_serializer.rb
@@ -111,7 +111,7 @@
     addUnderneath: true,
     name: I18n.t('global.map.wdpa_title'),
     disabled: false,
-    image: ActionController::Base.helpers.image_url('map/stripes-wdpa.png')
+    image: 'map/stripes-wdpa.png'
   },
   {
     id: 'oecm',
@@ -131,7 +131,7 @@
     addUnderneath: true,
     name: I18n.t('global.map.oecm_title'),
     disabled: false,
-    image: ActionController::Base.helpers.image_url('map/stripes-oecm.png')
+    image: 'map/stripes-oecm.png'
   }
 ].freeze
 
@@ -163,11 +163,19 @@ def serialize()
 
       dataset
     end
-    habitat_datasets + WDPA_DATASETS
+    habitat_datasets + wdpa_datasets
   end
 
   private
 
+  def wdpa_datasets
+    WDPA_DATASETS.map do |ds|
+      dataset = ds.dup
+      dataset[:image] = ActionController::Base.helpers.image_url(dataset[:image])
+
+      dataset
+    end
+  end
 
   def habitat_presence_status dataset
     @habitat_presence_statuses[dataset[:id]]