Implementation details. Text taken from LostConnection.jsx.
When connection is lost, a warning indicator will attach itself to a div with an id that starts with 'fireflyLostConnWarn'.
This means there can be more than one. However, if one is not detected, it will do nothing.
When constructing the div, a 'data-decor' attribute can be set to affect how the warning look.
<div id="fireflyLostConnWarn" data-decor="small" class="warning-div center"></div>
Currently, we support 'data-decor' of 'small', 'medium', and 'full' with 'medium' as the default.
small : 24x24 transparent icon with tooltips
medium : 48x48 transparent icon with tooltips
full : 48x48 transparent icon with the message visible
For conveniences, there are 3 defined styles to layout the fireflyLostConnWarn div:
warning-div right: horizontally right-align with a z-index of 300
warning-div left: horizontally left-align with a z-index of 300
warning-div center: horizontally center-align with a z-index of 300
See src/firefly/html/demo/ffapi-table-test.html for an example of multiple warning is different styles.
There is one on top center and 3 on the bottom. Search for div with id starting with 'fireflyLostConnWarn'.
Rick and Xiuqin think we could put Firefly logo in the popup message and make it possible to close it.