erp5_web_renderjs_ui: set graphic type in the URL and render it automatically if exists

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.js

@@ -520,7 +520,8 @@
               }
             }
           }
-
+          return gadget.getUrlParameter("graphic_type")
+            .push(function (graphic_type) {
               return gadget.changeState({
                 key: field_json.key,
                 title: field_json.title,
@@ -568,13 +569,17 @@
                 // Force line calculation in any case
                 render_timestamp: new Date().getTime(),
                 allDocs_result: undefined,
-            default_value: field_json.default,
+                default_value: field_json["default"],
 
                 // No error message
                 has_error: false,
                 show_line_selector: false,
                 show_select_action: false,
-            show_clipboard_action: false
+                show_clipboard_action: false,
+
+                // graphic
+                graphic_type: graphic_type
+              });
             });
         });
       return queue;
@@ -1186,14 +1191,16 @@
                   );
                 }
                 domsugar(gadget.element.querySelector(".graphic_section"), [
-                  domsugar("select", sub_element_list),
+                  domsugar("select", {
+                    "name": "GraphicSelect",
+                    "value": gadget.state.graphic_type
+                  }, sub_element_list),
                   domsugar("div", {"class": "graphic_area"})
                 ]);
               });
           });
-      } else if (modification_dict.hasOwnProperty("graphic_type") &&
-                 modification_dict.graphic_type !== "") {
-        return result_queue
+        if (gadget.state.graphic_type && gadget.state.graphic_type !== "") {
+          result_queue
             .push(function () {
               return gadget.declareGadget('gadget_graphic.html', {
                 scope: 'gadget_graphic',
@@ -1210,7 +1217,7 @@
                 domain;
 
               for (i = 0; i < column_list_json.length; i += 1) {
-              if (column_list_json[i][0] === modification_dict.graphic_type) {
+                if (column_list_json[i][0] === gadget.state.graphic_type) {
                   group_by = column_list_json[i][0];
                   group_by_title = column_list_json[i][1];
                   return graphic_gadget.render({
@@ -1231,7 +1238,6 @@
                   });
                 }
               }
-
               for (domain_id in domain_dict) {
                 if (domain_dict.hasOwnProperty(domain_id)) {
                   domain = {
@@ -1253,7 +1259,7 @@
                 }
               }
               for (i = 0; i < domain_list.length; i += 1) {
-              if (domain_list[i].domain_id === modification_dict.graphic_type) {
+                if (domain_list[i].domain_id === gadget.state.graphic_type) {
                   return graphic_gadget.render({
                     group_by: group_by,
                     query_by: {},
@@ -1277,6 +1283,7 @@
               }
             });
           }
+        }
       return result_queue;
     })
 
@@ -1458,6 +1465,21 @@
           return result;
         });
     }, {mutex: 'changestate'})
+    .onEvent('change', function change(evt) {
+      var gadget = this,
+        graphic_select = gadget.element.querySelector(
+          'select[name="GraphicSelect"]'
+        );
+
+      if (evt.target == graphic_select) {
+        return gadget.redirect({
+          command: 'change',
+          options: {
+            graphic_type: evt.target.value
+          }
+        });
+      }
+    })
     .onEvent('click', function click(evt) {
       // For some reason, Zelenium can click even if button has the disabled
       // attribute. So, it is needed for now to manually checks
@@ -1521,13 +1543,6 @@
         });
       }
 
-      if (evt.target.type === "select-one") {
-        // XXX Move it to onEvent > "change" probably
-        return gadget.changeState({
-          "graphic_type": evt.target.value
-        });
-      }
-
       if ((evt.target.type === 'button') &&
           ((evt.target.name === 'SelectAction') || (evt.target.name === 'ClipboardAction'))) {
         evt.preventDefault();

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.xml

@@ -240,7 +240,7 @@
                   </item>
                   <item>
                       <key> <string>serial</string> </key>
-                      <value> <string>994.25329.16170.62481</string> </value>
+                      <value> <string>997.9256.52516.32426</string> </value>
                   </item>
                   <item>
                       <key> <string>state</string> </key>
@@ -258,7 +258,7 @@
                           </tuple>
                           <state>
                             <tuple>
-                              <float>1630077204.4</float>
+                              <float>1640736604.19</float>
                               <string>UTC</string>
                             </tuple>
                           </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_graphic_js.js

@@ -179,8 +179,13 @@
           "select_list": select_list
         };
       }
-      return gadget.getUrlParameter('extended_search')
-        .push(function (extended_search) {
+      return new RSVP.Queue(RSVP.all([
+          gadget.getUrlParameter('extended_search'),
+          gadget.getUrlParameter('graphic_select_id')
+        ]))
+        .push(function (result_list) {
+          var extended_search = result_list[0],
+              graphic_select_id = result_list[1];
           if (extended_search) {
             jio_query_list.push(Query.parseStringToObject(extended_search));
           }

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_graphic_js.xml

@@ -246,7 +246,7 @@
                   </item>
                   <item>
                       <key> <string>serial</string> </key>
-                      <value> <string>997.7486.55612.53862</string> </value>
+                      <value> <string>997.9171.49361.29986</string> </value>
                   </item>
                   <item>
                       <key> <string>state</string> </key>
@@ -264,7 +264,7 @@
                           </tuple>
                           <state>
                             <tuple>
-                              <float>1640630356.79</float>
+                              <float>1640731509.5</float>
                               <string>UTC</string>
                             </tuple>
                           </state>