- LiFePO4 Speicher Test         
Ergebnis 1 bis 10 von 90

Thema: html-Code für virtuelles website-Button-Pad

Hybrid-Darstellung

Vorheriger Beitrag Vorheriger Beitrag   Nächster Beitrag Nächster Beitrag
  1. #1
    HaWe
    Gast
    zip Anhänge bringebn nichts, besser man kann es dirket lesen, um sich darüber zu verständigen!!
    Und es muss vollständiger Code sein!! (Komplettes Program!!)

    ich will versuchen, dir noch mal den Grund zu erklären:

    als reines Keypad ist die Website grundsätzlich OK,
    und Zusatzbuttons zur Steuerung funktionieren grundsätzlich auch.
    Was die Buttons für die Zustands-Modi angeht, so müssen die allerdings angezeigt werden, und hier kommen zu
    Detect, Training
    noch mindestens 2 weitere dazu: Upload und Pause,
    und zwischen diesen Zuständen wird hin- und her geschaltet (immer nur 1 davon ist aktiv).

    Diese Zustandsmodi werden allerdings auch vom laufenden Programm selbstständig, automatisch gesetzt und geändert, nicht nur vom User auf der Website, und wenn man neue Daten eingibt, muss man wissen, in welchem Zustand das Programm gerade ist (Zustandsautomat).
    Wenn das über die Website nicht geht (Farbänderung der entspr. Buttons ,oder ggf eine Meldezeile), dann muss dies auf einem Display erfolgen und über GPIO-LEDs.

    Mein M3 Due früher hatte viel RAM (mehr als der esp8266), genügend GPIOS (70), ein 2,8"" Farb-Display und konnte MT, darüber ging es, war aber per Menüsteuerung trotzdem sehr verschachtelt.
    Mein ESP8266 hat nicht genügend freie Pins, eine SD-Karte braucht 4, und mein i2c-OLED 2 weitere, außerdem ist dieses eigentlich zu mickrig zur autonomen Steuerung: Hier bleiben also dann schon gar keine GPIOs mehr übrig für LEDs und Taster.
    Fazit:
    wenn man eine html-Website nicht auch als Dashboard zur Programmstatusanzeige verwenden kann, braucht man einen anderen Prozessor mit WiFi, mehr GPIOs, zusätzlichen GPIO-Tastern und einem großen TFT, und das kann dann nur ein ESP32 oder ein Raspi sein, und beide können ja auch MT.

    Darüberhinaus muss ich in der Lage sein, Variablennamen zu ändern, wenn es nötig ist.
    isSave ist missverständlich, da es nichts "ist", sondern nur einen btn-press signalisiert, wodurch etwas getan werden soll.
    eigentlich wäre dann sogar etwas anderes wie btn_Save_press besser, analog auch btn_Clear_press usw., damit der Code später unmissverständlich bleibt.
    Zusätzlich muss ich die Reihenfolge und Anordnung der Buttons samt ihrer Variablen für die Zwecke der NN-Steuerung ändern können, und das muss dann so bleiben.

    Dein letzter zip Anhang ist wie geesagt nicht nutzbar für mich, da er nicht meinen eigenen Code samt Test- und Debugroutinen mit eingearbeitet hat und noch nicht einmal lauffähig ist. Auch hast du die Variablennamen zurück-geändert, wodurch sie jetzt nicht mehr zu meinem Testcode passen.


    Ich werde daher wschl auf Version 0.0.2a zurückgehen, ohne Farbänderung der Buttons (denn das geht ja eh nicht programmseitig) und muss sehen, ob ich Teile der Buttons auf ein TFT/OLED-Display-Menü übertrage, samt Zustandsanzeige.

    Am WE jetzt bin ich viel unterwegs, höchstens zwischenzeitlich mal am PC (aber dann ohne ESP8266) wschl also erst im Lauf der kommen den Woche.

    Ob ich das ganze also hinkriege, dass auch du das NN am ESP8266 benutzen kannst, ist ziemlich unsicher, vermutlich vlt eher nicht, ich selber würde meinem Adafruit Feather ESP32 mit 3,5" TFT bessere Chancen einräumen, und selbst das wird viele Wochen Arbeit bedeuten.

    - - - Aktualisiert - - -

    was allerdings schön wäre: ein Bugfix für Version 0.0.2a, sodass ein Clear-Press nach Daten-OK/submit sofort das Keypad leert, nicht erst nach 2x, und es auch nicht nur scheinbar leert wie bei Version 0.0.3/4:
    sondern nach XXX Daten OK/submit, dann Clear-Press und dann unmittelbarem Click auf OK/submit dann auch wirklich sofort ein leeres Feld übertragen wird und nicht doch noch mal der vorher ungelöschte Inhalt.

    Code:
    #include <ESP8266WiFi.h>
    #include <WiFiClient.h>
    #include <ESP8266WebServer.h>
    
    
    // Version 0.0.2a
    
    const char* ssid = "WLAN";
    const char* password = "1234567";
    
    ESP8266WebServer server(80);
    
    //-----------------------------------------------------
      //HTML und Daten für das Eingabe-/Ausgabefeld
      //einfügen im globalen Scope
      //-----------------------------------------------------
      //erstellt von (c): Moppi    @roboternetz.de
      //-----------------------------------------------------
      //Breite und Höhe des ges. Feldes
        const int tableWidth = 10;
        const int tableHeight = 10;
      //Füllzeichen für Felder
        const String fillChar = "X";
      //Parameter-Array enthält den Status aller Felder
      //der Ein-/Ausgabematrix (0= AUS, 1= AN)
        bool matrix[tableHeight*tableWidth]={0};
      //Status, ob Änderungen vorliegen
        volatile static bool toChange = 0;
        volatile static bool toLearn = 1;
        volatile static bool toDetect = 0;
        volatile static bool toReset = 0;
        volatile static bool toSave = 0;
        volatile static bool toClear = 0;
      //HTML
        String body = "";
        String s1="<style>\nform{margin:0}\n#un{width:0;height:0;visibility:hidden}\n#bu{width:10em;height:2em;}\n#rw{display:table-row;}\n#ce{display:table-cell;}\n#ip{width:1.5em;text-align:center;font-weight:bold}\n</style>\n<script>dge=document.getElementById; function oc(ob){if(ob.value=='')ob.value='"+fillChar+"';else ob.value='';}</script>\n<div role=\"presentation\" style=\"display:table\"><div id='rw'><div id='ce' style=\"padding-right:1em\"><form method=\"get\"><div role=\"presentation\" style=\"margin-bottom:1em;display:table\">";
        String s2="<div id=\"rw\">";
        String s3="<div id=\"ce\"><input onclick=\"oc(this);\" type=\"text\" name=\"b";
        String s3_1="\" value=\"";
        String s3_2="\" maxlength=\"1\" id=\"ip\"></div>";
        String s4="</div>";
        String s5="</div><div id='ce'><input id=\"bu\" type=\"submit\" value=\"Change:Ok\"><p></form>";
        String s5_0="<form method=\"get\"><input id=\"bu\" type=\"submit\" value=\"Clear\"><input id=\"un\" type=\"text\" name=\"bn\" value=\"clear\"></form>"; 
        String s5_1="<form method=\"get\"><input id=\"bu\" type=\"submit\" value=\"Learn\"><input id=\"un\" type=\"text\" name=\"bn\" value=\"learn\"></form>";
        String s5_2="<form method=\"get\"><input id=\"bu\" type=\"submit\" value=\"Detect\"><input id=\"un\" type=\"text\" name=\"bn\" value=\"detect\"></form>";
        String s5_3="<form method=\"get\"><input id=\"bu\" type=\"submit\" value=\"Reset\"><input id=\"un\" type=\"text\" name=\"bn\" value=\"reset\"></form>";
        String s5_4="<form method=\"get\"><input id=\"bu\" type=\"submit\" value=\"Save\"><input id=\"un\" type=\"text\" name=\"bn\" value=\"save\"></form></div></div></div>";
    String par="b";
      //-----------------------------------------------------
    
    
    float bufferArray[100];
    
    
    //-----------------------------------------------------
    //-----------------------------------------------------
    void setup() {
    
      Serial.begin(115200);
      delay(1000);
      Serial.println();
    
      //-----------------------------------------------------
      //Anmeldung am Netzwerk
      //-----------------------------------------------------
      Serial.println("connecting by IPAddress(192,168,2,99)");
      WiFi.mode(WIFI_STA);
      WiFi.begin(ssid, password); //begin WiFi connection
      WiFi.config(IPAddress(192, 168, 2, 99), IPAddress(192, 168, 2, 1), IPAddress(192, 168, 2, 1), IPAddress(255, 255, 255, 0));
    
      Serial.println("");
    
      // Wait for connection
      while (WiFi.status() != WL_CONNECTED) {
        delay(500);
        Serial.print(".");
      }
      Serial.println("");
      Serial.print("Connected to ");
      Serial.println(ssid);
      Serial.print("IP address: ");
      Serial.println(WiFi.localIP());
    
    
      //-----------------------------------------------------
      //Auswertung und Erstellung des Ein-/Ausgabefeldes
      //-----------------------------------------------------
      //Einbinden in setup() und in loop() nutzen durch
      //Aufruf von "server.handleClient();"
      //benötigt Objekt "server", erstellt im globalen Scope
      //mittels:       ESP8266WebServer server(80);
      //benötigt auch: #include <ESP8266WebServer.h>
      //-----------------------------------------------------
      //erstellt von (c): Moppi    @roboternetz.de
      //-----------------------------------------------------
    
      memset(matrix , 0, sizeof(matrix));
      server.on("/",[]()
       {
        //Auswerten des Query-String vom Browser
        int n = 0; 
        if(server.hasArg("bn")){
          if(server.arg("bn") == "clear") toClear=1; else toClear=0;
          if(server.arg("bn") == "save") toSave=1; else toSave=0;
          if(server.arg("bn") == "reset") toReset=1; else toReset=0;
          if(server.arg("bn") == "detect") toDetect=1; else toDetect=0;
          if(server.arg("bn") == "learn") toLearn=1; else toLearn=0;      
        }
        for(int x=0; x < tableHeight; x++){
          for(int j=0; j < tableWidth; j++){
            if(server.hasArg(par+String(n))){
              String a = server.arg(par+String(n));
              bool ic = matrix[n];
              if (a == "") matrix[n] = 0; else matrix[n] = 1; 
              if (ic != matrix[n]) toChange = 1;
              n++;
            }
          }
        }
        //Aufbau des Feldes
        String v; body = s1; n = 0;
        for(int x=0; x < tableHeight; x++){
          body += s2;
          for(int j=0; j < tableWidth; j++){ 
            if (matrix[n]) v = fillChar; else v = "";
            body += s3 + String(n) + s3_1 + v + s3_2;
            n++;
          }
          body += s4;
        }
        body += s4+s5+s5_0+s5_1+s5_2+s5_3+s5_4;
        //Senden der Seite an den Browser
        server.send(200, "text/html", body);
       }
      );
      //-----------------------------------------------------
    
    
    
      //-----------------------------------------------------
      //Webserver starten
      //-----------------------------------------------------
      server.begin();
      Serial.println("Web server started!");
    
    }
    
    
    uint32_t timestamp=0, sec=0;
    uint8_t modeLearn=0, modeDetect=0;
    
    //-----------------------------------------------------
    //-----------------------------------------------------
    void loop() {  
      server.handleClient();
      // Aktionen nach ButtonClick:
      if(toClear) {
        Serial.println((String)"toClear="+toClear);
        memset(matrix , 0, sizeof(matrix));
        toClear=0;
      }
      if (toChange) {
        Serial.println("new data:");
        for (int i = 0; i < 100; i++) {
           bufferArray[i] = (float)matrix[i];
           Serial.println((String)i + ": " + bufferArray[i]);
        }
        toChange=0;
      }
      if(toLearn){       
        modeLearn=1;
        modeDetect=0;
        Serial.println((String)"modeLearn="+modeLearn);
        toLearn=0; 
      }
      else 
      if(toDetect) {      
        modeLearn=0;
        modeDetect=1;
        Serial.println((String)"modeDetect="+modeDetect);
        toDetect=0;  
      }
      if(toReset) {
        toLearn=0;
        toDetect=1;
        Serial.println((String)"toReset="+toReset);
        toReset=0;
      }
      if(toSave) {
        toLearn=0;
        toDetect=1;
        Serial.println((String)"toSave="+toSave);
        toSave=0;
      }
      if(millis()-timestamp >= 1000) {
        sec++;
        timestamp +=1000;
        Serial.println(sec);
      }
    }
    Geändert von HaWe (09.11.2019 um 22:32 Uhr) Grund: typos

  2. #2
    Erfahrener Benutzer Robotik Einstein
    Registriert seit
    18.03.2018
    Beiträge
    2.650
    Wie schon früher erwähnt, kann noch ein Reload
    der Seite vom Browser aus veranlasst werden.
    Eine Möglichkeit habe ich zunächst eingebaut.
    So, wie ich jetzt lese, geht es ohne wohl nicht.

    Die neue Version ist: 20191102.1

    Zwei neue Variablen sind hinzugekommen:

    Code:
      
      Variable:     bool ifRefresh = 1;  
      Beschreibung: Refresh der Seite ausführen 0 = nein, 1 = ja
      Ändern:       darf geändert werden
      Wirkrichtung: unidirektional, Programm -> Browser 
      ---------------------------------------------------------------------
      Variable:     const int RefreshTime = 4;
      Beschreibung: Zeit, nach der die Seite erneut abgerufen wird
      Ändern:       darf bei Programmerstellung geändert werden
      Wirkrichtung: unidirektional, Programm -> Browser

    KeyPad20191102-1.zip


    Ich weiß, Softwareentwicklung ist keine einfache Sache. Ablaufpläne haben wir hier noch gar nicht erwähnt,
    aber eine Wahrheitstabelle für die Buttons wäre gut gewesen, dann hätte ich früher einen Überblick gehabt,
    wie die wann reagieren sollen; hätte vlt. das ein oder andere mit einbauen können.


    Falls Du das ausprobierst, bitte dran denken, dass die Steuerung des Seiten-Reload von Dir aktiviert oder
    deaktiviert werden kann/soll/muss.





    MfG

  3. #3
    HaWe
    Gast
    danke, aber mit dem zip kan ich nichts anfangen - ich weiß nicht was wo hin soll und was stattdessen raus muss.
    Außerdem stimmen die Variablen-Namen nicht mit 0.0.2a überein.
    Bitte kopiere es in meinen Sketch ver 0.0.2a hinein und poste es neu!
    Danke!

    ich teste den lauffähigen Code dann ASAP!
    Geändert von HaWe (09.11.2019 um 22:32 Uhr)

  4. #4
    Erfahrener Benutzer Robotik Einstein
    Registriert seit
    18.03.2018
    Beiträge
    2.650
    Meine Hilfestellung habe ich darin gesehen, bezüglich dieser Button-Pad-Geschichte
    (ausgehend von Buttons mit LEDs) in möglichst kurzer Zeit, etwas zu erstellen,
    das platzsparend im Quelltext unterzubringen und einfach dort austauschbar ist.
    Letzteres, um die gute Wartbarkeit des Codes zu gewährleisten.
    Dass das Produkt hier nicht das Ende der Weiterentwicklung darstellen muss,
    sollte bewusst sein. Das betrifft auch die eingesetzten Techniken zur Datenübertragung,
    seitens des Webbrowsers.


    Modular und strukturiert vorzugehen, ist bei Teamarbeit unerlässlich, weil es
    viel Zeit spart und das Projekt somit schnell voran bringt.


    Der von mir vorgelegte Aufbau des Quelltextes ist zunächst experimentell, aber auch so
    gewählt, damit das später in eine externe Bibliothek umgewandelt werden kann, wo aus
    der Sache dann ein Objekt mit Methoden werden könnte.


    Angesichts der Schwierigkeiten der Akzeptanz eines solchen Aufbaus / Vorgehens
    sehe ich es aber als zu zeitraubend, zwei Quellcodes / Module zweier "Programmierer"
    miteinander zu verquicken / ineinander zu verschachteln, so dass dann nur noch ein
    größerer Quellcode da ist, mit vielen Bestandteilen, die mit der eigentlichen
    Ausgangsaufgabe nichts zu tun haben. Wer soll den dann warten?


    Der Quellecode liegt vor, ist einfach für Dich zu verstehen und daher steht es Dir frei,
    das irgndwie anders in Deinem Programm umzusetzen oder zu integrieren.


    Ob Du so eine Lösung aus technischer Sicht verwenden kannst, war von Anfang an fraglich
    und muss(te) sich mit der Zeit herausstellen. Wissen kannst nur Du das, was Du dann für
    Dein Vorhaben benötigst.


    Ich werde an diesem Punkt nicht weiter daran arbeiten, sondern mich dann wieder anderen
    Sachen zuwenden.




    MfG
    Moppi

Ähnliche Themen

  1. Antworten: 0
    Letzter Beitrag: 20.03.2019, 13:40
  2. html code für User Login + password (esp8266 + Arduino IDE)
    Von HaWe im Forum NodeMCU-Board und ESP8266, ESP32-Serie
    Antworten: 35
    Letzter Beitrag: 19.08.2018, 19:10
  3. html-Code für nodeMCU mit Arduino IDE + Wifi libs
    Von HaWe im Forum Arduino -Plattform
    Antworten: 7
    Letzter Beitrag: 14.08.2018, 18:30
  4. HTML-Code (scripts)
    Von Technik =) im Forum Umfragen
    Antworten: 6
    Letzter Beitrag: 10.10.2008, 09:21
  5. virtuelles Autocockpit
    Von redg im Forum PC-, Pocket PC, Tablet PC, Smartphone oder Notebook
    Antworten: 6
    Letzter Beitrag: 02.10.2005, 13:53

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •  

12V Akku bauen