Hello there, time for my daily problem thread !
So I’m replacing an outdated bag of worms that was supposed to mimic the behavior of an accordion, with the built-in accordion component.
I’m generating the items with a script, because it’s a quite complex accordion:
- Header is a view, with a flex repeater in it
- Body also has a flex repeater, instances depend on data from the header
- Each instance in the body’s flex repeater needs to compute a value
- The header needs to show an aggregation of those computed values
- There are bindings on quite a few things in those views
It actually works quite well in a browser, but when I try opening the view containing the accordion in designer, it freezes, with the occasional sign of life, but it’s functionally dead. I’ve seen it reach 100% CPU usage for a solid minute, probably more, and even crash after running out of memory.
Now, the problems stop if I disable some of the bindings (in the view that is repeated in each body), which allows me to open the component, work on it, then close it and re-enable the bindings, but that’s not an ideal solution…
Here’s how I do it, in case (and in the hope that) someone catches something that could be done in a better way.
The items property is bound to a query.
The returned json is then sent through this script transform:
row_list = []
for entry in value:
tcu_params = system.dataset.toPyDataSet(
system.db.runNamedQuery("Tcu/Details", {
'row': entry['row'],
'zone': entry['zone_num']
})
)
body_params = []
total_alarms = 0
for tcu in tcu_params:
alarms = len(system.alarm.queryStatus(path="*" + tcu[1] + "*", state=["activeAcked"]))
total_alarms += alarms
body_params.append({
'position': tcu[0],
'tcu_name': tcu[1],
'tcu_num_row': tcu[2],
'tcu_num_col': tcu[3],
'tcu_id': tcu[4],
'failures': alarms
})
header_params = {
'failures': total_fails,
'row': entry['row'],
'zone': entry['zone_num']
}
row_list.append({
'expanded': False,
'header': {
'toggle': {
'enabled': True,
'expandedIcon': {
'path': "material/keyboard_arrow_down"
},
'collapsedIcon': {
'path': "material/keyboard_arrow_right"
}
},
'content': {
'type': "view",
'useDefaultViewWidth': False,
'useDefaultViewHeight': False,
'viewPath': header_view_path,
'viewParams': header_params
},
'height': "30px",
'style': {
'color': "#808080",
'backgroundColor': "#E4EAF0"
}
},
'body': {
'viewPath': body_view_path,
'viewParams': {'instances_data': body_params},
'useDefaultViewHeight': False,
'useDefaultViewWidth': False,
'height': "auto",
'style': {
'margin': 0,
'padding-top': 5,
'padding-bottom': 5
}
}
})
return row_list
I’m particularly interested in improving the alarm counting thing, which I copy-pasted from the previous version of the component, which was made by someone else. I’m quite new to ignition and I haven’t figured out that queryStatus function just yet.
I’m open to any suggestion, even and especially if you can think of a better approach to the whole thing, maybe binding the body’s view flex repeater instances separately (which is imo better design, but also makes a few things difficult). Any help I can get !
edit: A screenshot might help clear things up: