feature: featureinfo templates with alias and API functionality (orig…

…o-map#1682)

* feature: aliases with featureinfo templates

Fixes origo-map#1681
Configured like:
  "attributeAlias": {
    "name":"Namn"
  }
in the config. Can be tested by removing the attribute setting for the origo cities layer in the standard map.

* Added API functionality

* Update map.js

mapConfig assigned with switch statement

src/featureinfo.js

@@ -13,7 +13,7 @@ import getFeatureInfo from './getfeatureinfo';
 import replacer from './utils/replacer';
 import SelectedItem from './models/SelectedItem';
 import attachmentclient from './utils/attachmentclient';
-import getAttributes, { getContent } from './getattributes';
+import getAttributes, { getContent, featureinfotemplates } from './getattributes';
 import relatedtables from './utils/relatedtables';
 
 const styleTypes = StyleTypes();
@@ -694,7 +694,8 @@ const Featureinfo = function Featureinfo(options = {}) {
     },
     render,
     showInfo,
-    showFeatureInfo
+    showFeatureInfo,
+    featureinfotemplates
   });
 };
 

src/featureinfotemplates.js

@@ -1,9 +1,29 @@
 import defaultTemplate from './templates/featureinfotemplate';
+import templateHelpers from './utils/templatehelpers';
 
 const templates = {};
 templates.default = defaultTemplate;
 
-function featureinfotemplates(template, attributes) {
-  return templates[template](attributes);
+function addFeatureinfotemplate(name, fn) {
+  templates[name] = fn;
+  return true;
 }
-export default featureinfotemplates;
+
+function renameKeys(obj, newKeys) {
+  const keyValues = Object.keys(obj).map(key => {
+    const newKey = newKeys[key] || key;
+    return { [newKey]: obj[key] };
+  });
+  return Object.assign({}, ...keyValues);
+}
+
+function getFromTemplate(template, featureAttributes, attributeAlias) {
+  const attributes = featureAttributes;
+  if (attributes.url) {
+    attributes.url = `<a href="${attributes.url}" target="_blank">${attributes.url}</a>`;
+  }
+  const renamedObj = renameKeys(attributes, attributeAlias);
+  return templates[template](renamedObj);
+}
+
+export default { getFromTemplate, addFeatureinfotemplate, templateHelpers };

src/getattributes.js

@@ -197,6 +197,7 @@ function getAttributes(feature, layer, map) {
   featureinfoElement.appendChild(ulList);
   const attributes = feature.getProperties();
   const geometryName = feature.getGeometryName();
+  const attributeAlias = map.get('mapConfig').attributeAlias || [];
   delete attributes[geometryName];
   let content;
   let attribute;
@@ -207,7 +208,7 @@ function getAttributes(feature, layer, map) {
     // If attributes is string then use template named with the string
     if (typeof layerAttributes === 'string') {
       // Use attributes with the template
-      const li = featureinfotemplates(layerAttributes, attributes);
+      const li = featureinfotemplates.getFromTemplate(layerAttributes, attributes, attributeAlias);
       const templateList = document.createElement('ul');
       featureinfoElement.appendChild(templateList);
       templateList.innerHTML = li;
@@ -216,7 +217,7 @@ function getAttributes(feature, layer, map) {
         attribute = layer.get('attributes')[i];
         val = '';
         if (attribute.template) {
-          const li = featureinfotemplates(attribute.template, attributes);
+          const li = featureinfotemplates.getFromTemplate(attribute.template, attributes, attributeAlias);
           const templateList = document.createElement('ul');
           featureinfoElement.appendChild(templateList);
           templateList.innerHTML = li;
@@ -244,7 +245,7 @@ function getAttributes(feature, layer, map) {
     }
   } else {
     // Use attributes with the template
-    const li = featureinfotemplates('default', attributes);
+    const li = featureinfotemplates.getFromTemplate('default', attributes, attributeAlias);
     const templateList = document.createElement('ul');
     featureinfoElement.appendChild(templateList);
     templateList.innerHTML = li;
@@ -253,7 +254,5 @@ function getAttributes(feature, layer, map) {
   return content;
 }
 
-// export { getAttributes as default, getContent };
-
 export default getAttributes;
-export { getContent };
+export { getContent, featureinfotemplates };

src/map.js

@@ -4,13 +4,29 @@ import mapInteractions from './mapinteractions';
 
 const Map = (options = {}) => {
   const interactions = mapInteractions({ target: options.target, mapInteractions: options.pageSettings && options.pageSettings.mapInteractions ? options.pageSettings.mapInteractions : {} });
+  const mapConfig = {};
+  const keys = Object.keys(options);
+  keys.forEach((key) => {
+    switch (key) {
+      case 'controls':
+      case 'defaultControls':
+      case 'groups':
+      case 'layers':
+      case 'source':
+      case 'styles':
+        break;
+      default:
+        mapConfig[key] = options[key];
+    }
+  });
+
   const mapOptions = Object.assign(options, { interactions });
   delete mapOptions.layers;
   mapOptions.controls = [];
 
   const view = new OlView(options);
   const map = new OlMap(Object.assign(mapOptions, { view }));
-
+  map.set('mapConfig', mapConfig);
   return map;
 };