SIP up here/Adding a status to the WEB UI

[RandyBryant]

Didn't take much time at all.  Since these pictures (attached) I have connected all 8 zones to the Pi and have an interval program running.  Using a v1 Pi Zero W.

I want to add a rain detected status on the home screen (I don't think it currently exists).  I am not finding the related code for changing the WEB UI.  Just need nudge in the right direction.  Or a short doc on the WEB interface design/modification path.

Retired Software Engineer playing with RPis!

[dan]

Take a look at the proto plugin in the plugins folder. It has an option for displaying messages in the home page footer.

Dan

[RandyBryant]

Thanks Dan!

I also discovered today that is I turn on the Rain Sensor option, the main page has a rain sensed status already!

[RandyBryant]

Did you use a UI designer of some sort for the WEB pages? Also looks like you have all of the text stored in some sort of data base allowing multiple language support. Would love to see some sort of design document for the whole system.

Thanks for all the work!

[dan]

The UI is basically hand coded.
SIP is built on web.py, a Python framework for web sites:
https://webpy.org/

The web pages are in the templates folder. Web.py has a tempating engine called Templator which allows including Python code in the page definitions so that data from the core program can be dynamically included in the pages.
https://webpy.org/docs/0.3/tutorial#templating

When a page is requested by the browser the templating engine processes the included Python code and renders the page.

The language strings are in a compressed format in a file named sip_messages.mo for each language under the i18n folder. In the page templates the strings that need to be translated are enclosed in a _() function call. For example" _('Manual Mode'). When a language is selected from the options page the strings get replaced from the corresponding sip_messages.mo file. This is handled in i18n.py using the gettext module.
https://docs.python.org/3/library/gettext.html