Added shadow icon in configuration.

Author: akbargumbira

users/config.py.prod

@@ -33,9 +33,11 @@ MAIL_ADMIN = ('InaSAFE User Map Administrator', MAIL_CONFIG['MAIL_USERNAME'])
 
 # USER ICONS: All icon paths that are used.
 # For now, there are only 3 icons that should be configured: user, trainer,
-# developer. Next time, we can be more flexible about this (the role)
+# developer. And used the same shadow for all of the icons. Next time,
+# we can be more flexible about this (the role)
 USER_ICONS = dict(
     user='/static/img/user-icon.png',
     trainer='/static/img/trainer-icon.png',
-    developer='/static/img/developer-icon.png'
+    developer='/static/img/developer-icon.png',
+    shadow='/static/img/shadow-icon.png'
 )

users/config.py.test

@@ -34,9 +34,11 @@ MAIL_ADMIN = ('InaSAFE User Map Administrator', MAIL_CONFIG['MAIL_USERNAME'])
 
 # USER ICONS: All icon paths that are used.
 # For now, there are only 3 icons that should be configured: user, trainer,
-# developer. Next time, we can be more flexible about this (the role)
+# developer. And used the same shadow for all of the icons. Next time,
+# we can be more flexible about this (the role)
 USER_ICONS = dict(
     user='/static/img/user-icon.png',
     trainer='/static/img/trainer-icon.png',
-    developer='/static/img/developer-icon.png'
+    developer='/static/img/developer-icon.png',
+    shadow='/static/img/shadow-icon.png'
 )

users/static/js/user-map-component.js

@@ -23,14 +23,15 @@ function createBasemap() {
 
 /**
  * Create IconMarkerBase that will be used for icon marker.
+ * @param {string} shadow_icon_path The path to shadow icon.
  * @returns {object} IconMarkerBase
  * @property Icon
  */
-function createIconMarkerBase() {
+function createIconMarkerBase(shadow_icon_path) {
   var IconMarkerBase;
   IconMarkerBase = L.Icon.extend({
     options: {
-      shadowUrl: '/static/img/shadow-icon.png',
+      shadowUrl: shadow_icon_path,
       iconSize: [19, 32],
       shadowSize: [42, 35],
       iconAnchor: [12, 32],
@@ -46,10 +47,11 @@ function createIconMarkerBase() {
  * @param {string} user_icon_path The icon path for user role.
  * @param {string} trainer_icon_path The icon path for trainer role.
  * @param {string} developer_icon_path The icon path for developer role.
+ * @param {string} shadow_icon_path The shadow for all icons.
  * @returns {{user_icon: IconMarkerBase, trainer_icon: IconMarkerBase, developer_icon: IconMarkerBase}}
  */
-function createAllIcons(user_icon_path, trainer_icon_path, developer_icon_path) {
-  var IconMarkerBase = createIconMarkerBase();
+function createAllIcons(user_icon_path, trainer_icon_path, developer_icon_path, shadow_icon_path) {
+  var IconMarkerBase = createIconMarkerBase(shadow_icon_path);
   var user_icon = new IconMarkerBase({iconUrl: user_icon_path});
   var trainer_icon = new IconMarkerBase({iconUrl: trainer_icon_path});
   var developer_icon = new IconMarkerBase({iconUrl: developer_icon_path});
@@ -246,7 +248,7 @@ function onMapClick(e) {
   var user = {
     'latitude': markerLocation.lat.toFixed(8),
     'longitude': markerLocation.lng.toFixed(8)
-  }
+  };
   var popup = getUserFormPopup(user, ADD_USER_MODE);
   marker_new_user.bindPopup(popup).openPopup()
 }

users/templates/html/base.html

@@ -72,7 +72,8 @@
   var icons = createAllIcons(
       '{{ user_icons.user }}',
       '{{ user_icons.trainer }}',
-      '{{ user_icons.developer }}'
+      '{{ user_icons.developer }}',
+      '{{ user_icons.shadow }}'
   );
   user_icon = icons.user_icon;
   trainer_icon = icons.trainer_icon;