@xuda.io/runtime-bundle 1.0.793 → 1.0.794

package/js/xuda-runtime-slim.min.es.js

@@ -9749,168 +9749,168 @@ func.UI.screen.refresh_screen = async function (SESSION_ID, fields_changed_arr,
   }
 };
 
-func.UI.screen.refresh_screen_old = async function (SESSION_ID, fields_changed_arr, datasource_changed, fields_changed_datasource) {
-  // check the main program
-  if (fields_changed_datasource) {
-    const _session = SESSION_OBJ[SESSION_ID];
-    const _ds = _session.DS_GLB[fields_changed_datasource];
-    const prog_doc = await func.utils.DOCS_OBJ.get(SESSION_ID, _ds.prog_id);
-    const progDataSource_str = JSON.stringify(prog_doc.progDataSource);
-    for (const field_id of fields_changed_arr || []) {
-    }
-  }
-
-  const panels_obj = await func.UI.utils.get_panels_wrapper_from_dom(SESSION_ID, $(SESSION_OBJ[SESSION_ID].root_element), false);
+// func.UI.screen.refresh_screen_old = async function (SESSION_ID, fields_changed_arr, datasource_changed, fields_changed_datasource) {
+//   // check the main program
+//   if (fields_changed_datasource) {
+//     const _session = SESSION_OBJ[SESSION_ID];
+//     const _ds = _session.DS_GLB[fields_changed_datasource];
+//     const prog_doc = await func.utils.DOCS_OBJ.get(SESSION_ID, _ds.prog_id);
+//     const progDataSource_str = JSON.stringify(prog_doc.progDataSource);
+//     for (const field_id of fields_changed_arr || []) {
+//     }
+//   }
 
-  for await (const [parent_element_ui_id, panel_val] of Object.entries(panels_obj)) {
-    const progDataSource_str = JSON.stringify(panel_val.prog_doc.progDataSource);
+//   const panels_obj = await func.UI.utils.get_panels_wrapper_from_dom(SESSION_ID, $(SESSION_OBJ[SESSION_ID].root_element), false);
 
-    var found, refresh_reason, refresh_details;
-    if (fields_changed_arr) {
-      if (fields_changed_datasource && panel_val._ds.dsSession <= Number(fields_changed_datasource)) {
-        continue;
-      }
-      for (const field_id of fields_changed_arr) {
-        // get panel attributes
-        const _attributes = panel_val?.panelXuAttributes || {};
+//   for await (const [parent_element_ui_id, panel_val] of Object.entries(panels_obj)) {
+//     const progDataSource_str = JSON.stringify(panel_val.prog_doc.progDataSource);
 
-        // detect if program changed
-        found = _attributes['xu-exp:program']?.includes('@' + field_id);
-
-        if (found) {
-          refresh_reason = `program ${_attributes['xu-exp:program']} ${field_id} changed `;
-          refresh_details = _attributes;
-          break;
-        }
+//     var found, refresh_reason, refresh_details;
+//     if (fields_changed_arr) {
+//       if (fields_changed_datasource && panel_val._ds.dsSession <= Number(fields_changed_datasource)) {
+//         continue;
+//       }
+//       for (const field_id of fields_changed_arr) {
+//         // get panel attributes
+//         const _attributes = panel_val?.panelXuAttributes || {};
 
-        // _attributes holds also info of parameters in code_in: @code
-        // search field changed in panel call send parameters exp
-        for (const [attr, value] of Object.entries(_attributes)) {
-          const pattern = /xu-exp:(\w+)/;
-          const match = attr.match(pattern);
+//         // detect if program changed
+//         found = _attributes['xu-exp:program']?.includes('@' + field_id);
 
-          if (!match) {
-            // continue if attribute is not expression
-            continue;
-          }
-          // code_in
-          const parameter_in_field_id = match?.[1];
-          // @code
-          if (value.includes(field_id)) {
-            // search parameter in field in the target program's progDataSource
-            found = progDataSource_str?.includes('@' + parameter_in_field_id);
+//         if (found) {
+//           refresh_reason = `program ${_attributes['xu-exp:program']} ${field_id} changed `;
+//           refresh_details = _attributes;
+//           break;
+//         }
 
-            if (found) {
-              refresh_reason = `field ${field_id} in progDataSource parameter_in changed`;
-              refresh_details = panel_val?.prog_doc?.progDataSource;
+//         // _attributes holds also info of parameters in code_in: @code
+//         // search field changed in panel call send parameters exp
+//         for (const [attr, value] of Object.entries(_attributes)) {
+//           const pattern = /xu-exp:(\w+)/;
+//           const match = attr.match(pattern);
 
-              break;
-            }
+//           if (!match) {
+//             // continue if attribute is not expression
+//             continue;
+//           }
+//           // code_in
+//           const parameter_in_field_id = match?.[1];
+//           // @code
+//           if (value.includes(field_id)) {
+//             // search parameter in field in the target program's progDataSource
+//             found = progDataSource_str?.includes('@' + parameter_in_field_id);
+
+//             if (found) {
+//               refresh_reason = `field ${field_id} in progDataSource parameter_in changed`;
+//               refresh_details = panel_val?.prog_doc?.progDataSource;
+
+//               break;
+//             }
 
-            // found = find_field_in_progUi(prog_doc.progUi, parameter_in_field_id, 'xu-for');
-            found = func.UI.find_field_in_progUi_attributes(panel_val.prog_doc.progUi, parameter_in_field_id, 'xu-for').length;
+//             // found = find_field_in_progUi(prog_doc.progUi, parameter_in_field_id, 'xu-for');
+//             found = func.UI.find_field_in_progUi_attributes(panel_val.prog_doc.progUi, parameter_in_field_id, 'xu-for').length;
 
-            if (found) {
-              refresh_reason = `field ${field_id} in progUi xu-for parameter_in changed`;
-              refresh_details = found;
+//             if (found) {
+//               refresh_reason = `field ${field_id} in progUi xu-for parameter_in changed`;
+//               refresh_details = found;
 
-              break;
-            }
-          }
-        }
+//               break;
+//             }
+//           }
+//         }
 
-        if (found) break;
+//         if (found) break;
 
-        // search field changed in the target program's progDataSource  // @code
-        found = progDataSource_str?.includes('@' + field_id);
-        if (found) {
-          refresh_reason = `field ${field_id} in progDataSource changed`;
-          refresh_details = panel_val?.prog_doc?.progDataSource;
+//         // search field changed in the target program's progDataSource  // @code
+//         found = progDataSource_str?.includes('@' + field_id);
+//         if (found) {
+//           refresh_reason = `field ${field_id} in progDataSource changed`;
+//           refresh_details = panel_val?.prog_doc?.progDataSource;
 
-          break;
-        }
+//           break;
+//         }
 
-        found = func.UI.find_field_in_progUi_attributes(panel_val.prog_doc.progUi, field_id, 'xu-for').length;
-        if (found) {
-          refresh_reason = `field ${field_id} in progUi xu-for changed`;
-          refresh_details = found;
+//         found = func.UI.find_field_in_progUi_attributes(panel_val.prog_doc.progUi, field_id, 'xu-for').length;
+//         if (found) {
+//           refresh_reason = `field ${field_id} in progUi xu-for changed`;
+//           refresh_details = found;
 
-          break;
-        }
+//           break;
+//         }
 
-        if (found) {
-          break;
-        }
-      }
-    }
+//         if (found) {
+//           break;
+//         }
+//       }
+//     }
 
-    if (datasource_changed) {
-      if (panel_val._ds.dsSession == datasource_changed) {
-        refresh_reason = `panel datasource ${datasource_changed} changed`;
-        refresh_details = '';
+//     if (datasource_changed) {
+//       if (panel_val._ds.dsSession == datasource_changed) {
+//         refresh_reason = `panel datasource ${datasource_changed} changed`;
+//         refresh_details = '';
 
-        found = true;
-      }
-    }
-    if (found) {
-      const _session = SESSION_OBJ[SESSION_ID];
-      if (_session.engine_mode === 'live_preview') {
-        console.info('========= refresh info ==============');
-        console.info('reason:', refresh_reason);
-        console.info('details:', refresh_details);
-        console.info('panel:', panel_val);
-        console.info('=====================================');
-      }
-      const $div_elm = panel_val.$panel_div;
-      const wrapper_data = $div_elm.data();
+//         found = true;
+//       }
+//     }
+//     if (found) {
+//       const _session = SESSION_OBJ[SESSION_ID];
+//       if (_session.engine_mode === 'live_preview') {
+//         console.info('========= refresh info ==============');
+//         console.info('reason:', refresh_reason);
+//         console.info('details:', refresh_details);
+//         console.info('panel:', panel_val);
+//         console.info('=====================================');
+//       }
+//       const $div_elm = panel_val.$panel_div;
+//       const wrapper_data = $div_elm.data();
 
-      if (_.isEmpty(wrapper_data)) continue;
+//       if (_.isEmpty(wrapper_data)) continue;
 
-      try {
-        const ts = Date.now();
-        // remove old panel content
-        $.each(panel_val.ids, async function (key, val) {
-          $("[xu-ui-id='" + val + "']")
-            .attr('xu-ui-id', val + ts)
-            .removeData();
-        });
+//       try {
+//         const ts = Date.now();
+//         // remove old panel content
+//         $.each(panel_val.ids, async function (key, val) {
+//           $("[xu-ui-id='" + val + "']")
+//             .attr('xu-ui-id', val + ts)
+//             .removeData();
+//         });
 
-        let refreshed_ds;
-        // check if ds exist and deleted by garbage collector
+//         let refreshed_ds;
+//         // check if ds exist and deleted by garbage collector
 
-        if (_session.DS_GLB[panel_val._ds.dsSession]) {
-          refreshed_ds = panel_val._ds.dsSession;
-        }
-        for await (const item of wrapper_data.xuData.node_org.children) {
-          if (item.tagName !== 'xu-panel') continue;
+//         if (_session.DS_GLB[panel_val._ds.dsSession]) {
+//           refreshed_ds = panel_val._ds.dsSession;
+//         }
+//         for await (const item of wrapper_data.xuData.node_org.children) {
+//           if (item.tagName !== 'xu-panel') continue;
 
-          const new_$div = await func.UI.screen.render_ui_tree(
-            SESSION_ID,
-            $div_elm, // the wrapper
-            _.cloneDeep(item), // _.cloneDeep(wrapper_data.xuData.node_org.children[0]), // the xu-panel node
-            {},
-            wrapper_data.xuData.paramsP, // the wrapper params
-            null,
-            null,
-            wrapper_data.xuData.key, // the wrapper key
-            refreshed_ds, // the refreshed_ds
-            wrapper_data.xuData.parent_node, // the wrapper parent node
-            null,
-            wrapper_data.xuData.$root_container, // the wrapper root container
-          );
-        }
+//           const new_$div = await func.UI.screen.render_ui_tree(
+//             SESSION_ID,
+//             $div_elm, // the wrapper
+//             _.cloneDeep(item), // _.cloneDeep(wrapper_data.xuData.node_org.children[0]), // the xu-panel node
+//             {},
+//             wrapper_data.xuData.paramsP, // the wrapper params
+//             null,
+//             null,
+//             wrapper_data.xuData.key, // the wrapper key
+//             refreshed_ds, // the refreshed_ds
+//             wrapper_data.xuData.parent_node, // the wrapper parent node
+//             null,
+//             wrapper_data.xuData.$root_container, // the wrapper root container
+//           );
+//         }
 
-        // remove old panel content
-        $.each(panel_val.ids, async function (key, val) {
-          $("[xu-ui-id='" + val + ts + "']").remove();
-        });
-      } catch (error) {
-        debugger;
-      }
-      // continue;
-    }
-  }
-};
+//         // remove old panel content
+//         $.each(panel_val.ids, async function (key, val) {
+//           $("[xu-ui-id='" + val + ts + "']").remove();
+//         });
+//       } catch (error) {
+//         debugger;
+//       }
+//       // continue;
+//     }
+//   }
+// };
 
 const get_params_obj_new = async function (SESSION_ID, prog_id, nodeP, dsSession) {
   const _prog = await func.utils.VIEWS_OBJ.get(SESSION_ID, prog_id);
@@ -11599,7 +11599,7 @@ func.UI.screen.render_ui_tree = async function (SESSION_ID, $container, nodeP, p
 
   var is_mobile = glb.MOBILE_ARR.includes(paramsP.screenInfo.properties?.menuType) ? true : false;
 
-  var get_element_info = function () {
+  const get_element_info = function () {
     var ret = {};
     let currentRecordId = _ds?.currentRecordId || '';
 
@@ -12406,7 +12406,40 @@ func.UI.screen.render_ui_tree = async function (SESSION_ID, $container, nodeP, p
     if (ret.abort || nodeP.tagName === 'svg') return await done();
     // check if iterator made to prevent children render
 
-    const ret_iterate_child = await iterate_child($div, nodeP, parent_infoP, null, $root_container);
+    const observer = new IntersectionObserver(
+      function (entries) {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            // Element is in viewport - trigger custom event
+            $(entry.target).trigger('inViewport');
+
+            // Optional: stop observing once triggered
+            observer.unobserve(entry.target);
+          }
+        });
+      },
+      {
+        threshold: 0.1, // Trigger when 10% of element is visible
+      },
+    );
+
+    const render_child = async function () {
+      await iterate_child($div, nodeP, parent_infoP, null, $root_container);
+    };
+
+    if (nodeP.id === 'node-265db6bf-67a0-4e15-9cbf-f0c48f56241e') {
+      $div.on('inViewport', function () {
+        console.log('Element is in viewport!');
+        render_child();
+        // $(this).addClass('visible');
+        // Your custom code here
+      });
+      observer.observe($div[0]);
+    } else {
+      await render_child();
+    }
+
+    // const ret_iterate_child = await iterate_child($div, nodeP, parent_infoP, null, $root_container);
     return await done();
   };