Esp32 Zeitschaltuhr Dual als Arduino Tab.
Zeitschaltuhr.ino
// ****************************************************************
// Sketch Esp32 Zeitschaltuhr Dual Modular(Tab)
// created: Jens Fleischer, 2018-12-23
// last mod: Jens Fleischer, 2020-03-27
// For more information visit: https://fipsok.de
// ****************************************************************
// Hardware: Esp32, Relais Modul o. Mosfet IRF3708 o. Fotek SSR-40 DA
// für Relais Modul
// GND an GND
// IN1 an T4 = GPIO13
// IN2 an T5 = GPIO12
// VCC an VIN -> je nach verwendeten Esp.. möglich
// Jumper JD-VCC VCC
// alternativ ext. 5V Netzteil verwenden
//
// für Mosfet IRF3708
// Source an GND
// Gate an T4 = GPIO13
// Gate an T5 = GPIO12
//
// für 3V Solid State Relais
// GND an GND
// SSR1 Input + an T4 = GPIO13
// SSR2 Input + an T5 = GPIO12
//
// Software: Esp32 Arduino Core 1.0.0 - 1.0.4
// Getestet auf: ESP32 NodeMCU-32s
/******************************************************************
Copyright (c) 2018 Jens Fleischer. All rights reserved.
This file is free software; you can redistribute it and/or
modify it under the terms of the GNU Lesser General Public
License as published by the Free Software Foundation; either
version 2.1 of the License, or (at your option) any later version.
This file is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
Lesser General Public License for more details.
*******************************************************************/
// Diese Version von Zeitschaltuhr Dual sollte als Tab eingebunden werden.
// #include <WebServer.h> muss im Haupttab aufgerufen werden
// Die Funktionalität des ESP32 Webservers ist erforderlich.
// Der Lokalzeit Tab ist zum ausführen der Zeitschaltuhr einzubinden.
// Die Funktion "setupTimerSwitch();" muss im Setup aufgerufen werden.
// Zum schalten muss die Funktion "dualTimerSwitch();" im loop(); aufgerufen werden.
/**************************************************************************************/
#include <Preferences.h>
Preferences preferences;
const auto aktiv = LOW; // LOW für LOW aktive Relais oder HIGH für HIGH aktive (zB. SSR, Mosfet) einstellen
const uint8_t relPin[] = {T4, T5}; // Pin für Relais einstellen
const auto count = 10;
char switchTime[count * 2][6];
uint8_t switchActive[count];
bool relState[] {!aktiv, !aktiv};
void setupTimerSwitch() {
preferences.begin("switchTime", false);
//preferences.clear(); preferences.end(); // einkommentieren um alle Daten zu löschen
for (auto pin : relPin) digitalWrite(pin, !aktiv), pinMode(pin, OUTPUT);
DEBUG_F("Relais Aktiv Status: %s\n", relState[0] ? "LOW" : "HIGH");
char buffer[3];
for (auto i = 0; i < count * 2; i++) {
itoa (i, buffer, 10);
preferences.getString(buffer, switchTime[i], sizeof(switchTime[i]));
}
preferences.getBytes("switchActive", switchActive, sizeof switchActive);
server.on("/timer", HTTP_POST, []() {
if (server.args() == 1) {
switchActive[server.argName(0).toInt() / 2] = server.arg(0).toInt();
}
if (server.hasArg("sz0")) {
for (auto i = 0; i < server.args(); i++) {
strcpy (switchTime[i], server.arg(i).c_str());
}
}
char buffer[3];
for (auto i = 0; i < count * 2; i++) {
itoa (i, buffer, 10);
preferences.putString(buffer, switchTime[i]);
}
preferences.putBytes("switchActive", switchActive, sizeof switchActive);
String temp = "[";
for (auto i = 0; i < count * 2; i++) {
if (temp != "[") temp += ',';
temp += (String)"\"" + switchTime[i] + "\"";
}
for (auto i = 0; i < count; i++) {
temp += (String)",\"" + switchActive[i] + "\"";
}
server.send(200, "application/json", temp + "]");
});
server.on("/timer", HTTP_GET, []() {
static char buf[9];
strftime (buf, sizeof(buf), "%T ", &tm);
if (server.hasArg("tog1")) relState[0] = !relState[0]; // Relais1 manuell schalten
if (server.hasArg("tog2")) relState[1] = !relState[1]; // Relais2 manuell schalten
server.send(200, "application/json", (String)"[\"" + buf + "\",\"" + (relState[0] ? aktiv : !aktiv) + "\",\"" + (relState[1] ? aktiv : !aktiv) + "\"]");
});
}
void dualTimerSwitch() {
static uint8_t lastmin {CHAR_MAX}, lastState[] = {aktiv, aktiv};
localTime();
if (tm.tm_min != lastmin) {
lastmin = tm.tm_min;
char buf[6];
snprintf(buf, sizeof(buf), "%.2d:%.2d", tm.tm_hour, tm.tm_min);
for (auto i = 0; i < count * 2; i++) {
if (i < count) {
if (switchActive[i / 2] && !strcmp(switchTime[i], buf)) i % 2 ? relState[0] = !aktiv : relState[0] = aktiv; // Relais1 nach Zeit schalten
}
else {
if (switchActive[i / 2] && !strcmp(switchTime[i], buf)) i % 2 ? relState[1] = !aktiv : relState[1] = aktiv; // Relais2 nach Zeit schalten
}
}
}
if (relState[0] != lastState[0] || relState[1] != lastState[1]) {
for (auto i = 0; i < 2; i++) {
lastState[i] = relState[i];
digitalWrite(relPin[i], relState[i]);
DEBUG_F("Relais %d %s\n", 1 + i, digitalRead(relPin[i]) == aktiv ? "an" : "aus");
}
}
}
Die Webseite zur Esp32 Dual Zeitschaltuhr.
zeitschaltuhr32.html
<!DOCTYPE HTML> <!-- For more information visit: https://fipsok.de -->
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="style32.css">
<title>Dual Zeitschaltuhr</title>
<style>
body {
color: #15dfdf;
}
div {
display: flex;
}
span {
padding: 0.5em;
}
#tog1,#tog2 {
padding: .7em 1.2em;
cursor: pointer;
}
time {
text-shadow: 2px 2px 2px black;
font-size: 1.3em;
font-weight: bold;
margin: auto;
}
input {
height: auto;
font-weight: bold;
}
.note:after {
content: "Schaltzeiten gespeichert";
color: #777;
}
form {
box-shadow: 5px 3px 10px #4e4d4d;
}
svg {
height: 4em;
}
#bu {
background-color: #333;
color: #33cccc;
border: outset #555;
}
.tab {
overflow: hidden;
}
.tab button {
background-color: #999;
color: #33cccc;
border: none;
margin-top: 0em;
transition: 0.8s;
border-top-right-radius: .5em;
border-top-left-radius: .5em;
}
.tab button:hover {
background-color: #666;
}
.tab button.active {
background-color: #333;
}
.tabcontent {
display: none;
padding: .5em .7em .5em .1em;
background-color: #333;
}
.tabcontent input {
background-color: inherit;
font-size: 3em;
color: inherit;
border: solid #555;
}
.tabcontent [name^=bu] {
width: 2em;
cursor: pointer;
}
.none {
color: #777;
}
@media only screen and (max-width: 600px) {
.tabcontent input,input {
font-size: 2em;
width: auto;
border: none;
}
.tab button,#bu,#tog1,#tog2 {
width: auto;
}
svg {
height: 3em;
}
}
</style>
<script>
document.addEventListener('DOMContentLoaded', () => {
dom(), renew();
document.querySelector('#bu').addEventListener('click', () => {
send(new FormData(document.querySelector('form')));
});
document.querySelector('#tab1').addEventListener('click', openTab);
document.querySelector('#tab2').addEventListener('click', openTab);
document.querySelector('#tog1').addEventListener('click', renew);
document.querySelector('#tog2').addEventListener('click', renew);
for (var i = 0; i < 19; i = i + 2) {
document.querySelector(`[name=bu${i}]`).addEventListener('click', active);
}
},send(), setInterval(renew, 1000));
function dom() {
var buf = '';
for (var i = 0; i < 0x14; i++) {
buf += `${i%2 ? `<span> -- </span>` : `<div id="ak${i}"><span name="bu${i}"></span>`}<input type="time" name="sz${i}" value="">${i%2 ? "</div>" : ""}`;
if (i == 9) {
document.querySelector('#ctab1').insertAdjacentHTML('beforeend', buf);
buf = '';
}
if (i == 19) document.querySelector('#ctab2').insertAdjacentHTML('beforeend', buf);
}
}
function active() {
let formData = new FormData();
formData.append(this.parentNode.id.substr(2, 4), this.textContent == 'ON' ? '0' : '1');
send(formData);
}
function send(arg) {
fetch('/timer', {
method: 'post',
body: arg
}).then(response => {
if(arg && arg.has('sz0')) {
var el = document.querySelector('p');
el.classList.add('note');
setTimeout(() => {
el.classList.remove('note');
}, 5000);
}
return response.json();
}).then(array => {
array.forEach(function (x, i) {
if (i < 20) document.querySelector(`[name=sz${i}]`).value = x;
if (i >= 20) {
document.querySelector(`[name=bu${(i-20)*2}]`).textContent = (x%2 ? 'ON' : 'OFF');
var el = document.getElementById(`ak${(i-20)*2}`);
x%2 ? el.classList.remove("none") : el.classList.add("none");
}
});
});
}
function openTab(event) {
var a = event.target.id.charAt(3)%2+1;
document.getElementById(`ctab${a}`).style.display = "none";
document.getElementById(`tab${a}`).classList.remove("active");
document.getElementById('c' + event.target.id).style.display = "block";
event.target.classList.add("active")
}
function renew(event) {
if (event) event = event.currentTarget.id;
fetch(`timer?${event}=`).then(response => {
return response.json();
}).then(array => {
document.querySelector('time').innerHTML = array[0];
for (var i = 1; i < array.length; i++) {
document.getElementById(`color${i}`).style.fill=array[i] == 0 ? '' : '#ff0';
document.getElementById(`on${i}`).style.visibility=array[i] == 0 ? 'hidden' : 'visible';
}
});
}
</script>
</head>
<body>
<h2>Zeitschaltuhr</h2>
<main>
<div class="tab">
<button class="button active" id="tab1">⏳ Relais 1</button>
<button class="button" id="tab2">⏳ Relais 2</button>
<time>00:00:00</time>
</div>
<form>
<div id="ctab1" class="tabcontent" style="display: block;">
</div>
<div id="ctab2" class="tabcontent">
</div>
</form>
</main>
<div>
<button class="button" id="bu">⏰ Speichern</button>
<div id="tog1">
R1
<svg viewBox="0 0 486 486">
<g id="color1">
<use xlink:href="#body"/>
<use id="on1" xlink:href="#beam"/>
</g>
</svg>
</div>
<div id="tog2">
R2
<svg viewBox="0 0 486 486">
<g id="color2">
<use xlink:href="#body"/>
<use id="on2" xlink:href="#beam"/>
</g>
</svg>
</div>
</div>
<p id="out"></p>
<svg style="display: none;">
<path id="body" d="m256.5 160.8c0-7.4-6-13.5-13.5-13.5-47.6 0-86.4 38.7-86.4 86.4 0 7.4 6 13.5 13.5 13.5 7.4 0 13.5-6 13.5-13.5 0-32.8 26.7-59.4 59.4-59.4 7.5 0 13.5-6 13.5-13.5zm106.2 72.5c0 32.3-12.8 61.6-33.6 83.1-15.8 16.4-26 37.3-29.4 59.6-1.5 9.6-9.8 16.7-19.6 16.7h-74.3c-9.7 0-18.1-7-19.5-16.6-3.5-22.3-13.8-43.5-29.6-59.8-20.4-21.2-33.1-50-33.4-81.7-0.7-66.6 52.3-120.5 118.9-121 66.5-0.5 120.5 53.3 120.5 119.7zm-64.3 191.4v14.2c0 11.3-8.3 20.7-19.1 22.3l-3.5 12.9c-1.9 7-8.2 11.9-15.5 11.9h-34.7c-7.3 0-13.6-4.9-15.5-11.9l-3.4-12.9c-10.9-1.7-19.2-11-19.2-22.4v-14.2c0-7.6 6.1-13.7 13.7-13.7h83.5c7.6 0.1 13.7 6.2 13.7 13.8z"/>
<path id="beam" d="m376.57 341.98c-5.3-5.3-13.8-5.3-19.1 0s-5.3 13.8 0 19.1l33.5 33.5c2.6 2.6 6.1 3.9 9.5 3.9s6.9-1.3 9.5-3.9c5.3-5.3 5.3-13.8 0-19.1zm-262.8-224.8c2.6 2.6 6.1 3.9 9.5 3.9s6.9-1.3 9.5-3.9c5.3-5.3 5.3-13.8 0-19.1l-33.5-33.5c-5.3-5.3-13.8-5.3-19.1 0s-5.3 13.8 0 19.1zm253.3 4c3.4 0 6.9-1.3 9.5-3.9l33.5-33.5c5.3-5.3 5.3-13.8 0-19.1s-13.8-5.3-19.1 0l-33.5 33.5c-5.3 5.3-5.3 13.8 0 19.1 2.7 2.6 6.1 3.9 9.6 3.9zm-253.3 220.8-33.5 33.5c-5.3 5.3-5.3 13.8 0 19.1 2.6 2.6 6.1 3.9 9.5 3.9s6.9-1.3 9.5-3.9l33.5-33.5c5.3-5.3 5.3-13.8 0-19.1-5.2-5.3-13.8-5.3-19 0zm351.1-125.9h-47.3c-7.4 0-13.5 6-13.5 13.5 0 7.4 6 13.5 13.5 13.5h47.3c7.4 0 13.5-6 13.5-13.5 0-7.4-6-13.5-13.5-13.5zm-378.6 13.5c0-7.4-6-13.5-13.5-13.5h-47.3c-7.4 0-13.5 6-13.5 13.5 0 7.4 6 13.5 13.5 13.5h47.3c7.5 0 13.5-6 13.5-13.5zm158.9-158.9c7.4 0 13.5-6 13.5-13.5v-47.3c0-7.4-6-13.5-13.5-13.5s-13.5 6-13.5 13.5v47.3c0 7.5 6.1 13.5 13.5 13.5z"/>
</svg>
</body>
</html>