Hallo Ich möchte bei einer Internetseite Meldungen mit verschiedenen Schriftfarben darstellen, z.B die Meldung „kein Fehler“ in grüner Schriftfarbe, die Meldung „das ist zu kalt“ in roter Schriftfarbe. Trotz Recherche im Internet habe ich keine brauchbare Lösung/ Hinweis auf eine Lösung gefunden. Es wäre toll, wenn mir jemand helfen könnte. Ich habe das Programm angehängt, die anzuzeigenden Meldungen werden in der Funktion "String readDSTemperatureERR()" gebildet. Das Programm stammt von https://RandomNerdTutorials.com; genaue Angabe siehe *.ino. Das Programm liest den Temperaturwert mittels DS18B20 ein, er wird ausgewertet und mittels WEMOS D1 alle 5 sek an eine Internetseite geschickt. Diese zeigt den Temperaturwert in °C und °F an, ebenso ob alles ok ist ("kein Fehler") oder ein Fehler ansteht ("das ist zu kalt" oder "kann Sensor nicht lesen"). mfg Egon
Egonwalter M. schrieb: > Trotz Recherche im Internet habe ich keine brauchbare Lösung/ Hinweis > auf eine Lösung gefunden. Zu HTML Formatierung? Ernsthaft? Ich meine ERNSTHAFT?
Vielen Dank für Deine Hilfe Hätte ich eine tragbare Lösung gefunden, hätte ich hier nicht nachgefragt wissend um die Hilfe, die man hier von manchen (nicht allen!) "Experten" erfährt
Die Barmer hat eine Webseite, welche erklärt wie man SELBST ATMET. Es gibt auch eine Webseite, welche erklärt wie man SELBST HTML erzeugt. Braucht's noch mehr Hinweise?
Hast Du denn den Beipackzettel unter https://randomnerdtutorials.com/esp8266-ds18b20-temperature-sensor-web-server-with-arduino-ide/ gelesen und verstanden? Genau wie Du TEMPERATUREC und TEMPERATUREF austauschst, kannst Du natuerlich die Farben im dem Web-Code austauschen. Oder einen kompletten einfachen Web-Server bauen (gucke mal die Beispiele bei der Arduino-IDE an). Ist wirklich sehr einfach. Und wieder das schoene Zitat (Beitrag "Re: Hilfe bei Z80 Opcodes"): > Und nein, dieses Forum ist zwar hilfreich, aber es ist kein > Cola-Automat, wo man auf den Knopf drückt und schon kommt der Pappbecher > mit dem fertigen Drink heraus. Etwas eigene Arbeit (auch > Einarbeitungsarbeit in den Z80) wäre vonnöten gewesen, schließlich ist >es DEINE Maschine, die jetzt doof herumsteht und nicht mehr benutzbar > ist.
@Norbert -Vielen Dank für Deine Hilfe, auch wenn sie mir nicht weiterhilft @Thomas Vielen Dank für Deine Hilfe - Das habe ich, und wenn Du mein *.ino durchgesehen hast, wirst Du feststellen, dass ich das Programm erweitert habe um die Fehlermeldung, die ich in verschiedenen Farben anzeigen möchte. mfg Egon
Egonwalter M. schrieb: > und wenn Du mein *.ino > durchgesehen hast, wirst Du feststellen, dass ich das Programm erweitert > habe um die Fehlermeldung, die ich in verschiedenen Farben anzeigen > möchte. Du gibst ja schon HTML aus. Die passsenden Argumente, um das ganze farbig zu machen, fehlen dir halt noch. Kann man aber lernen: https://wiki.selfhtml.org/wiki/SELFHTML
Egonwalter M. schrieb: > @Norbert -Vielen Dank für Deine Hilfe, auch wenn sie mir nicht > weiterhilft Öffne einen Webbrowser: Tippe ein: https://duckduckgo.com/?q=selbst+html Sei darauf vorbereitet erstaunt zu sein!
Das Programm ist etwas unübersichtlich. Könnte sein, dass es so geht, sicher bin ich aber nicht: Lege die String-Variable color an und weise ihr unmittelbar nach jeder Messung "color:green" oder "color:red" zu. Ersetze <span id="temperaturec">%TEMPERATUREC%</span> durch <span id="temperaturec"; style="%COLOR%";>%TEMPERATUREC%</span> Dito für Fahrenheit.
Norbert schrieb: > Es gibt auch eine Webseite, welche erklärt wie man SELBST HTML erzeugt. Bitte nicht mit dem Zaunpfahl winken
@Norbert: Vielen Dank für den überaus hilfreichen Hinweis mit: https://duckduckgo.com/?q=selbst+html Du hast Dich redlich bemüht... jetzt ist mir auch klar, wie Du auf 1630 Beiträge in der Zeit vom 27.02.2023 - 17.11.2024 kommst @Reinhard S: Vielen Dank für Deine Hilfe, aber die Seite (u.a.) kenne ich schon. @Sherlock: Tut mir leid, damit kann ich wirklich nichts anfangen Generell an alle Hilfeleistenden: Werte Kollegen, ich bin durchaus in der Lage, eine Suchmaschine meines Vertrauens zu benützen und mit den entsprechenden Suchbegriffen zu füttern (wie hätte ich sonst die Seite von randnerdstutorials gefunden). Hätte ich einen Hinweis auf die Lösung meines Problems gefunden, hätte ich dieses Forum NIE um Hilfe gebeten, wohl wissend um die Hilfe, die man hier von manchen (nicht allen!) "Experten" erfährt (z.B. Norbert). Wenn man nichts hilfreiches zur Lösung meines Problems beitragen kann (oder will) - bitte nichts posten - zum Frustloswerden ist das Forum nicht gedacht (geht dann lieber in den Wald und schreit da etwas rum) Ich will mein Problem etwas präzisieren: Auf einer Internetseite wird in einer Zeile angezeigt: "Fehlermeldung: kein Fehler" wenn kein Fehler ansteht (wobei "Fehlermeldung" statisch ist und schwarz angezeigt wird, der Text "kein Fehler" wird von einer Funktion geliefert, die Textfarbe ist GRÜN). In der gleichen Zeile wird der Text "kein Fehler" ersetzt durch "das ist zu kalt" oder "kann Sensor nicht lesen" wenn ein Fehler ansteht (die Textfarbe ist derzeit ROT, soll aber GRÜN werden) Also kurz: - keine Fehlermeldung - Textfarbe GRÜN - Fehlermeldung - Textfarbe ROT eine IF Anweisung in HTML geht nicht ... mfg Egon
Angehängte Dateien:
-
facepalm4.jpg
51 KB
Egonwalter M. schrieb: > eine IF Anweisung in HTML geht nicht ...
Egonwalter M. schrieb: >>> Es gibt auch eine Webseite, welche erklärt wie man SELBST HTML erzeugt. >> Bitte nicht mit dem Zaunpfahl winken > Tut mir leid, damit kann ich wirklich nichts anfangen https://wiki.selfhtml.org/
@Norbert Wenn man nichts hilfreiches zur Lösung meines Problems beitragen kann (oder will) - bitte nichts posten - zum Frustloswerden ist das Forum nicht gedacht (geht dann lieber in den Wald und schreit da etwas rum) @Sherlock Lies meinen Post - die Seite kenne ich schon
Egonwalter M. schrieb: > Wenn man nichts hilfreiches zur Lösung meines Problems beitragen kann Oh, da irrt er sich gewaltig. Du hast eine Anzahl hilfreicher Hinweise bekommen. Vor mir, von anderen. Wie es scheint hapert's allerdings entweder am Willen oder an der Aufnahmefähigkeit, dort ein paar Zeilen deutschsprachige Erklärungen zu diesem Thema zu lesen und umzusetzen.
Egonwalter M. schrieb: > eine IF Anweisung in HTML geht nicht ... Das C++ Programm auf deinem Ardino erzeugt Stückweise ein HTML Dokument, welches der Web-Browser anzeigt. Wenn der Web Browser etwas rot färben soll, dann muss das in dem generierten HTML Dokument so drin stehen. Du musst also den C++ Code so ändern, dass das generierte HTML Dokument wie gewünscht aussieht. In C++ gibt es IF Anweisungen. Egonwalter M. schrieb: > Lies meinen Post - die Seite kenne ich schon Lernen und verstehen musst du sie selbst. Noch wurde kein Überspielkabel für Know-How erfunden. Fnge damit an: https://wiki.selfhtml.org/wiki/Wie_fange_ich_an%3F
Der Vorschlag von Rolf22 war doch sehr gut. Es laeuft so oder so darauf hinaus, dass Du index_html[] mit String-Funktionen anpasst. Das ist Deine Aufgabe. Du solltest auch gucken und verstehen, was index_html[] macht und aufruft. Denn was use.fontawesome.com macht weiss ich nicht und vielleicht wird dieser Dienst eingestellt.
Ändere deine Funktion readDSTemperatureERR() so ab dass sie einen JSON String zurück liefert. In der Art:
1 | {'Error':true, 'MSG':'Das ist zu kalt'}
|
2 | oder |
3 | {'Error':false, 'MSG':'Kein Fehler'}
|
Zusätzlich änderst du den MIME Type deiner Funktion auf JSON:
1 | server.on("/errormessage", HTTP_GET, [](AsyncWebServerRequest *request) { |
2 | request->send_P(200, "application/json", defective.c_str()); |
3 | });
|
Damit hast du in deinem xhttp.onreadystatechange ein Objekt das sowohl den Status (Error/OK) als auch den Fehlertext enthält. Jetzt musst du nur noch richtig dein innerHTML / class setzen, abhängig ob ein Fehler gemeldet wurde oder nicht.
Egonwalter M. schrieb: > zum Frustloswerden ist das Forum > nicht gedacht Aber auch nicht dafür, dass dir einer die Butter aufs Brot schmiert. Du selber solltest schon ein wenig mehr dazu tun als nur "wollen". Warum hilft es dir nicht weiter, wenn dir gesagt wird, wo du die HTML Kommandos zum Umschalten der Farbe findest? Egonwalter M. schrieb: > Trotz Recherche im Internet habe ich keine brauchbare Lösung/ Hinweis > auf eine Lösung gefunden. Wonach hast du gesucht? Egonwalter M. schrieb: > die Textfarbe ist derzeit ROT, soll aber GRÜN werden Wie wird die Textfarbe rot? Und was müsste passieren, dass sie grün wird? Und wie könnte man das in C++ (aka Arduino) programmieren?
@ Lothar M(Moderator) Ok, ok, Du hast mich erwischt; ich wollte nicht nur, dass mir "einer die Butter aufs Brot schmiert", nein, ich wollte die Lösung: - komplett - in kleinen, mundgerecht vorgekauten Happen - mir keine Gedanken machen Hat halt leider nicht geklappt ... Du hast recht - ich habe nach NICHTS gesucht und programmieren - was ist das?? So, und jetzt im Ernst - soll ich Dir eine link-Liste meiner Internetsuche schicken? Und stell Dir vor - natürlich weiß ich, wie ich in C mittels einer IF Abfrage feststellen kann, ob die Farbe ROT oder GRÜN werden soll (ganz so unbedarft bin ich nun auch wieder nicht, was das Programmieren angeht). Das wars. Kannst den Thread schliessen.
Hallo, Du hast in deinem .ino einen großen String: const char index_html[] PROGMEM = R"rawliteral( Der beginnt soger mit: <!DOCTYPE HTML><html> Genau das ist der HTML Code. Dieser String wird verschickt und dann vom Browser gerendert. Dort sind auch alle deine Farben mit drin. Ich kann nicht wirklich HTML, hatte da vor Jahren mal mit zu tun. Soweit ich das überblicke wird oben in <HEAD> der Stylesheet definiert bei dir p3 für rot und p1 für nicht rot. Du musst dir also weiter p4, p5,... in der gewünschten Formatierung erstellen und dann entsprechend diesen HTML String so zusammenbauen das je nach "if" der passende HTML String erzeugt wird. p.s. Nachtrag: Das ist auch das was Unverständniss erzeugt. - Du schreibst du kannst halbwegs programieren, - halbwegs HTML verstehen (siehe Selfhtml) - hast einen riesigen String, der mit <HTML> anfängt udn findest das Problem nicht. Ist der Code von dir, oder woher kopiert, due verstehst ihn nicht und suchst die richtige Stelle? Da hat Rolf22 einen Ansatz dazu geschrieben
Benjamin K. schrieb: > und dann entsprechend diesen HTML String so zusammenbauen das je nach > "if" der passende HTML String erzeugt wird. Dir ist schon klar dass er "dynamisch" über /errormessage die Daten anfragt? Ein statisches Patchen in die HTML bringt also eher wenig. Er möchte ja nicht alle Sekunde die komplette Seite neu laden. Deshalb oben die Schritt für Schritt Anleitung was er tun könnte: Beitrag "Re: HTML Anzeige - Farbe Meldetext ändern"
Angehängte Dateien:
-
temperatur_1.png
40 KB -
temperatur_2.png
48 KB
Thomas W. schrieb: > Denn was use.fontawesome.com macht weiss ich nicht und > vielleicht wird dieser Dienst eingestellt. Die stellen zB dieses fancy-Thermometer als Grafik zur Verfügung. Kann man auch austauschen. Ich hatte einfach den Link https://use.fontawesome.com/releases/v5.7.2/css/all.css rauskopiert und in die css-Datei reingeschaut. Den Arduino source-Block kann man sich auch neu als thm abspeichern und doppelt draufklicken. Wird dann im Browser angezeigt. Hierzu braucht man keinen Arduino programmieren (können). So, wie der Platzhalter DEFECTIVE in rot dargestellt wird, gibt man eben bei "normalen" Temperaturen "grün" mit auf den Weg. Apropos: Ist das mit den Farben "Rot" und "Grün" denn nun schon geklärt?
Angehängte Dateien:
-
LokalerWebserver.JPG
46 KB
Axel R. schrieb: > Den Arduino source-Block kann man sich auch neu als thm (HTML?) abspeichern Das macht allgemein Sinn. Dann kann man die Datei auch einfach in das Filesystem des ESP einbinden. Ich finde das deutlich einfacher zu arbeiten. Axel R. schrieb: > und doppelt draufklicken. Wird dann im Browser angezeigt. Wenn man die HTML Files getrennt hält hat das nämlich noch einen weiteren Vorteil: Installiert man z.B. in VS Code das Plugin "Live Server" kann man einfach auf die HTML Datei rechtsklicken und es auf dem PC in einem Webserver ausführen lassen. Dann legt man noch die Dateien errormessage, temperaturec und temperaturef mit dem gewünschten Inhalt an und man kann im Browser sogar die Request/Responses debuggen bzw. das Verhalten über den Dateiinhalt steuern.
Hallo @Rolf, @N.M, @Benjamin K.,@Weingut P. Vielen Dank für Eure Hilfe, die von Weingut P vorgeschlagene Seite kannte ich schon - leider wird da nicht beschrieben (oder ich habs nicht gesehen) wie man abhängig von einer Variablen (gebildet über eine Funktion ausserhalb von index_html()) die Textfarbe ändern kann. @N.M - ich kann mit Deinem Post leider nichts anfangen, ich kenne mich mit JSON / C++ nicht aus. Ich habe die im angehängten Textfile (Aenderungen.txt) angegebenen Änderungen gemacht und es passiert folgendes: - es wird die Fehlermeldung: "kein Fehler" korrekt in Blau angezeigt (Web-Page und serieller Monitor) - es wird die Fehlermeldung: "das ist zu kalt" falsch in Blau angezeigt - sollte ROT in der Web-Page sein; im seriellen Monitor wird aber korrekt "color: red" angezeigt. Ich verstehe nicht, warum die Fehlermeldung "das ist zu kalt" nicht in ROT in der Web-Page angezeigt wird (die Farbdarstellung ändert sich nicht).
Egonwalter M. schrieb: > Ich habe die im angehängten Textfile Hänge deinen aktuellen Code vollständig an. Es gibt einfach zu viel Spielraum um Dinge falsch zu verstehen. Egonwalter M. schrieb: > ich kann mit Deinem Post leider nichts anfangen Eine Gegenfrage deinerseits kommt aber auch nicht. Also was ist das genaue Problem damit? Egonwalter M. schrieb: > ich kenne mich mit JSON / C++ nicht aus. Die Frage ist, willst du es lernen? Oder willst du nur dass deine Seite funktioniert? In meinem Augen sind ein paar Dinge schlecht wie du sie hier umgesetzt hast: Eigentlich brauchst du nur einen einzigen Requests um alle Daten anzurufen. Du hast aber 5 oder so. Zum einen braucht das Ressourcen (Code,Laufzeit,...) und zum anderen entstehen so auch inkonsistenze Stände (Temperaturen passen nicht zusammen, Fehler wird angezeigt Farbe stimmt aber nicht,...) weil die Requests nacheinander abgearbeitet werden. Außerdem ist es unübersichtlich. Dein eigentlicher Problem ist vermutlich das du beim ersten Abruf deiner HTML Seite die Farbe in das HTML patchst (%FARBE%) aber sobald es danach zyklisch anrufen wird du die Antwort einfach in innerHTML schreibst.
Egonwalter M. schrieb: > Trotz Recherche im Internet habe ich keine brauchbare Lösung/ Hinweis > auf eine Lösung gefunden. Das glaube ich dir nicht. > Es wäre toll, wenn mir jemand helfen könnte. Sag doch mal den URI an mit deiner Seite, dann können wir mal rein schauen. Alles andere ist Stochern im Nebel, und dafür, dass ich dabei denken muss, nehme ich Geld.
Hallo N.M Vielen Dank für Deine Hilfe > Hänge deinen aktuellen Code vollständig an. Es gibt einfach zu viel > Spielraum um Dinge falsch zu verstehen. - habe ich gemacht > Egonwalter M. schrieb: >> ich kenne mich mit JSON / C++ nicht aus. > > Die Frage ist, willst du es lernen? Oder willst du nur dass deine Seite > funktioniert? - ja, möchte ich, kenne mich aber nur mit C aus (Programmieren von ATMegas und Peripherie) > In meinem Augen sind ein paar Dinge schlecht wie du sie hier umgesetzt > hast: > Eigentlich brauchst du nur einen einzigen Requests um alle Daten > anzurufen. Du hast aber 5 oder so. - Du hast bestimmt recht, aber mit meinem derzeitigen Wissenstand kann ich das von Dir vorgeschlagene nicht umsetzen. Mir ist nicht klar, warum die Farbänderung nicht klappt - bei der Temperaturanzeige fkt sie und die Programmierung ist bei beiden gleich im inner_html() und beim setup()... mfg Egon
Carsten P. schrieb: > Egonwalter M. schrieb: >> Trotz Recherche im Internet habe ich keine brauchbare Lösung/ Hinweis >> auf eine Lösung gefunden. > Das glaube ich dir nicht. >> Es wäre toll, wenn mir jemand helfen könnte. > Sag doch mal den URI an mit deiner Seite, dann können wir mal rein > schauen. Alles andere ist Stochern im Nebel, und dafür, dass ich dabei > denken muss, nehme ich Geld. ZU Deinem Beitrag - ausgekotzt? - fühlst Du Dich nun besser? > Sag doch mal den URI an mit deiner Seite ?????
Hey,
ohne dass ich mir jetzt den Code genauer angesehen habe - in die xhttp
request müsste ich mich auch erst mal reinlesen, aber...
mal ein paar konkrete Hinweise von mir:
- Zeile 193 ist falsch. Das "_" ist zuviel. (Damit läuft Zeile 223 mit
Sicherheit ins Leere...) und das Semikolon gehört vor das "
- außerdem "errormessage" und "errormessage_col" sind zwei
unterschiedliche Elemente, die nichts miteinander zu tun haben: die
farbe bei _col zu setzen wird niemals die eigentliche errormessage
erreichen.
- Das <p1><p3> Konstrukt ist eher ungewöhnlich. Das kann man schon
machen, hat aber nix mit Html zu tun und macht auch keinen Sinn.
- innerHtml beschreibt den Text eines Html-Elementes,
also: <span>innerHTML</span>, damit lässt sich keine Farbe definieren.
Das sollte eher über sowas wie "object.style.color = '#FF0000';" gehen.
Grundsätzlich gibt da z.b. die Entwicklerkonsole (F12) von Edge (ja ich
bin Edge User - gibts in FF/Chrome bestimmt auch) ganz gute Hinweise,
was mit dem Code nicht stimmen könnte...
Dann meine bescheidene Meinung zum Thema insgesamt:
1) ich würde Formatierungen von Fehlern immer über Klassen machen:
also sowas wie .fehler {} im css style sheet definieren und dann im html
object mit class="fehler" definieren (oder über javascript ändern).
Dann hat man die Option nicht nur Farben zu ändern, sondern gleichzeitig
auch z.b. fett drucken oder ähnliches.
2) als einfachere Variante könnte man auch einfach zwei html Blöcke
definieren:
<span id="fehler" style="color:red;"></span>
<span id="keinfehler" style="color:blue"></span>
und dann einfach den richtigen Block mit innerHTML "beschreiben" (und
natürlich jeweils den anderen leeren...)
3) Das nachladen von Inhalten ist zwar sehr schick... aber wenn die
Seite nur genau das ist was dargestellt wird, würde ich mir ja den
ganzen Aufwand (und Fehlerquellen) sparen, eine statische html Seite mit
Platzhaltern im ESP ablegen (geht natürlich auch über eine variable,
bläht aber den imho den Quellcode und Platzbedarf für das Programm
unnötig auf) und über einen refresh alle paar Sekunden neu laden und mit
den richtigen Meldungen, werten und Farben befüllen.
Puh ist das jetzt viel Text geworden...
Auf jeden Fall viel Erfolg und nicht unterkriegen lassen!!
Grüße Raphael
Raphael D. schrieb: > statische html Seite mit Platzhaltern im ESP ablegen Wie viel Stack hat der konkrete ESP32 eigentlich? Ich frage, weil sich diese allgemein übliche Vorgehensweise beim ESP8266 als schwierig entpuppt hatte. Da musste ich das HTML Dokument in viele kleine Häppchen aufteilen. Ist machbar, aber halt viel aufwändiger als eine simple search/replace Operation vor der Ausgabe.
Egonwalter M. schrieb: > Mir ist nicht klar, warum die Farbänderung nicht klappt - bei der > Temperaturanzeige fkt sie und die Programmierung ist bei beiden gleich > im inner_html() und beim setup()... Gleich != gleich. Denk mal ganz pragmatisch. Ohne genau zu wissen, wie das Programm funktioniert, findet man eine Zeile in deinem HTML-Code, in der aktuelle, also wechselnden Temperaturwert als String eingetragen wird (%TEMPERATUREC%). Wenn du GENAU DORT zusätzlich die Farbe einträgst, wird sie vermutlich auch wie gewünscht angezeigt werden. Das hatte ich dir vorgeschlagen.
Beitrag #7777338 wurde von einem Moderator gelöscht.
Hallo Raphael D. Vielen Dank für Deine Hilfe (und Deinen vorletzten Satz)! Raphael D. schrieb: > Hey, > > mal ein paar konkrete Hinweise von mir: > > - Zeile 193 ist falsch. Das "_" ist zuviel. (Damit läuft Zeile 223 mit > Sicherheit ins Leere...) und das Semikolon gehört vor das " > Ich kann bei Zeile 193 keinen Fehler erkennen, das "-" ist doch nötig ( => <span_id="errormessage_col" style="%FARBE%";></span>), auch weiß ich nicht, warum hier das ";" falsch gesetzt sein soll; und warum sollte Zeile 223 ins Leere laufen? Deine Tipps ( 1 - 3) sind bestimmt sehr gut,wenn man sich mit C++, JSON, html usw auskennt;damit kann man das Programm bestimmt viel einfacher und effizienter machen - nur kann ich (derzeit) weder C++ noch JSON, Java oder html - habe also von Klassen, object, style sheet etc keine Ahnung. Ich bin zu diesem Projekt gekommen, weil ich letztes Jahr im Oktober eine neue Heizung in mein Haus einbauen musste mit Aussentemperaturregelung (die dümmste Art der Regelung, hatte zuerst eine verlässliche Innenraumtemperaturregelung) und ich deshalb eine Möglichkeit benötigte, die Raumtemperatur per Internet abzufragen, wenn ich im Winter im Ausland bin (um gegebenenfalls die Raumtemperatur per App zu erhöhen). Ich hatte damals im Internet diese Lösung gefunden und ohne Anpassungen übernommen (ich war damit zufrieden, funktioniert ja), aber jetzt wollte ich das Programm erweitern mit Fehlermeldungen etc - und auch verstehen, was das Programm macht (=> bin somit "gezwungen" mit C++, JSON etc zu beschäftigen) Grüße Egon
Egon, du musst dich nicht dafür entschuldigen, von den nötigen Fachthemen keine Ahnung zu haben. Aber du solltest wohl besser die Finger davon lassen, solange das so ist. Aus dem selben Grund verändere ich auch nicht mein Motorrad. Manchmal muss man halt einen Fachmann bezahlen - oder es unverändert lassen.
Sherlock 🕵🏽♂️ schrieb: > Egon, du musst dich nicht dafür entschuldigen, von den nötigen > Fachthemen keine Ahnung zu haben. Aber du solltest wohl besser die > Finger davon lassen, solange das so ist. > > Aus dem selben Grund verändere ich auch nicht mein Motorrad. Manchmal > muss man halt einen Fachmann bezahlen - oder es unverändert lassen. Das ist mit Abstand der d*** Post den ich je gelesen habe, denn der impliziert, sich nicht mit einem Problem zu beschäftigen, wenn man keine Ahnung hat - ist es nicht so, dass erst durch die Beschäftigung mit einem Problem ein Erkenntnisgewinn erfolgt? Und der Vergleich mit Deinem Motorrad - oh Mann!!! Aber Du hast ja schon sehr häufig solche Kommentare von Dir gegeben scnr Dennoch Danke für Deine Hilfe Egon
Hallo Rolf Vielen Dank für Deine Hilfe Rolf schrieb: > Egonwalter M. schrieb: >> Mir ist nicht klar, warum die Farbänderung nicht klappt - bei der >> Temperaturanzeige fkt sie und die Programmierung ist bei beiden gleich >> im inner_html() und beim setup()... > > Gleich != gleich. > > Denk mal ganz pragmatisch. Ohne genau zu wissen, wie das Programm > funktioniert, findet man eine Zeile in deinem HTML-Code, in der > aktuelle, also wechselnden Temperaturwert als String eingetragen wird > (%TEMPERATUREC%). Wenn du GENAU DORT zusätzlich die Farbe einträgst, > wird sie vermutlich auch wie gewünscht angezeigt werden. Das hatte ich > dir vorgeschlagen. Genau das hatte ich gemacht, aber es fkte dennoch nicht; außerdem wollte ich nicht den Farbumschlag bei der Temperaturanzeige, sondern beim Meldetext. Wie auch immer - der Farbumschlag des Meldetextes erfolgt nun, wenn ein Fehler aufgetreten ist und ich die Seite neu aufrufe. Egon
Egonwalter M. schrieb: > <span_id=" <span ist ein HTML-Tag (wie alle Wörter nach einem Anfangstag "<" oder Ende-Tag "</" "id" ist eine optionale Eigenschaft ("Propertys"), die man bei Bedarf verwenden und setzen kann. Die kann man dann in JavaScript oder PHP auswerten. In JavaScript (auch bekannt als "JS"), gibt es die Funktion getElementById(), mit deren Hilfe man auf das gewünschte Element zugreifen kann (sinvollerweise wird die id nur ein Mal im HTML-Code verwendet). Egonwalter M. schrieb: > eine IF Anweisung in HTML geht nicht ... Nee, das ist auch gar nicht möglich, da es sich bei HTML nicht um eine Programmiersprache (mit Variablen, Abfragen und Schleife) handelt, sondern eine Beschreibungssprache zur Gestaltung von Webseiten. Man löst dadurch das Design der Webseite von dem Code, mit dem sie dynamische beschickt wird (niemand - außer Sascha uns Malte - schreibt für jede Variable eine eigene Webseite). Deine Website fragt per JavaScript per "XMLHttpRequest();" die Temperatur ab - wahlweise wohl in Celsius oder Fahrenheit - oder die Fehlermedung.
Egonwalter M. schrieb: > Ich kann bei Zeile 193 keinen Fehler erkennen, das "-" ist doch nötig ( > => <span_id="errormessage_col" style="%FARBE%";></span>), auch weiß ich > nicht, warum hier das ";" falsch gesetzt sein soll; und warum sollte > Zeile 223 ins Leere laufen? also ein html Block besteht aus einem Anfang <> und einem Ende </>: also <span></span> die MÜSSEN immer zusammenpassen (außer bei Tags die kein Ende haben wie zb <br> da schreibt man aber gerne auch <br/>) In deiner Zeile hast Du einen Tag mit <span_id> eröffnet und mit </span> geschlossen. Dann kann ein Tag Eigenschaften haben. zB id, name color, style, class etc. kommt auf den Tag an. Wenn die einen Wert brauchen kommt der mit = und " oder ' dahin. Mehr gehört in einen Tag nicht rein. Das ; gehört zu dem css stylesheet, bei dem (wie in einigen Programmiersprachen üblich) die Zeilen mit einem ; abgeschlossen werden. also wäre eine korrekte style eigenschaft zB: style="color: red;" (format "eigenschaft: wert;" wobei das ; hier auch entfallen könnte) Je nachdem wie %FARBE% beschrieben wird muss also das ; innerhalb der "" sein. Also so: <span id="errormessage_col" style="%FARBE%;"></span> mit ins "Leere laufen" meinte ich, dass durch das span_id der Tag keine id bekommt weil ja id nicht als eigenschaft sondern als Teil von span_id als Tagname verwendet würde. Dementsprechend kann Zeile 223 auch keine Element des angegebenen Namen finden... > Deine Tipps ( 1 - 3) sind bestimmt sehr gut,wenn man sich mit C++, JSON, > html usw auskennt;damit kann man das Programm bestimmt viel einfacher > und effizienter machen - nur kann ich (derzeit) weder C++ noch JSON, > Java oder html - habe also von Klassen, object, style sheet etc keine > Ahnung. ... wird ganz ohne leider nicht funktionieren, aber so sehr schwierig ist das nicht. Aber ich weiß, dass das sehr ermüdend sein kann, wenns beim 128sten Versuch immer noch nicht geht... Zum Thema Html erwähne ich jetzt aber einfach nochmal selfhtml.org ;) > Ich bin zu diesem Projekt gekommen, weil ich letztes Jahr im Oktober > eine neue Heizung in mein Haus einbauen musste mit > Aussentemperaturregelung (die dümmste Art der Regelung, hatte zuerst > eine verlässliche Innenraumtemperaturregelung) und ich deshalb eine > Möglichkeit benötigte, die Raumtemperatur per Internet abzufragen, wenn > ich im Winter im Ausland bin (um gegebenenfalls die Raumtemperatur per > App zu erhöhen). Klingt irgendwie unpraktisch - ich verwende selber eine Raspimatic, kann ich sehr empfehlen. Aber ganz ehrlich ein Frostschutz oder sowas MUSS doch automatisch gehen... Ansonsten habe ich ein Temperaturüberwachungssystem auf Basis von mehreren ESP32, welches Temperaturkurven speichert und bei überschreiten gewisser Grenzen Warnungen per Email verschickt. Dafür arbeite ich mit c++, html, python, php und einer MySql Datenbank für die Daten. ;) (Vielleicht ist das auch etwas übertrieben, aber ich hab da meinen Spaß dran...) Viele Grüße Raphael
Gehen wir das Ganze doch mal systematisch an. Im HTML-String, der ausgegeben wird, findet sich folgende Passage:
1 | <span id="temperaturec">%TEMPERATUREC%</span> |
Es gibt hier also eine Zelle mit einem Platzhalter %TEMPERATURE%. Diese Zelle hat eine ID, nämlich "temperaturec". Wenn man nun weitersucht im Source nach "temperaturec", findet man das:
1 | document.getElementById("temperaturec").innerHTML = this.responseText;
|
Das ist JavaScript. Diese Zeile findet sich in einer JS-Funktion namens setInterval(), welche als Parameter die Zeit in Millisekunden hat, wie oft der Browser diese JS-Funktion aufrufen soll. Der Parameter lautet 5000. Also wird die Funktion innerhalb setInterval() alle 5 Sekunden aufgerufen. Was macht die Funktion? Sie ruft auf dem Host die URL "/temperaturec" auf. Der vom Host (Arduino) zurückgemeldete Wert wird dann per Javascript-Zeile
1 | document.getElementById("temperaturec").innerHTML = this.responseText;
|
in das span-Element eingefügt und damit der Platzhalter "%TEMPERATUREC%" ersetzt. Du hast nun zwei Möglichkeiten: Entweder gibt Dein Arduino-Code, bei Reaktion auf die URL "/temperaturec" die Farbe mit aus, indem Du vor dem numerischen Wert zum Beispiel die Zeichenkette
1 | <font color='blue'> |
einfügst und dahinter die Zeichenkette
1 | </font> |
anfügst, oder Du erledigst das im Javascript-code, was ich selbst eleganter finde. Ersetze daher die Zeile
1 | document.getElementById("temperaturec").innerHTML = this.responseText;
|
durch folgendes:
1 | var temp = parseFloat(this.responseText); |
2 | var obj = document.getElementById("temperaturec");
|
3 | obj.innerHTML = this.responseText; |
4 | if (temp <= 5.0) |
5 | {
|
6 | obj.style.color = "blue"; |
7 | } |
8 | else |
9 | {
|
10 | obj.style.color = "red"; |
11 | } |
Temperaturen unterhalb 5° werden nun in blau ausgegeben, alle anderen in rot. Das kannst Du beliebig weiter ausbauen. Ob Du jetzt aus dem obigen Code schlau werden willst und was lernen möchtest, bleibt dir überlassen. Der obige Code ist ungetestet. Das musst Du machen. Ich werde ihn auch nicht weiter erklären. Immer daran denken: Gib einem Mann einen Fisch und du ernährst ihn für einen Tag. Lehre einen Mann zu fischen und du ernährst ihn für sein Leben. (Konfuzius) Ich habe Dir nur einen Fisch gegeben. Aber Du wolltest es so.
Egonwalter M. schrieb: > siehe *.ino. Das Programm liest den Temperaturwert mittels DS18B20 ein, > er wird ausgewertet und mittels WEMOS D1 alle 5 sek an eine > Internetseite geschickt. Nein, so ist das nicht, das sollte man für das Verständnis korrekt beschreiben: Der Client (Browser) bekommt auf Anfrage html geliefert. In diesem html ist Code der vom Browser ausgeführt wird. Der Server kann nichts zyklisch an den Client schicken, der Client muss hier aktiv Daten anfragen. Das passiert zyklisch in dem Code in setIntervall() wie schon beschrieben wurde. Da werden dann nur einzelne Daten angefragt und das geladene html modifiziert. Diese Anfragen kann man auch in den Browser eingeben als http//:ip/temperatureC bzw. Die url die in den server.on() registriert wurden. Wenn das die gewünschten Daten anzeigt kann man den html Code prüfen. Dazu sollte man die simplen Übungen aus selfhtml oder w3school durchspielen. Das Server / Client PingPong am besten zum Verdeutlichen auf ein Blatt Papier aufmalen.
>> Egon, du musst dich nicht dafür entschuldigen, von den nötigen >> Fachthemen keine Ahnung zu haben. Aber du solltest wohl besser die >> Finger davon lassen, solange das so ist. Egonwalter M. schrieb: > Das ist mit Abstand der d*** Post den ich je gelesen habe Ich will dich nicht davon abhalten, etwas neues zu lernen. Nur hast du dir hier zu viel gleichzeitig vorgenommen. Ich glaube nicht, dass ein normaler Mensch dazu fähig ist, all das in wenigen Tagen gleichzeitig zu lernen: - HTML - CSS - Javascript - HTTP Protokoll - XmlHttpRequest (AJAX) - JSON - C++ - Arduino - ESPAsyncWebServer Du merkst doch selbst, dass du die Antworten hier nur zum Bruchteil verstehst und dass du die Vorschläge nicht in den bestehenden Code einarbeiten kannst. Kein Wunder, denn du hast hier zu viele Baustellen gleichzeitig offen. Selbst wenn du bei ein paar Themen sagst "kenne ich doch!": Solange mehr als zwei Themen Unbekannt sind, ist das meiner Meinung nach zu viel. > du solltest wohl besser die Finger davon lassen, solange das so ist. Will sagen: Mache etwas anderes, was Spaß macht und klappt. Befasse dich nacheinander einzeln mit den notwendigen Themen. Irgendwann bist du so weit, dass du das Puzzle zusammenfügen kannst.
Die RandomNerds Seite ist sehr gut, da ist nicht nur der Code zum kopieren sondern es ist jede Zeile erklärt. Man muss sich nur die Zeit nehmen das auch zu lesen und versuchen zu verstehen.
Hallo Frank M Vielen Dank für Deine Hilfe, speziell Deine Erklärungen und Dein Code haben mir sehr weitergeholfen und letztlich zur Lösung meines Problems beigetragen - mein Problem mit der farblichen Änderung der Meldetexte ist gelöst, das fkt nun. Frank M. schrieb: > Gehen wir das Ganze doch mal systematisch an. Im HTML-String, der > ... > Immer daran denken: > > Gib einem Mann einen Fisch und du ernährst ihn für einen Tag. Lehre > einen Mann zu fischen und du ernährst ihn für sein Leben. > (Konfuzius) > > Ich habe Dir nur einen Fisch gegeben. Aber Du wolltest es so. Deine letzten Bemerkungen - schade, die fand ich unpassend; ich benötigte Unterstützung - und die habe ich dankenswerter Weise von Dir und anderen wie Rolf (rolf22), Rahul D(rahul), Raphael D(crazy), J.S (jojos), N.M (mani) erhalten. Dafür nochmals vielen Dank. Auf schulmeisterliche unpassende Belehrungen Bemerkungen wie "Ich habe Dir nur einen Fisch gegeben. Aber Du wolltest es so." oder die von Sherlock(rubbel-die-katz) oder Norbert(der-norbert) kann ich gerne verzichten, da sie zur Problemlösung nichts Brauchbares beitragen. Nichts für ungut mfg Egon
HalloJ. S. J. S. schrieb: > Die RandomNerds Seite ist sehr gut, da ist nicht nur der Code zum > kopieren sondern es ist jede Zeile erklärt. Man muss sich nur die Zeit > nehmen das auch zu lesen und versuchen zu verstehen. Stimmt, aber diese Seite hat mir nicht bei der Lösung meines Problems geholfen Naja, nun fkt es ja. mfg Egon
Hallo J. S Vielen Dank für Deine Hilfe J. S. schrieb: > Egonwalter M. schrieb: > >> siehe *.ino. Das Programm liest den Temperaturwert mittels DS18B20 ein, >> er wird ausgewertet und mittels WEMOS D1 alle 5 sek an eine >> Internetseite geschickt. > > Nein, so ist das nicht, das sollte man für das Verständnis korrekt > beschreiben: > Das hat mir geholfen, das Ganze etwas besser zu verstehen mfg Egon
ich hatte vor langer Zeit ein ähnliches Problem - wollte je nach Zustand einen Text blau statisch oder rot blinkend anzeigen Ich kann auch nicht wirklich programmieren Meine Lösung: ich zeige immer beide Texte an der gleichen Position an- der Textinhalt ist jeweils eine Variable Je nach Zustand ist immer eine der beiden Variablen leer
Egonwalter M. schrieb: > kann ich gerne > verzichten, da sie zur Problemlösung nichts Brauchbares beitragen. Nun gräme dich nicht all zu sehr. Schließlich hast du ein paar Leute gefunden, welche die ganze Arbeit für dich erledigt haben. Da musstest du nicht extra etwas Neues lernen. Das ist doch bestimmt auch ein schönes Gefühl.
Noch eine letzte Bemerkung. innerHTML ist die schlechteste aller Möglichkeiten, eine simple Zahl in die Ausgabe einzubetten. Der Browser wird nämlich den Text komplett neu rendern - in Erwartung, dass HTML-Code einzufügen ist, was die Ausgabe komplett ändern könnte. Ergebnis: Die Ausgabe einer neuen Zahl könnte etwas flackern. Besser wäre es, innerHTML durch innerText zu ersetzen. Dann weiß der Browser, dass es sich um schnöden Text handelt und kann das optimieren. Ergebnis: Der Flicker-Effekt ist dann weg.
Hallo Frank. Vielen Dank für Deine Hilfe Frank M. schrieb: > Noch eine letzte Bemerkung. innerHTML ist die schlechteste aller > Möglichkeiten, eine simple Zahl in die Ausgabe einzubetten. Der Browser das werde ich machen. mfg Egon
Hallo Sherlock Sherlock 🕵🏽♂️ schrieb: >>> Egon, du musst dich nicht dafür entschuldigen, von den nötigen >>> Fachthemen keine Ahnung zu haben. Aber du solltest wohl besser die >>> Finger davon lassen, solange das so ist. > > Egonwalter M. schrieb: >> Das ist mit Abstand der d*** Post den ich je gelesen habe > > Ich will dich nicht davon abhalten, etwas neues zu lernen. Nur hast du > dir hier zu viel gleichzeitig vorgenommen. Ich glaube nicht, dass ein > normaler Mensch dazu fähig ist, all das in wenigen Tagen gleichzeitig zu > lernen: Bei Deinem Post musste ich unwillkürlich an Reinhard Mey und sein Lied "Annabelle, ach Annabelle" denken (hatte ich schon fast vergessen), speziell die ersten Strophen; und dafür möchte ich Dir danken - ein Grinsen konnte ich mir nicht verkneifen bei dem Vergleich. NB - Du bist nicht zufällig der (ehemalige) Stefan F?? mfg Egon
Hallo Mein primäres Problem (Darstellung von Meldetexten in unterschiedliche Farben) ist gelöst und daher möchte ich mich nochmals bei Allen (wirklich Allen!!) bedanken, die auf meinen Thread reagiert haben. - Dank an all jene, die mir lösungsorientierte Tipps, Hinweise etc gegeben haben (das waren viele!), auch wenn ich diese nicht sofort verstanden habe und entsprechend umsetzen konnte. - Dank an all jene, die mir meine "Unzulänglichkeiten" aufgezeigt haben und die mich mit ihren Stänkereien und Pöbeleien zum Lachen gebracht haben (z.B Sherlock, von Norbert(der_norbert)) Stänkereien und Pöbeleien gehören in diesem Forum wohl dazu - nicht ernst nehmen und darüber lachen - wir wissen ja "Lachen ist die beste Medizin" Nichts für Ungut mfg Egon
Thread beobachten
Seitenaufteilung abschaltenBitte melde dich an um einen Beitrag zu schreiben. Anmeldung ist kostenlos und dauert nur eine Minute.
Bestehender Account
Schon ein Account bei Google/GoogleMail? Keine Anmeldung erforderlich!
Mit Google-Account einloggen
Mit Google-Account einloggen
Noch kein Account? Hier anmelden.