Roman_Schenk
/
Bewaesserungsanlage
1
0
Fork 0
Code Issues 2 Pull Requests Projects Releases Wiki Activity

implemented Toggle Switch

This commit is contained in:
schrom01 2022-08-23 17:18:51 +02:00
parent 6fda077f9b
commit b5d1637e0f
4 changed files with 20 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
Webserver/Templates/dashboard.html
View File

@ -114,10 +114,12 @@
</tr> </tr>
{% endif %} {% endif %}
<tr> <tr>
<td class="icon"> <td>
<span class="outer_dot"> <label class="toggle">
<p class="inner_icon">{{'A' if zone.autoMode else 'M'}}</p> <input type="checkbox" {{ "checked" if zone.autoMode }} onchange="switchZoneMode(this.checked, {{ zone.number }})">
</span> <span class="slider"></span>
<span class="labels" data-on="A" data-off="H"></span>
</label>
</td> </td>
<td class="property">{{ translater.getTranslation("operating mode") }}:</td> <td class="property">{{ translater.getTranslation("operating mode") }}:</td>
<td class="value">{{translater.getTranslation("automatic mode") if zone.autoMode else translater.getTranslation("manual mode")}}</td> <td class="value">{{translater.getTranslation("automatic mode") if zone.autoMode else translater.getTranslation("manual mode")}}</td>

9
Webserver/Templates/header.html
View File

@ -3,7 +3,9 @@
<head> <head>
<link rel="stylesheet" href="{{ url_for('static', filename='Styles/header.css') }}"> <link rel="stylesheet" href="{{ url_for('static', filename='Styles/header.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='Styles/main.css') }}"> <link rel="stylesheet" href="{{ url_for('static', filename='Styles/main.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='Styles/switch.css') }}">
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="refresh" content="5" >
<script> <script>
function executeAction(command, index, value) { function executeAction(command, index, value) {
@ -13,6 +15,9 @@
var value = document.getElementById(valueID).value * valueFactor; var value = document.getElementById(valueID).value * valueFactor;
executeAction(command, index, value); executeAction(command, index, value);
} }
function switchZoneMode(autoMode, zone) {
executeAction('switch_zone_mode' ,zone, (autoMode ? 'automatic' : 'manual'))
}
</script> </script>
</head> </head>
<body> <body>
@ -29,11 +34,11 @@
</ul> </ul>
</nav> </nav>
<div class="heading"> <a class="heading" href="{{ url_for('startPage')}}">
<img src="{{ url_for('static', filename='img/header/wassertropfen.png') }}" alt="" class="title-img"> <img src="{{ url_for('static', filename='img/header/wassertropfen.png') }}" alt="" class="title-img">
<h1>{{ translater.getTranslation("Irrigation") }}-<br>{{ translater.getTranslation("system") }}</h1> <h1>{{ translater.getTranslation("Irrigation") }}-<br>{{ translater.getTranslation("system") }}</h1>
</div> </a>
<img src="{{ url_for('static', filename='img/header/blumenbeet.jpg') }}" alt="" class="header-img"> <img src="{{ url_for('static', filename='img/header/blumenbeet.jpg') }}" alt="" class="header-img">

1
Webserver/static/Styles/header.css
View File

@ -46,6 +46,7 @@ nav ul li a:hover{
padding-top: 0px; padding-top: 0px;
padding-bottom: 0px; padding-bottom: 0px;
margin: 0px; margin: 0px;
text-decoration: none;
} }
.heading h1{ .heading h1{

5
Webserver/static/Styles/main.css
View File

@ -10,3 +10,8 @@ h2{
text-transform: uppercase; text-transform: uppercase;
margin-bottom: 2em; margin-bottom: 2em;
} }
h3{
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
text-transform: uppercase;
}