handling data elements that are arrays

README.md

@@ -1,5 +1,4 @@
-Adobe Launch - Mapping Table
-============================
+# Adobe Launch - Mapping Table
 
 Provides a rich and versatile mapping table data element.
 
@@ -21,11 +20,27 @@ JSON & CSV import and export supported directly from within the data element.
 If you are using the *regex with matching*, you can use the results of your matching groups in the output with the common syntax of `$1`, `$2`, etc. \
 You cannot use the matching `$1`, etc. within a data element name in the output. e.g. `%my element $1%` is not supported and will throw an error upon saving the mapping table data element. 
 
+## Basic Usage:
+Select a **Data Element** to be searched for matches - this can either be a single value such as `%pageName%` or an array, like `%productsInCart%`. 
+
+When an array is given, each element of the array will be searched, and a corresponding mapping given, resulting in an output which is an array, of the same length as the input array.
+
+Click the `+` sign to add a mapping row. Order matters - higher rows will be considered first and the search for a match will end with the first successful match. You can drag and drop rows to change the order.
+
+Within each row choose:
+- A **Method** - possible methods are mentioned above
+- An **Input** - this is what you are looking to match within the Data Element. 
+- An **Output** - this is what you want to transform the Input into
+
+E.g. if the Method is "Contains", the Input is "meaning of life", the Output is "42", and the Data Element is "what is the answer to the meaning of life?" then the output will be "42"
+
+Check the **Default Value** at the top if you want to pass through the original value in the case that no match has been found. If unselected and no match is found, the output value will be `undefined`.
+
 A **detailed walk through** of some use cases can be found in the [Tutorial PDF](doc/mapping-table-tutorial.pdf).
 
 
 Official implementation of https://www.adobeexchange.com/experiencecloud.details.103136.html.
 
 -------------------------------------------------------------------------------------------------------------------
 
-Please refer to the [Release Notes](ReleaseNotes.md) for an overview of what has changed in the respective version.
+Please refer to the [Release Notes](ReleaseNotes.md) for an overview of what has changed in the respective version.

extension.json

@@ -2,7 +2,7 @@
   "displayName": "Mapping Table",
   "name": "mapping-table",
   "platform": "web",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "exchangeUrl": "https://www.adobeexchange.com/experiencecloud.details.103136.html",
   "description": "Provides a rich and versatile mapping table data element. Supports regex, exact and case insensitive matches, starts with, contains and boolean matching. Further the output can be static or another data element to offer even more flexibility. E.g. ideal for implementing multiple marketing pixels.",
   "author": {
@@ -32,4 +32,4 @@
       "viewPath": "dataElements/mappingTable.html"
     }
   ]
-}
+}

src/lib/dataElements/mappingTable.js

@@ -9,10 +9,8 @@
  * @returns {*}
  */
 module.exports = function (settings) {
-    if (typeof settings !== 'undefined' && settings !== null) {
-        var dataElemValue = settings.dataElement;
-        addStartsWithToIE();
 
+    function checkValue(dataElemValue) {
         try {
             for (var i = 0; i < settings.size; i++) {
                 var method = settings[i].method;
@@ -84,6 +82,15 @@ module.exports = function (settings) {
         }
         return dataElemValue;
     }
+
+    if (typeof settings !== 'undefined' && settings !== null) {
+        var dataElemValue = settings.dataElement;
+        addStartsWithToIE();
+        if (typeof dataElemValue !== 'undefined' && dataElemValue !== null && Array.isArray(dataElemValue)) {
+            return dataElemValue.map(checkValue);
+        }
+        return checkValue(dataElemValue);
+    }
 };
 
 /**
@@ -96,5 +103,4 @@ var addStartsWithToIE = function () {
             return this.substr(position, searchString.length) === searchString;
         };
     }
-};
-
+};

src/view/configuration/configuration.html

@@ -37,7 +37,27 @@ <h1 style="margin-top: 0">Mapping Table</h1>
         common syntax of <i>$1, $2</i>, etc.<br/>
         You cannot use the matching <i>$1</i>, etc. within a data element name in the output.
         e.g. <i>%my element $1%</i> is not supported and will throw an error upon saving the mapping table data element.<br/><br/>
+    </p>
+
+    <h2>Basic Usage</h2>
+    <p>Select a <b>Data Element</b> to be searched for matches - this can either be a single value such as <i>%pageName%</i> or an array, like <i>%productsInCart%</i>.</p>
+
+    <p>When an array is given, each element of the array will be searched, and a corresponding mapping given, resulting in an output which is an array, of the same length as the input array.</p>
+
+    <p>Click the <b>+</b> sign to add a mapping row. Order matters - higher rows will be considered first and the search for a match will end with the first successful match. You can drag and drop rows to change the order.</p>
+
+    <p>Within each row choose:</p>
+    <ul>
+        <li>A <b>Method</b> - possible methods are mentioned above</li>
+        <li>An <b>Input</b> - this is what you are looking to match within the Data Element.</li>
+        <li>An <b>Output</b> - this is what you want to transform the Input into</li>
+    </ul>
+
+    <p>E.g. if the Method is "Contains", the Input is "meaning of life", the Output is "42", and the Data Element is "what is the answer to the meaning of life?" then the output will be "42"</p>
 
+    <p>Check the <b>Default Value</b> at the top if you want to pass through the original value in the case that no match has been found. If unselected and no match is found, the output value will be <i>undefined</i>.</p>
+
+    <p>
         A detailed walk through of some use cases can be found in the <a
             href="https://github.com/B3n3/Adobe-Launch-Mapping-Table/raw/master/doc/mapping-table-tutorial.pdf"
             target="_blank">Tutorial PDF</a>.
@@ -67,4 +87,4 @@ <h1 style="margin-top: 0">Mapping Table</h1>
     });
 </script>
 </body>
-</html>
+</html>