====== GUI ======

===== Remote ssh based GUI =====
<code> export DISPLAY=:0.0 </code>

===== Remote browser based GUI =====
==== Overview of html - mqtt - php - sh implemened GUI ====

{{ ::browserbasedgui.jpg?400 |}}
==== simple HTML gui ====

color codes (see [[https://www.rapidtables.com/web/color/html-color-codes.html]]:

  * green: rgb(127,255,0)
  * yellow: rgb(255,255,0)
  * cyan: rgb(0,255,255)
  * skyblue: rgb(135,206,235)
  * blue: rgb(0,0,255)
  * violet: rgb(238,130,238)
  * white: rgb(255,255,255)
  * lightgray: rgb(211,211,211)
  * black: rgb(0,0,0)
  * red: rgb(255,0,0)

==== plotly based HTML gui ====

Idea: creating images on pi and display these images as html files remotely

Use lighttpd as minimal webserver on pi


<code>sudo apt-get install lighttpd 
sudo pip install plotly
</code>

Check status
 
<code> sudo systemctl status lighttpd </code>

Set access rights

<code> 
sudo groupadd www-data
sudo usermod -G www-data -a pi
sudo chown -R www-data:www-data /var/www/html
sudo chmod -R 775 /var/www/html
 </code>

restart service

<code> sudo service lighttpd force-reload </code>

move html file to be displayed into /var/www/html/

remote browser access html file by:

<code> http://192.168.1.xx/<filename> </code>

==== PHP installieren ====
Only use Python3

<code> 
sudo apt-get install php7.3-cgi php7.3
sudo lighty-enable-mod fastcgi-php
sudo service lighttpd force-reload

</code>

php- files in /var/www/html ablegen

==== mqtt Mosquitto installieren ====
Only use Python3

<code> sudo apt-get install mosquitto mosquitto-clients -y
</code>
==== paho installieren ====
Paho is needed to call a shell procedure from python.
Only availabe under python 3

<code> pip3 install paho-mqtt </code>

==== sensormqtt.py autostart ====

/etc/rc.local
<code>nohup /home/pi/browserGUI/sensormqtt.py &
</code>


==== Basic code ====
<code>
import plotly.graph_objects as go
import random

def nextvalue():
    return (random.randint(10,104))

def displayserver():
    while True:
        fig = go.Figure(go.Indicator(
            mode = "gauge+number",
            value = nextvalue(),
            domain = {'x': [0, 1], 'y': [0, 1]},
            title = {'text': "Temperatur"}))

        fig.write_html('/var/www/html/labor.html', auto_open=True)
#fig.show()

#
# Main
# 
if __name__== '__main__':
    try:
        displayserver()
    except KeyboardInterrupt:
        exit()
</code>

==== shell script lesen DB ====
getlatestvalue.sh

<code>
sqlite3 /home/pi/sensor/sensor.db <<END_SQL
.timeout 2000
select ' ',* from latestvalueLabor_A;
END_SQL

</code>

==== hand over values to thermometer.py ====
<code>
python3 thermometer.py `getlatestvalue.sh`
</code>