[erp5_web_renderjs_ui] Label, string fields: reduce number of async code

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_label_field_js.js

@@ -74,18 +74,13 @@
       label_text: '',
       error_text: '',
       label: true,  // the label element is already present in the HTML template
-      css_class: ''
-    })
-
-    .ready(function () {
-      return this.changeState({
-        container_element: this.element.querySelector('div'),  // matches the closest div
-        label_element: this.element.querySelector('label')
-      });
+      css_class: '',
+      first_call: false
     })
 
     .declareMethod('render', function (options) {
       var state_dict = {
+        first_call: true,
         label_text: options.field_json.title || '',
         label: options.label,
         field_url: getFieldTypeGadgetUrl(options.field_type),
@@ -107,7 +102,16 @@
       var gadget = this,
         span,
         css_class,
-        i;
+        i,
+        queue,
+        new_div;
+
+      if (modification_dict.hasOwnProperty('first_call')) {
+        gadget.props = {
+          container_element: gadget.element.querySelector('div'),
+          label_element: gadget.element.querySelector('label')
+        };
+      }
 
       if (gadget.state.hidden && !modification_dict.error_text) {
         this.element.hidden = true;
@@ -116,9 +120,9 @@
       }
 
       if (modification_dict.hasOwnProperty('label_text')) {
-        this.state.label_element.textContent = this.state.label_text;
+        this.props.label_element.textContent = this.state.label_text;
       }
-      this.state.label_element.setAttribute('for', gadget.state.scope);
+      this.props.label_element.setAttribute('for', gadget.state.scope);
 
       if (modification_dict.hasOwnProperty('css_class') && this.state.css_class) {
         css_class = this.state.css_class.split(' ');
@@ -129,7 +133,7 @@
 
       if (modification_dict.hasOwnProperty('error_text')) {
         // first remove old errors
-        span = this.state.container_element.lastElementChild;
+        span = this.props.container_element.lastElementChild;
         if ((span !== null) && (span.tagName.toLowerCase() !== 'span')) {
           span = null;
         }
@@ -138,42 +142,42 @@
           if (span === null) {
             span = document.createElement('span');
             span.textContent = this.state.error_text;
-            this.state.container_element.appendChild(span);
+            this.props.container_element.appendChild(span);
           } else {
             span.textContent = this.state.error_text;
           }
         } else if (span !== null) {
-          this.state.container_element.removeChild(span);
+          this.props.container_element.removeChild(span);
         }
       }
 
       // Remove/add label_element from DOM
       if (modification_dict.hasOwnProperty('label')) {
         if (this.state.label === true) {
-          this.state.container_element.insertBefore(this.state.label_element, this.state.container_element.firstChild);
+          this.props.container_element.insertBefore(this.props.label_element, this.props.container_element.firstChild);
         } else {
-          this.state.container_element.removeChild(this.state.label_element);
+          this.props.container_element.removeChild(this.props.label_element);
         }
       }
 
       if (modification_dict.hasOwnProperty('options')) {
         if (this.state.field_url) {
-          return new RSVP.Queue()
-            .push(function () {
-              if (modification_dict.hasOwnProperty('field_url')) {
-                return gadget.declareGadget(gadget.state.field_url, {
-                  scope: SCOPE
-                })
-                  .push(function (field_gadget) {
-                    gadget.state.container_element.removeChild(
-                      gadget.state.container_element.querySelector('div')
-                    );
-                    gadget.state.container_element.appendChild(field_gadget.element);
-                    return field_gadget;
-                  });
-              }
-              return gadget.getDeclaredGadget(SCOPE);
-            })
+          if (modification_dict.hasOwnProperty('field_url')) {
+            //if (!modification_dict.hasOwnProperty('first_call')) {
+            gadget.props.container_element.removeChild(
+              gadget.props.container_element.querySelector('div')
+            );
+            //}
+            new_div = document.createElement('div');
+            gadget.props.container_element.appendChild(new_div);
+            queue = gadget.declareGadget(gadget.state.field_url, {
+              scope: SCOPE,
+              element: new_div
+            });
+          } else {
+            queue = gadget.getDeclaredGadget(SCOPE);
+          }
+          return queue
             .push(function (field_gadget) {
               return field_gadget.render(gadget.state.options);
             });
@@ -224,7 +228,7 @@
     })
 
     .declareJob('deferErrorTextRender', function (error_text) {
-      return this.changeState({error_text: error_text});
+      return this.changeState({first_call: true, error_text: error_text});
     });
 
 }(window, document, rJS, RSVP));
\ No newline at end of file

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_label_field_js.xml

@@ -230,7 +230,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>966.41667.10868.48810</string> </value>
+                <value> <string>967.36537.34665.7628</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -248,7 +248,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1523002550.46</float>
+                        <float>1526396024.69</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_stringfield_js.js

@@ -31,22 +31,20 @@
       var element = this.element,
         gadget = this,
         url,
-        result;
+        result,
+        new_div;
       if (modification_dict.hasOwnProperty('editable')) {
         if (gadget.state.editable) {
           url = 'gadget_html5_input.html';
         } else {
           url = 'gadget_html5_element.html';
         }
-        result = this.declareGadget(url, {scope: 'sub'})
-          .push(function (input) {
-            // Clear first to DOM, append after to reduce flickering/manip
-            while (element.firstChild) {
-              element.removeChild(element.firstChild);
-            }
-            element.appendChild(input.element);
-            return input;
-          });
+        while (element.firstChild) {
+          element.removeChild(element.firstChild);
+        }
+        new_div = document.createElement('div');
+        element.appendChild(new_div);
+        result = this.declareGadget(url, {scope: 'sub', element: new_div});
       } else {
         result = this.getDeclaredGadget('sub');
       }

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_stringfield_js.xml

@@ -230,7 +230,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>965.12118.35525.1655</string> </value>
+                <value> <string>965.41976.11439.18449</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -248,7 +248,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1517929158.68</float>
+                        <float>1526396915.47</float>
                         <string>UTC</string>
                       </tuple>
                     </state>