[erp5_web_renderjs_ui] Add draft support for editable listbox

bt5/erp5_hal_json_style/SkinTemplateItem/portal_skins/erp5_hal_json_restricted_style/ERP5Document_getHateoas.xml

@@ -71,13 +71,14 @@ return context.ERP5Document_getHateoas(\n
   relative_url=relative_url,\n
   list_method=list_method,\n
   default_param_json=default_param_json,\n
+  form_relative_url=form_relative_url,\n
   restricted=1\n
 )\n
 </string> </value>
         </item>
         <item>
             <key> <string>_params</string> </key>
-            <value> <string>REQUEST=None, response=None, view=None, mode=\'root\', query=None, select_list=None, limit=10, form=None, relative_url=None, list_method=None, default_param_json=None</string> </value>
+            <value> <string>REQUEST=None, response=None, view=None, mode=\'root\', query=None, select_list=None, limit=10, form=None, relative_url=None, list_method=None, default_param_json=None, form_relative_url=None</string> </value>
         </item>
         <item>
             <key> <string>id</string> </key>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_form_js.xml

@@ -111,6 +111,39 @@
   /////////////////////////////////////////////////////////////////\n
   // Precompile the templates while loading the first gadget instance\n
   var gadget_klass = rJS(window);\n
+\n
+  function getFieldTypeGadgetUrl(type) {\n
+    var field_url = \'gadget_erp5_field_readonly.html\';\n
+    if (type === \'ListField\') {\n
+      field_url = \'gadget_erp5_field_list.html\';\n
+    } else if ((type === \'ParallelListField\') ||\n
+               (type === \'MultiListField\')) {\n
+      field_url = \'gadget_erp5_field_multilist.html\';\n
+    } else if (type === \'CheckBoxField\') {\n
+      field_url = \'gadget_erp5_field_checkbox.html\';\n
+    } else if (type === \'StringField\') {\n
+      field_url = \'gadget_erp5_field_string.html\';\n
+    } else if (type === \'RelationStringField\') {\n
+      field_url = \'gadget_erp5_field_relationstring.html\';\n
+    } else if (type === \'TextAreaField\') {\n
+      field_url = \'gadget_erp5_field_textarea.html\';\n
+    } else if (type === \'DateTimeField\') {\n
+      field_url = \'gadget_erp5_field_datetime.html\';\n
+    } else if (type === \'FloatField\') {\n
+      field_url = \'gadget_erp5_field_float.html\';\n
+    } else if (type === \'IntegerField\') {\n
+      field_url = \'gadget_erp5_field_integer.html\';\n
+    } else if (type === \'ListBox\') {\n
+      field_url = \'gadget_erp5_field_listbox.html\';\n
+    } else if (type === \'EditorField\') {\n
+      field_url = \'gadget_erp5_field_textarea.html\';\n
+      // field_url = \'gadget_codemirror.html\';\n
+      // sandbox = \'iframe\';\n
+    } else if (type === \'GadgetField\') {\n
+      field_url = \'gadget_erp5_field_gadget.html\';\n
+    }\n
+    return field_url;\n
+  }\n
 \n
   gadget_klass\n
     /////////////////////////////////////////////////////////////////\n
@@ -150,6 +183,11 @@
           gadget_element.previousElementSibling.querySelector("span").textContent = "";\n
         });\n
     })\n
+\n
+    .allowPublicAcquisition("getFieldTypeGadgetUrl", function (param_list) {\n
+      return getFieldTypeGadgetUrl(param_list[0]);\n
+    })\n
+\n
     /////////////////////////////////////////////////////////////////\n
     // declared methods\n
     /////////////////////////////////////////////////////////////////\n
@@ -191,7 +229,7 @@
                   // Field is enabled in this context\n
                   var field_queue = new RSVP.Queue(),\n
                     sandbox = "public",\n
-                    field_url = \'gadget_erp5_field_readonly.html\',\n
+                    field_url,\n
                     // Don\'t change the structure without changing notifyValid and notifyInvalid\n
                     field_element = document.createElement("div"),\n
                     gadget_element = document.createElement("div"),\n
@@ -213,34 +251,8 @@
                   if (group[0] !== "bottom") {\n
                     field_element.appendChild(label_element);\n
                   }\n
-                  if (renderered_field.type === \'ListField\') {\n
-                    field_url = \'gadget_erp5_field_list.html\';\n
-                  } else if ((renderered_field.type === \'ParallelListField\') ||\n
-                             (renderered_field.type === \'MultiListField\')) {\n
-                    field_url = \'gadget_erp5_field_multilist.html\';\n
-                  } else if (renderered_field.type === \'CheckBoxField\') {\n
-                    field_url = \'gadget_erp5_field_checkbox.html\';\n
-                  } else if (renderered_field.type === \'StringField\') {\n
-                    field_url = \'gadget_erp5_field_string.html\';\n
-                  } else if (renderered_field.type === \'RelationStringField\') {\n
-                    field_url = \'gadget_erp5_field_relationstring.html\';\n
-                  } else if (renderered_field.type === \'TextAreaField\') {\n
-                    field_url = \'gadget_erp5_field_textarea.html\';\n
-                  } else if (renderered_field.type === \'DateTimeField\') {\n
-                    field_url = \'gadget_erp5_field_datetime.html\';\n
-                  } else if (renderered_field.type === \'FloatField\') {\n
-                    field_url = \'gadget_erp5_field_float.html\';\n
-                  } else if (renderered_field.type === \'IntegerField\') {\n
-                    field_url = \'gadget_erp5_field_integer.html\';\n
-                  } else if (renderered_field.type === \'ListBox\') {\n
-                    field_url = \'gadget_erp5_field_listbox.html\';\n
-                  } else if (renderered_field.type === \'EditorField\') {\n
-                    field_url = \'gadget_erp5_field_textarea.html\';\n
-                    // field_url = \'gadget_codemirror.html\';\n
-                    // sandbox = \'iframe\';\n
-                  } else if (renderered_field.type === \'GadgetField\') {\n
-                    field_url = \'gadget_erp5_field_gadget.html\';\n
-                  }\n
+\n
+                  field_url = getFieldTypeGadgetUrl(renderered_field.type);\n
 \n
                   return field_queue\n
                     .push(function () {\n
@@ -480,7 +492,7 @@
             </item>
             <item>
                 <key> <string>actor</string> </key>
-                <value> <string>xiaowu</string> </value>
+                <value> <string>romain</string> </value>
             </item>
             <item>
                 <key> <string>comment</string> </key>
@@ -494,7 +506,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>940.60735.27223.48179</string> </value>
+                <value> <string>943.18226.40997.54510</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -512,8 +524,8 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1423755151.34</float>
-                        <string>UTC</string>
+                        <float>1432653451.85</float>
+                        <string>GMT</string>
                       </tuple>
                     </state>
                   </object>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.xml

@@ -118,7 +118,10 @@
     /////////////////////////////////////////////////////////////////\n
     // Init local properties\n
     .ready(function (g) {\n
-      g.props = {};\n
+      g.props = {\n
+        cell_gadget_list: [],\n
+        listbox_uid_dict: {}\n
+      };\n
     })\n
 \n
     // Assign the element to a variable\n
@@ -137,6 +140,7 @@
     .declareAcquiredMethod("translateHtml", "translateHtml")\n
     .declareAcquiredMethod("whoWantToDisplayThis", "whoWantToDisplayThis")\n
     .declareAcquiredMethod("pleasePublishMyState", "pleasePublishMyState")\n
+    .declareAcquiredMethod("getFieldTypeGadgetUrl", "getFieldTypeGadgetUrl")\n
     //////////////////////////////////////////////\n
     // initialize the gadget content\n
     //////////////////////////////////////////////\n
@@ -263,27 +267,60 @@
           th,\n
           a,\n
           result = result_list[0],\n
-          tmp_url;\n
+          tmp_url,\n
+          value,\n
+          promise_list = [],\n
+          uid_value,\n
+          uid_value_dict = {};\n
 \n
-        dataset = result;\n
+        function renderSubCell(element, sub_field_json) {\n
+          return gadget.getFieldTypeGadgetUrl(sub_field_json.type)\n
+            .push(function (gadget_url) {\n
+              return gadget.declareGadget(gadget_url, {\n
+                element: element\n
+              });\n
+            })\n
+            .push(function (cell_gadget) {\n
+              gadget.props.cell_gadget_list.push(cell_gadget);\n
+              sub_field_json.editable = sub_field_json.editable && field_json.editable; // XXX \n
+              return cell_gadget.render({field_json: sub_field_json});\n
+            });\n
+        }\n
 \n
+        dataset = result;\n
         for (i = 0; i < counter; i += 1) {\n
           tr = document.createElement("tr");\n
           tmp_url = result_list[i + 1];\n
 \n
           for (j = 0; j < field_json.column_list.length; j += 1) {\n
             th = document.createElement("th");\n
-            a = document.createElement("a");\n
-            a.href = tmp_url;\n
-            a.className = "ui-link";\n
-            a.textContent = (result.data.rows[i]\n
-                .value[field_json.column_list[j][0]] || "");\n
-            th.appendChild(a);\n
+            value = result.data.rows[i].value[field_json.column_list[j][0]] || "";\n
+            if (value.type === undefined) {\n
+              a = document.createElement("a");\n
+              a.href = tmp_url;\n
+              a.className = "ui-link";\n
+              a.textContent = value;\n
+              th.appendChild(a);\n
+            } else {\n
+              if (gadget.props.listbox_uid_dict.key === undefined) {\n
+                gadget.props.listbox_uid_dict.key = result.data.rows[i].value["listbox_uid:list"].key;\n
+                gadget.props.listbox_uid_dict.value = [result.data.rows[i].value["listbox_uid:list"].value];\n
+                uid_value_dict[result.data.rows[i].value["listbox_uid:list"].value] = null;\n
+              } else {\n
+                uid_value = result.data.rows[i].value["listbox_uid:list"].value;\n
+                if (!uid_value_dict.hasOwnProperty(uid_value)) {\n
+                  uid_value_dict[uid_value] = null;\n
+                  gadget.props.listbox_uid_dict.value.push(uid_value);\n
+                }\n
+              }\n
+\n
+              promise_list.push(renderSubCell(th, value));\n
+            }\n
             tr.appendChild(th);\n
           }\n
           tbody.appendChild(tr);\n
         }\n
-\n
+        return RSVP.all(promise_list);\n
       }).push(function () {\n
         var prev_param = {},\n
           next_param = {};\n
@@ -372,19 +409,56 @@
         // NOTE: for passing translations, temp must contain a table\n
         temp_table.appendChild(fragment);\n
         temp.appendChild(temp_table);\n
-        return gadget.translateHtml(temp.innerHTML);\n
+        table.appendChild(temp.querySelector("tbody"));\n
+        return gadget.translateHtml(temp.querySelector("tfoot").innerHTML);\n
       })\n
         .push(function (my_translated_html) {\n
-          var new_body,\n
-            new_foot,\n
-            temp = document.createElement("div");\n
+          var temp = document.createElement("tfoot");\n
           temp.innerHTML = my_translated_html;\n
-          new_body = temp.querySelector("tbody");\n
-          new_foot = temp.querySelector("tfoot");\n
-          table.appendChild(new_body);\n
-          table.appendChild(new_foot);\n
-          return gadget;\n
+          table.appendChild(temp);\n
         });\n
+    })\n
+\n
+\n
+    .declareMethod("getContent", function () {\n
+      var form_gadget = this,\n
+        k,\n
+        field_gadget,\n
+        count = form_gadget.props.cell_gadget_list.length,\n
+        data = {},\n
+        queue = new RSVP.Queue();\n
+\n
+      function extendData(field_data) {\n
+        var key;\n
+        for (key in field_data) {\n
+          if (field_data.hasOwnProperty(key)) {\n
+            data[key] = field_data[key];\n
+          }\n
+        }\n
+      }\n
+\n
+      for (k = 0; k < count; k += 1) {\n
+        field_gadget = form_gadget.props.cell_gadget_list[k];\n
+        // XXX Hack until better defined\n
+        if (field_gadget.getContent !== undefined) {\n
+          queue\n
+            .push(field_gadget.getContent.bind(field_gadget))\n
+            .push(extendData);\n
+        }\n
+      }\n
+      return queue\n
+        .push(function () {\n
+          data[form_gadget.props.listbox_uid_dict.key] = form_gadget.props.listbox_uid_dict.value;\n
+          return data;\n
+        });\n
+    })\n
+\n
+    .allowPublicAcquisition("notifyInvalid", function () {\n
+      return;\n
+    })\n
+\n
+    .allowPublicAcquisition("notifyValid", function () {\n
+      return;\n
     });\n
 \n
 }(window, document, rJS, URI, RSVP, UriTemplate));
@@ -524,7 +598,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>941.55789.57588.57941</string> </value>
+                <value> <string>943.18213.25268.27562</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -542,7 +616,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1427276913.09</float>
+                        <float>1432652509.88</float>
                         <string>GMT</string>
                       </tuple>
                     </state>