BlueOnyx 5211R: Update on new GUI Development
We've worked around the clock on the integration of the new GUI for BlueOnyx for the last month. Here is the latest news on that.
The development of the new Elmer theme based GUI for BlueOnyx 5211R (and later on: BlueOnyx 5210R) has progressed nicely in the last month. By now all GUI elements have been ported over to use the new HTML, CSS and jQuery or JavaScripts to render correctly. Some challenges were encountered and had to be overcome, though: The old GUI's PHP Class to render buttons was a bit of a train wreck and seriously limited. As a result may GUI pages that needed some of the more intricate buttons had them hard coded in HTML in the GUI pages themselves, bypassing the PHP Button class.
Naturally: When switching the GUI theme and then using a different CSS, these buttons would either not show, or look quite odd. To overcome this the Button Class was rewritten entirely from scratch for Elmer in order to be able to render every kind of button we need. This still needs to be backported to the old Adminica GUI to render buttons for that as well, but in the respective styles needed for Adminica.
As a net result of that we had to go through all GUI pages one by one and find all buttons hard coded in HTML and replace them with proper PHP methods using the Button class. Another complication is the different modal usage of Adminca and Elmer. We use these modals for confirmations, such as asking a user if he really wants to log out, or really wants to delete a Vsite, a User, an SQL database and such.
Lastly, a certain GUI page (the one for Email Statistics) was already barely working in 5211R's Adminica GUI due to being horribly complicated and having to present a metric F-ton of data in the correct places. Which was even complicated further by the fact that Adminica can only display a singe DataTable per page correctly, so regular tables were used for the rest.
I spent six days working on that page alone, adding the ability to use multiple DataTables correctly and converting the static HTML tables into getScrollList() calls to render DataTables. Naturally, also bar-graphs, pie charts and diagrams had to be adapted and implemented via the Elmer methods of initializing those.
All in all things are coming together and the new GUI looks really sweet and modern, loads fast and provides usability improvements due to better handling, searchable pull-downs, working Date- and TimePickers and relying more on PHP Class driven means and methods and fewer (almost none) static HTML code within GUI pages themselves.
The i18n Class to localize the GUI as well as many backend mechanisms have also been improved or rewritten from scratch with the intent to speed things up, to streamline code or to use caching where appropriate. The latter is especially noticeable in our used method to validate input. The number of I/O calls and network calls for that purpose has drastically shrunk by 95% for all but password strength checks. And even the password strength check got a lot of fat and redundant calls removed.
The video below should give a nice overview over the current state of affairs:
As you might have noticed: "Software Updates" / "BlueOnyx Shop" showed the pulldown menus for the shop categories and products in the old style. That's because that page is among the few that still need to be converted to use the new Elmer related UI elements.
However, due to the holidays and an upcoming (much needed) vacation we're unable to wrap this up in 2023 and some of the work will need to be finished in early January 2024. Shortly afterwards the Shop PKGs with GUI pages will also be overhauled to be able render GUI pages in both the old Adminica style as well as in the new Elmer style. So a tentative release date of the new GUI for BlueOnyx 5211R will be sometime in January 2024.
In the meantime: We wish you all a Merry Christmas and a Happy New Year!
|
← Return