Authentic is Webmin/Usermin theme based on Bootstrap and Font Awesome that you just longed to get.

Webmin
201

I have just been experimenting with Theme Extensions option which you discussed above (overlays/extensions).

I am using latest Authentic Theme 13.10 on Webmin 1.760

First clicking on Theme Extensions button and entering page I created a basic test styles.css file in
/etc/webmin/authentic-theme/styles.css

But after saving file and restarting Webmin this extended style has no effect.

I tried viewing in two different browsers Chrome and Firefox.

And when I view html source I do not see any injected link to styles.css.

I did explore inside authentic-lib.cgi but I don’t see where custom js/css is injected.
Nearest reference is found at line 900 … "Theme config directory is `/etc/webmin/authentic-theme’ "

How can I troubleshoot this since I need to inject custom js/css into html head?

DL

202

That I’m not sure why it’s not working. It should and you must see the result on the right frame right away and after page refresh left menu also take the styles.

I just think you need to try to put !important afterwards.

When you open source, do you see a file styles.css somewhere?

Try putting to styles:

html, body, .container:not(.form-signin-banner), .container-fluid, .loader-container, .input-group-addon { background-color: red !important }

After you click save, it should imitatively change?

203

I tried your suggested css … incidentally it was difficult to read the example css code in your video.

After saving changes the background in right frame immediately turns to red.
Seems that adding !important is … important.

And I see styles.css saved in

/usr/share/webmin/authentic-theme/unauthenticated/css/styles.css

But on saving I see this error message in right frame …

Failed to open /etc/usermin/authentic-theme/styles.css for writing: No such file or directory.

So I manually created this file.

…

My suggestion for building advanced theme extension is to change the Theme Extensions editor to allow a list of multiple links to be injected into head instead of just two js/css files.

i.e. inject the equivalent of $htmlhead used in older themes.

Or just add a new dropdown option to edit $htmlhead raw file?

204

Thanks, I have fixed this bug that resulted in Failed to open … for writing: No such file or directory .

I will not be able to add support for multiple files, as this will add extra complexity and will result in more request to the server. In case you want to do it, you could use @import for CSS files and $.getScript( “your_script.js”) for JS.

However I would recommend to keep all in those two files, which is more than sufficient, I believe.

P.S. I will try to make left menu also reload, when editing custom styles/scritps.

205

I understand your reluctance to add complexity.

In fact I have just realised this workaround.
It is to use dynamic js and css with jQuery.

I’ll run some experiments.

206

Alright, good luck!

207

I’m not sure that placing this thread under “News” sub-forum is the best place for posting development suggestions. Would github site better for posting suggestions?

However, here are some more suggestions.

[1] Optimising js

Viewing the source in Authentic Theme shows a large number of scripts loaded under /usr/share/webmin/authentic-theme/unauthenticated/js/

And custom scripts might be added to this list.

These head scripts/links require multiple requests to the server or externally.

It seems to me that this theme is a candidate for using require.js.

http://requirejs.org/docs/api.html#jsfiles

Same approach can be used with aggregating css files … e.g. Bower.

[2] Caching views

I posted another question elsewhere in forum on responsiveness of page loading (e.g.) Perl Modules where it takes 3-4 minutes per page refresh.

Could Authentic Theme offer caching of page views across all modules so that the time for page refreshing page is better optimised? This would require DataTables to be cached rather than loading DataTable each time the page is refreshed.

I’m looking for better responsiveness since I’m using Webmin in a local development environment.

It might be helpful to build some stats of page loading performance.

208

Just today, in 4-6 hours, I’m releasing new big update - Authentic Theme v14. It will have optimized JS and CSS. All files will be bundled and large packages will not be loaded on default but by request.

In case you want to speed up your experience while using Webmin, go to Webmin->Webmin Configuration->Web Server Options and setting correlated option to Use pre-compressed file and compress dynamically. It made my theme work 3 times faster than before!! ) (at lest version 14b).

Yes, it takes a long time to Rebuild Perl Modules List. It has nothing to do with the theme and should be done server-side. However it takes only 15 seconds for me to reload. You should propose this idea to Jamie or Joe. Theme must not do that. Cache is managed either by browser or by server.

209

Dear friends, you are welcome to try new major release of Authentic Theme 14.

Changelog:
Version 14.00 (July 21, 2015)

  • Improved page spinners to use no JavaScript, adjusted theme colors and font-weights
  • Improved code and performance by combining styles/scripts in a single package and making other custom optimizations
  • Added new date-picker to replace old JavaScript pop-ups
  • Added ability, when editing custom styles/scripts or uploading custom logos, to update page content dynamically, without reload, to immediately display final outlook
  • Added overall loading progress at the top of the page (like YouTube and Medium). Can be enabled/disabled in theme settings
  • Added CodeMirror modes bundle, to be loadable on demand to support different file highlights in Filemin (File manager for Webmin) written in Perl (without use of Java))
  • Added locales to TinyMCE
  • Updated CodeMirror and TinyMCE
  • Fixed theme HTML output to be more validator friendly
  • Fixed missing status label on managed system in Cloudmin (thanks to Jamie Cameron for reporting it)
  • Fixed JavaScript history step back button in Webmin
  • Fixed CodeMirror problem in ConfigServer Security & Firewall module #199
  • Fixed issues with Server Index module #182, #201
  • Fixed an issue in MySQL/PostgreSQL Database Server modules, when trying to view/edit table rows #200
  • Fixed an issue to make theme properly run when using no_frame_options=1 option #204
  • Fixed dozens of other bugs
210

First observations …

I see that multiple js scripts have been consolidated into authentic.min.js.

I’m trying Authentic theme in two browsers …

Chromium Web Browser
Firefox 39.0

===========================================

In theme settings I have enabled (as default)

Enable page progress loader on top of the screen

But all I see (in both browsers) is a loading red bar (just a few pixels high) at top of page. And also red padding to the left of selected Webmin sub-menu selected page.

Is this the progress loader?

===========================================

When I’m editing files in Filemin with this new version of Authentic I have no syntax colour highlighting.

Where does codemirror kick in with Filemin file editing?

I had been contemplating piping file editor output to an external code editor (as an extension to Filemin) but CodeMirror seems it might meet this requirement. But I see no syntax colouring as yet in Edit File in Filemin.

I just don’t understand how CodeMirror works with Authentic/Filemin. Please clarify.

DL

211

Not sure what you ask in the first question? This is the additional loader. Some people prefer to have overall loader on top. Some prefer regular on the right content page. Some will keep both.

CodeMirror is disabled now in Filemin by Authentic Theme as to give more freedom to Filemin devs to manipulate on it. We discussed it and they are agreed. Expect new version of Filemin, where they manage file-highlights better.

212

re: my first question … I just didn’t expect to see a progress loader a few pixels high … I thought it might be more prominent. But that feature is not too important for me.

I’ve tested further and I do see syntax colouring outside Filemin (e.g. in PHP Configuration).

I just don’t see it in Filemin file editing nor line numbers … but you have clarified why this is the case.
I guess I’m caught between two modules under development.

I’ll now turn to Filemin to see what I can tweak in their UI.

Thanks for your latest version 14.0.

DL

213

Hello Ilia,

Just wanted to say that the System Statistics is not working anymore for me since I upgraded to vs. 14.0, the graphs are all blank; is this a confirmed bug? Reverting back to Framed theme as this is too important to ignore…

214

Any word on this bug, is it confirmed?

215

Yes, it’s confirmed and will be fix in couple of days, along with other bugs. Sorry for the delay.

216

Version 14.01 is released.

Changelog:

  • Added CodeMirror automatic mode (highlight syntax) detection for all file-editors
  • Added support for Filemin file-editor and improved general support for this module
  • Fixed multiple bugs #205, #206, #207, #209

    • Please upgrade.

    217

    virtual-server::list_system_info failed : Undefined subroutine &net::active_interfaces called at /usr/share/webmin/virtual-server/virtual-server-lib-funcs.pl line 3617.

    218

    Does it happen only on System Information Page?

    219

    Please upgrade to version 14.02!

    I would like to address this question to Jamie and Joe as they are obviously more experienced in Perl than I am and most likely anybody else around, and definitely saw more strange/buggy things.

    The following didn’t fail on my 3 different machines (Perl v5.20.2) but did on the other (with older versions of Perl v5.10.1 and v5.14.2). I would also expect this to fail in any other programming language.

    I misplaced the last parenthesis:

    index( $ENV{‘REQUEST_URI’}, ‘/virtual-server/history.cgi’ != -1 )

    I should have (and it’s fixed in version 14.02):

    index( $ENV{‘REQUEST_URI’}, ‘/virtual-server/history.cgi’ ) != -1

    Can anyone please explain why the first one passed compilation on my Perl? How is this possible?

    220

    I get this also on 1 server, yet another server, same distro is fine? Deb7