Bootstrap skin a.k.a "fuzzy-archer" v4.0 preview available

[michael.k...@gmx.at]

Hi all,

there is a new version of the Bootstrap skin in the pipeline. Last year this skin has been modernized and updated with interactive gauges and charts, also, using MQTT live updates were made available.

Preview: https://www.kainzbauer.net/weather/Rif/en/

The version is still under development, to install it anyway, download the "lang" branch here:

https://github.com/brewster76/fuzzy-archer/archive/refs/heads/lang.zip

wee_extension --install lang.zip

Although I've installed it on several test environments, I cannot guarantee everything will work flawlessly by now.

If you encounter problems, please file any issues here: https://github.com/brewster76/fuzzy-archer/issues and let me know in this thread. 

Version 4 now has few new features so far, but in another way it is completely new:

New in v4.0:

• Complete and thorough overhaul of the skin, many breaking changes. It is recommended to start over with a fresh install
• This skin used to consist of three skins, now reduced to one
• Localization is now done the WeeWX way (hopefully Tom doesn't disagree on this one)
• Less and easier configuration
• Many customization can now be done by configuration only, no more need to touch the templates
• Day/night background in Live Charts (needs pyephem installed)
• Bug fixes and other enhancements

However, there are still some things to do, help is needed doing the translations for:

• traditional chinese
• czech
• spanish
• finnish (there isn't even a language file stub yet)
• french
• greek
• italian
• korean (there isn't even a language file stub yet)
• dutch
• thai

Let me know, if you try you manage to run it without any issues also:)

[michael.k...@gmx.at]

Another week over, I've fixed several bugs, added missing functionality and did some little enhancements on the styles. I've put everything in the master branch by now, so if you want to updated, the feature branch is now obsolete. By the way, thanks for the feedback and issues on github. Also thanks to Tom, who is always precise in his feedback, helps a lot.

Still: there is help needed for skin specific translations.

[gary....@gmail.com]

I see no configuration instructions.

Surely there must be some if this uses MQTT for live updates.

[michael.k...@gmx.at]

Hi Gary,

in some of the latest commits I've put some instructions and example in the shipped configs, yet they are neither complete nor very exhaustive. Maybe we can improve this.

First, where to start from?

The basics: for having live data shown in the charts and gauges, you need:

• A data source (in most cases this your weather station, but it is not limited to this unique source)
• A MQTT Broker for publishing data from the source and subscribing to the topics you publish
• Enabling the data source to emit data using MQTT. With weewx, install https://github.com/matthewwall/weewx-mqtt and get it running
  • Bind to loop packets for have data available more or less instantly:
    [StdRestful]
        [[MQTT]]
            server_url = mqtt://broker.hivemq.com:1883/
            topic = weather_{any_distinctive_string_that_is_valid_for_topics}
            unit_system = METRIC # or whatever you prefer but note, this will have an impact on the "payload_key" for charts and gauges
            binding = loop
    
• The MQTT Broker must be publicly available for viewing live data over the internet, to make it easy for now, the assumption is, you use a public MQTT without needing any credentials
• You need to set up the MQTT client for the frontend in skin.conf:
  • [JSONGenerator]
        ...
        [[MQTT]]
            [[[connections]]]
                [[[[public_mqtt]]]]
                    broker_connection = ws://broker.hivemq.com:8000/mqtt # wss (encrypted) websocket connection
                        [[[[[topics]]]]]
                            [[[[[[weather_{any_distinctive_string_that_is_valid_for_topics}/loop]]]]]]
                                type = JSON

That should be a working, basic setup, if I didn't miss anything. Note: on a https:// linke you need to set up an encrypted broker connection also (wss://) or it won't work.

For the payload_key of each reading:

This is depending of the data source. If you set up everything as described above, for showing "outTemp" it will be outTemp_F. If you use METRIC or METRICWX it will be outTemp_C:

From skin.conf:

[LiveGauges]
    [[outTemp]]
        payload_key = outTemp_F                # outTemp_C if target_unit 'METRICWX', or 'METRIC'
        minvalue = 0
        maxvalue = 100
        splitnumber = 10                       # choose a splitnumber fitting minvalue and maxvalue: e.g.: 0/100: 10, for -20/40: 6
        lineColor = '#428bca', '#b44242'       # colors are RGBa
        lineColorUntil = 32, maxvalue          # color from start of gauge to value, change color of gauge ring to show important marks: 32 is freezing point
        decimals = 1                           # decimals for current value in gauge
        #heatMapEnabled = false                # disabled heatmap for gauge, default true
        #animation = False                     # default true

Things will get a bit more complicated if you use a broker that requires user accounts and login credentials.

[gary....@gmail.com]

Thanks for that.

See your github discussions.