harmonized gadget scheme API for listgrid

api/TEMPLATE_listgrid

+  "portal_type_source": "Software Product",
+  "portal_type_title": "software",
+  "portal_type_fields": "software_fieldlist",
+  "initial_query": {"include_docs": true, "limit":[0,8]},
+  "form": true,
+  "id": "software_overview",
+  "property_dict": {
+    "link": true,
+    "link_identifier": "id",
+    "link_external": null,
+    "link_source": "item_url",
+    "ribbon": null,
+    "radio": null,
+    "check": null,
+    "dynamic_children": [0]
+  },
+  "scheme": [
+  {
+    "position": "left",
+    "fieldlist": [
+      {"field": "image_url", "type": "image"},
+      {"field": "title", "type": "alt"},
+      {"field": "some_translation_pointer", "type": "alt_i18n"},
+      {"custom": true, "type": "icon", "value": "baz"}
+    ]
+  },
+  {
+    "position": "center",
+    "fieldlist": [
+      {"field": "title", "type": "h1"},
+      {"field": "description", "type": "p"},
+      {"field": "price", "type": "p", "aside": true},
+      {"field": "some_url", "type":"count"}
+    ],
+  },
+  {
+    "position": "right",
+    "fieldlist": [
+      {"custom": true, "type": "icon", "value": "bar"},
+      {"field": "some_url", "type": "url", "external": true, "action": baz, "title": null, "title_i18n": null}
+    ]
+  }
+  ],
+  "children": [{
+    "generate":"widget",
+    "type": "listview",
+    "class_list": "",
+    "theme": "slapos-white",
+    "property_dict": {
+      "alt_icon": null
+      "numbered": false
+      "inset": true,
+      "reveal": true,
+      "filter": true,
+      "input": "#foo"
+      "placeholder": null,
+      "filter_theme": null,
+      "divider_theme": "slapos-white",
+      "autodividers": true,
+      "count_theme": "slapos-white"
+    },
+    "children": []
+  }]
+
+
+mapped:
+
+   * {
+   *   "generate": "gadget",
+   *   "type": "listview",
+   *   "class_list": "",
+   *   "theme": "slapos-black",
+   *   "property_dict": {
+   *     "alt_icon": null
+   *     "numbered": false
+   *     "inset": true,
+   *     "reveal": true,
+   *     "filter": true,
+   *     "input": "#foo"
+   *     "placeholder": null,
+   *     "filter_theme": null,
+   *     "divider_theme": "slapos-white",
+   *     "autodividers": true,
+   *     "count_theme": "slapos-white"
+   *   },
+   *   "children": [
+   *   {
+   *     "type": "item/divider",
+   *     "id": null,
+   *     "external": true,
+   *     "href": "index.html",
+   *     "icon": "foo"/null,
+   *     "title": null,
+   *     "title_i18n":"",
+   *     "left": {
+   *       "icon": "foo",
+   *       "image": "http://www.xyz.com/img/foo.png",
+   *       "alt": null,
+   *       "alt_i18n": null
+   *     },
+   *     "center": {
+   *       "text": [
+   *         {"type":"p", "aside": true, "text":"foo", "text_i18n":null},
+   *         {"type": "span", "count": true, "text": "somevalue"}
+   *       ]
+   *     },
+   *   "right": {
+   *     "radio": true,
+   *     "check": true,
+   *     "icon": null,
+   *     "action": "foo",
+   *     "href": "http://www.foo.com",
+   *     "title": null,
+   *     "title_i18n": "",
+   *     "external": true
+   *    }
+   *  ]
+   *}
\ No newline at end of file

data/software_overview.json

@@ -10,6 +10,22 @@
     "link_identifier": "id",
     "dynamic_children": [1]
   },
+  "scheme": [
+    {
+      "position": "left",
+      "fieldlist": [
+        {"field": "image_url", "type": "image"},
+        {"field": "title", "type": "alt"}
+      ]
+    },
+    {
+      "position": "center",
+      "fieldlist": [
+        {"field": "title", "type": "h1"},
+        {"field": "description", "type": "p"}
+      ]
+    }
+  ],
   "children": [{
     "generate": "widget",
     "type": "controlbar",

js/erp5_loader.js

@@ -642,18 +642,23 @@
      * @param {object} url_pointer Info which layout items are created for
      * @return {object} mapped object
      **/
-    // TODO: this should be in a storage-related utility object!
-    // TODO: count/aside still not implemented on listview
-    // TODO: add remaining mapping!
-    // TODO: MAKE GENERIC API with layout!
     "mapListItems": function (items, spec, url_pointer) {
-      var property, obj, i, item, clean, value, store, split, host,
-        i18n, application, level, core, arr;
+      var obj, i, j, k, item, level, core, arr, section, field, props, pos;
+
+      if (spec.scheme === undefined) {
+        util.error("mapListItems: Missing scheme");
+
+      } else {
+        arr = [];
+        props = spec.property_dict;
 
+        // link base for internal links
+        if (props.link && !props.link_source) {
           level = url_pointer.layout;
           core = url_pointer.fragment_list.slice(0, level + 1).join("::");
-      arr = [];
+        }
 
+        // loop items and map according to scheme
         for (i = 0; i < items.length; i += 1) {
           item = items[i].doc;
           obj = {
@@ -663,97 +668,68 @@
             }
           };
 
-        // if include_docs is not set, item will be undefined!
+          // throw error for missing data 
           if (item === undefined) {
-          util.error("mapListItems: missing include_docs");
+            util.error("mapListItems: Missing include_docs/data-set");
+
+          } else {
+            // TODO: keep ?
+            // ribbon
+            if (props.ribbon) {
+              obj.ribbon = true;
             }
 
+            // TODO: move radio/check into feature_dict and on item level?
             // radio
-        if (spec.property_dict.radio) {
+            if (props.radio) {
               obj.right = {"radio": true, "action": "check"};
             }
 
             // checkbox
-        if (spec.property_dict.check) {
+            if (props.check) {
               obj.right = {"check": true, "action": "check"};
             }
 
-        // TODO: we can't handle normal URLs if they are passed!
-        // should only be possible if links will be external, but how to set?
-        if (spec.property_dict.link) {
-          obj.href = "#" + core + "::" +
-              item[spec.property_dict.link_identifier || "id"];
+            // link
+            if (props.link) {
+              obj.href = item[props.link_source] ||
+                  ("#" + core + "::" + item[props.link_identifier || "id"]);
+              if (props.link_external) {
+                obj.external = true;
+              }
             }
 
-        // TODO: don't do this based on hardcoded filenames!!!
-        for (property in item) {
-          if (item.hasOwnProperty(property)) {
-            clean = property.replace((spec.portal_type_title + "_"), "");
-
-            switch (clean) {
-            case "url":
-              obj.href = item[property];
-              split = item[property].split("//");
+            // loop scheme sections
+            for (j = 0; j < spec.scheme.length; j += 1) {
+              section = spec.scheme[j];
+              pos = section.position;
+              obj[pos] = obj[pos] || {};
 
-              // TODO: crap... an empty link will generate a ribbon...
-              if (item[property] === "") {
-                obj.ribbon = true;
-              }
+              // loop scheme fields
+              for (k = 0; k < section.fieldlist.length; k += 1) {
+                field = section.fieldlist[k];
 
-              // TODO: refactor. Determining whether a link is external
-              if (split.length > 1) {
-                host = split[1].split("/")[0];
-                application = split[1].split("/")[1];
-              }
-              if ((split.length > 1 && window.location.host !== host) ||
-                  application === "app") {
-                obj.external = true;
-              }
-              break;
-            case "_id":
-              obj.id = item[property];
-              break;
-            case "title":
-              value = item[property];
-              obj[clean] = value;
-              i18n = item[property + "_i18n"] || null;
-              obj.center.text.unshift({
-                "type": "h1",
-                "text": value,
-                "text_i18n": i18n
-              });
-              break;
-            case "description":
-              i18n = item[property + "_i18n"] || null;
-              obj.center.text.push({
-                "type": "p",
-                "text": item[property],
-                "text_i18n": i18n
+                if (obj[pos].text) {
+                  // add object to text-array
+                  // TODO: not nice & find better handling for i18n tags!
+                  obj[pos].text.push({
+                    "type":field.type,
+                    "text": item[field.field],
+                    "aside": field.aside || null,
+                    "count": field.count || null,
+                    "text_i18n": item[field.field + "_18n"] || null
                   });
-              break;
-            case "image_type":
-              obj.left = {};
-              obj.left[item[property]] = (store !== undefined ? store : false);
-              break;
-            case "image_url":
-              if (obj.left !== undefined) {
-                if (obj.left.image === false) {
-                  obj.left.image = item[property];
-                  obj.left.alt = item.title;
-                }
-                if (obj.left.icon === false) {
-                  obj.left.icon = item[property];
-                }
                 } else {
-                store = item[property];
+                  // set type to item field or field value (custom fields!)
+                  obj[pos][field.type] = item[field.field || field.value];
                 }
-              break;
               }
             }
           }
           arr.push(obj);
         }
         return arr;
+      }
     },
 
     /**
@@ -2641,12 +2617,13 @@
    *     "left": {
    *       "icon": "foo",
    *       "image": "http://www.xyz.com/img/foo.png",
-   *       "alt": null
+   *       "alt": null,
+   *       "alt_i18n": null
    *     },
    *     "center": {
-   *       "count": 3689,
    *       "text": [
-   *         {"aside": true, "type":"p", "text":"foo", "text_i18n":null}
+   *          {"type":"p", "aside": true, "text":"foo", "text_i18n":null},
+   *          {"type": "span", "count": true, "text": "3689"}
    *       ]
    *     },
    *   "right": {
@@ -2669,7 +2646,8 @@
    */
   // TODO: add to form support via children
   // TODO: add collapsible support if needed
-  // TODO: mesh with live data!
+  // TODO: dividers? will not be in spec, so can only be listview option!
+  // TODO: count/aside still not implemented on listview
   factory.listview = function (spec, url_dict, update) {
     var fragment, config, list, i, item, props, divider, static_item, j,
       input_dict, action, block, target, icon, auto, last,