[renderjs_ui] Allow passing `editable` into (embedded) form and let it change fields state

bt5/erp5_hal_json_style/SkinTemplateItem/portal_skins/erp5_hal_json_style/ERP5Document_getHateoas.py

@@ -473,6 +473,8 @@ def renderField(traversed_document, field, form_relative_url, value=None, meta_t
     }
     # renderForm mutates `result` therefor no return/assignment
     renderForm(formbox_context, embeded_form, result['_embedded']['_view'], key_prefix=key)
+    # fix editability which is hard-coded to 0 in `renderForm` implementation
+    result['_embedded']['_view']['form_id']['editable'] = field.get_value("editable")
   else:
     # All other fields are not implemented and we'll return only basic info about them
     result = {

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_field_formbox_js.js

-/*global window, rJS, RSVP, URI */
+/*global window, rJS, URI */
 /*jslint nomen: true, indent: 2, maxerr: 3 */
-(function (window, rJS, RSVP, URI) {
+/**
+ * FormBox displays embedded form in itself.
+ *
+ * There are two common CSS classes bound to the FormBox Field
+ * -  "horizontal_align_form_box" renders fields without labels in horizontal manner (useful for phone etc.)
+ * -  "invisible" despite its name should only hide label
+ *
+ */
+(function (window, rJS, URI) {
   "use strict";
 
   rJS(window)
     .setState({
-      subgadget_template: null
+      subgadget_template: undefined,
+      editable: undefined
     })
 
     .declareAcquiredMethod("jio_getAttachment", "jio_getAttachment")
@@ -27,7 +36,12 @@
           erp5_form: field_json._embedded
         };
 
-      if (gadget.state.subgadget_template === null || options.reset === true) {
+      // prefer editability from the global context (form)
+      if (options.editable !== undefined) {
+        new_state.editable = options.editable;
+      }
+
+      if (gadget.state.subgadget_template === undefined || options.reset === true) {
         // render subgadget only when there is none OR render is explicitely requested
         return this.declareGadget('gadget_erp5_page_form.html', {scope: 'sub'})
           .push(function (form_gadget) {
@@ -54,15 +68,10 @@
             },
           key: gadget.state.name,
           view: gadget.state.view,
-          jio_key: erp5_document_uri.segment(2)
+          jio_key: erp5_document_uri.segment(2),
+          editable: gadget.state.editable
         };
 
-      // XXX: can be uncommented - dunno if it is needed
-      // if `editable` changes - force reloading of the gadget
-      // if (modification_dict.hasOwnProperty('editable')) {
-      //   return gadget.render({reset: true});
-      // }
-
       // do not preserve objects in the state
       delete gadget.state.erp5_form;
 
@@ -92,4 +101,4 @@
       return true;
     });
 
-}(window, rJS, RSVP, URI));
\ No newline at end of file
+}(window, rJS, URI));
\ No newline at end of file

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_form_js.js

 /*jslint nomen: true, indent: 2, maxerr: 3 */
 /*global window, document, rJS, RSVP*/
+
 (function (window, document, rJS, RSVP) {
   "use strict";
 
+  /** Form is one of a complicated gadget!
+   *
+   * Editability - the form overrides editability of its fields. Editability is
+   *               hard-coded changed either in Page Templates or soft-coded
+   *               changed in FormBox gadget which renders form as a subgadget
+  **/
 
   function getFieldTypeGadgetUrl(type) {
     var field_url = 'gadget_erp5_field_readonly.html';
@@ -75,9 +82,10 @@
       suboptions.field_json = rendered_field;
       suboptions.field_json.view = form_gadget.state.view;
 
-      if (group[0] !== "bottom") {
-        suboptions.label = true;
-      }
+    // if the whole form is non-editable than every field has to be non-editable
+    if (form_gadget.state.editable === 0) {
+      suboptions.field_json.editable = 0;
+    }
 
       return new RSVP.Queue()
         .push(function () {
@@ -179,7 +187,9 @@
         form_definition: options.form_definition,
         jio_key: options.jio_key,
         hash: hash,
-        view: options.view
+        view: options.view,
+        editable: options.editable,
+        title: options.title
       });
     })
 

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_page_form_js.js

@@ -77,11 +77,11 @@
           erp5_form: undefined,
           url: undefined
         };
-      
+
       if (options.hasOwnProperty('erp5_document')) {
         // if we get erp5 document during rendering then no need to fetch it
         new_state.erp5_document = options.erp5_document;
-        // thank you options
+        // remove reference to erp5_document from options (and new_state.options)
         delete options.erp5_document;
       } else {
         promise_queue
@@ -103,6 +103,13 @@
           });
       }
 
+      // options.editable differs when it comes from the erp5_launcher of FormBox - try to unify it here
+      if (options.editable === "true" || options.editable === true || options.editable === "1" || options.editable === 1) {
+        options.editable = 1;
+      } else {
+        options.editable = 0;
+      }
+
       return promise_queue
         .push(function () {
           var uri = new URI(new_state.erp5_document._embedded._view._links.form_definition.href);
@@ -111,11 +118,11 @@
         .push(function (erp5_form) {
           var url = "gadget_erp5_pt_" + erp5_form.pt;
           // XXX Hardcoded specific behaviour for form_view
-          if ((options.editable !== undefined) && (erp5_form.pt === "form_view")) {
+          if ((options.editable === 1) && (erp5_form.pt === "form_view")) {
             url += "_editable";
           }
           url += ".html";
-          
+
           new_state.url = url;
           new_state.erp5_form = JSON.stringify(erp5_form);
 
@@ -151,8 +158,8 @@
           sub_options.form_definition = erp5_form;
           sub_options.view = options.view;
           sub_options.action_view = options.action_view;
-          sub_options.jio_key = options.jio_key;
-          sub_options.editable = options.editable;
+          sub_options.jio_key = options.jio_key; // jIO identifier of currently rendered ERP5 document
+          sub_options.editable = options.editable; // form decides on editability of its fields
 
           return page_template_gadget.render(sub_options);
         })

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_page_form_js.xml

@@ -230,7 +230,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>961.11846.36682.48964</string> </value>
+                <value> <string>961.16455.47614.10018</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -248,7 +248,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1501840583.61</float>
+                        <float>1502198575.84</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_dialog_js.js

@@ -173,6 +173,7 @@
           form_options.form_definition = form_gadget.state.form_definition;
           form_options.view = form_gadget.state.view;
           form_options.jio_key = form_gadget.state.jio_key;
+          form_options.editable = form_gadget.state.editable;
 
           return erp5_form.render(form_options);
         })

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_dialog_js.xml

@@ -230,7 +230,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>961.11852.40121.13414</string> </value>
+                <value> <string>961.16461.13159.33399</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -248,7 +248,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1501840477.03</float>
+                        <float>1502116641.07</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_list_js.js

@@ -60,6 +60,7 @@
           form_options.form_definition = form_gadget.state.form_definition;
           form_options.view = form_gadget.state.view;
           form_options.jio_key = form_gadget.state.jio_key;
+          form_options.editable = form_gadget.state.editable;
 
           // XXX Hardcoded for listbox's hide functionality
           form_options.form_definition.hide_enabled = true;

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_list_js.xml

@@ -230,7 +230,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>961.11851.43795.41164</string> </value>
+                <value> <string>961.16133.2066.40123</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -248,7 +248,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1501840485.34</float>
+                        <float>1502114387.31</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_view_editable_js.js

@@ -70,7 +70,8 @@
           form_options.erp5_document = form_gadget.state.erp5_document;
           form_options.form_definition = form_gadget.state.form_definition;
           form_options.view = form_gadget.state.view;
-          form_options.jio_key = form_gadget.state.jio_key
+          form_options.jio_key = form_gadget.state.jio_key;
+          form_options.editable = 1;
 
           return erp5_form.render(form_options);
         })

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_view_editable_js.xml

@@ -230,7 +230,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>961.11851.10359.5666</string> </value>
+                <value> <string>961.16418.20259.26675</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -248,7 +248,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1501840494.81</float>
+                        <float>1502116591.57</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_view_embedded.js.js

@@ -51,6 +51,7 @@
           form_options.form_definition = form_gadget.state.form_definition;
           form_options.view = form_gadget.state.view;
           form_options.name = form_gadget.state.name;
+          form_options.editable = form_gadget.state.editable;
 
           return erp5_form.render(form_options);
         })

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_view_embedded.js.xml

@@ -230,7 +230,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>961.11856.9454.43844</string> </value>
+                <value> <string>961.16458.28534.25173</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -248,7 +248,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1501840453.36</float>
+                        <float>1502116475.56</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_view_js.js

@@ -3,6 +3,20 @@
 (function (window, rJS, RSVP, calculatePageTitle) {
   "use strict";
 
+  function isGoodNonEditableField(field) {
+    // ListBox and FormBox should always get a chance to render
+    if (field.type === "ListBox") {return true; }
+    if (field.type === "FormBox") {return true; }
+    // hidden fields should not be obviously rendered
+    if (field.hidden === 1) {return false; }
+    // field without default
+    if (!field.default) {return false; }
+    if (field.default.length === 0) {return false; }
+    if (field.default.length === 1 && (!field.default[0])) {return false; }
+
+    return true;
+  }
+
   rJS(window)
     /////////////////////////////////////////////////////////////////
     // Acquired methods
@@ -48,18 +62,13 @@
         .push(function (erp5_form) {
           var form_options = gadget.state.erp5_form,
             rendered_form = gadget.state.erp5_document._embedded._view,
-            rendered_field,
             key;
 
-          // Remove all empty fields, and mark all others as non editable
+          // Remove all empty or otherwise bad non-editable fields
           for (key in rendered_form) {
             if (rendered_form.hasOwnProperty(key) && (key[0] !== "_")) {
-              rendered_field = rendered_form[key];
-              if ((rendered_field.type !== "ListBox") && ((!rendered_field.default) || (rendered_field.hidden === 1) || (rendered_field.default.length === 0)
-                   || (rendered_field.default.length === 1 && (!rendered_field.default[0])))) {
+              if (!isGoodNonEditableField(rendered_form[key])) {
                 delete rendered_form[key];
-              } else {
-                rendered_field.editable = 0;
               }
             }
           }
@@ -68,6 +77,7 @@
           form_options.form_definition = gadget.state.form_definition;
           form_options.view = gadget.state.view;
           form_options.jio_key = gadget.state.jio_key;
+          form_options.editable = 0;
 
           return erp5_form.render(form_options);
         })

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_view_js.xml

@@ -230,7 +230,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>961.11849.54154.45550</string> </value>
+                <value> <string>961.16419.13605.17578</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -248,7 +248,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1501840503.44</float>
+                        <float>1502116554.64</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_report_view_js.js

@@ -32,7 +32,8 @@
           }
         };
         return form_gadget.render({erp5_document: erp5_document,
-                                   form_definition: form_definition});
+                                   form_definition: form_definition,
+                                   editable: 0});
       });
   }
 
@@ -66,7 +67,7 @@
       return this.changeState({
         erp5_document: options.erp5_document,
         form_definition: options.form_definition,
-        form_gadget_url: form_gadget_url
+        form_gadget_url: form_gadget_url,
       });
     })
     .onStateChange(function (modification_dict) {
@@ -90,7 +91,8 @@
           form_gadget = result;
           return form_gadget.render({
             erp5_document: gadget.state.erp5_document,
-            form_definition: gadget.state.form_definition
+            form_definition: gadget.state.form_definition,
+            editable: 0
           });
         })
 

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_report_view_js.xml

@@ -230,7 +230,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>954.25919.63902.23893</string> </value>
+                <value> <string>961.16421.12334.2201</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -248,7 +248,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1476194238.38</float>
+                        <float>1502116518.17</float>
                         <string>UTC</string>
                       </tuple>
                     </state>