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>
{% endif %}
<tr>
<td class="icon">
<span class="outer_dot">
<p class="inner_icon">{{'A' if zone.autoMode else 'M'}}</p>
</span>
<td>
<label class="toggle">
<input type="checkbox" {{ "checked" if zone.autoMode }} onchange="switchZoneMode(this.checked, {{ zone.number }})">
<span class="slider"></span>
<span class="labels" data-on="A" data-off="H"></span>
</label>
</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>

9
Webserver/Templates/header.html
View File

@ -3,7 +3,9 @@
<head>
<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/switch.css') }}">
<meta charset="UTF-8">
<meta http-equiv="refresh" content="5" >
<script>
function executeAction(command, index, value) {
@ -13,6 +15,9 @@
var value = document.getElementById(valueID).value * valueFactor;
executeAction(command, index, value);
}
function switchZoneMode(autoMode, zone) {
executeAction('switch_zone_mode' ,zone, (autoMode ? 'automatic' : 'manual'))
}
</script>
</head>
<body>
@ -29,11 +34,11 @@
</ul>
</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">
<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">

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

@ -45,7 +45,8 @@ nav ul li a:hover{
background-color: darkblue;
padding-top: 0px;
padding-bottom: 0px;
margin: 0px;
margin: 0px;
text-decoration: none;
}
.heading h1{

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

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