0

I am fairly new to arduino and ESP though am very familiar with css and javascript.

I have an esp webserver that includes a button

client.print("<button style='background-color: #F30C0C; color:#000;'></button>");

but need it to change the css backbround-color when pin is reading HIGH

 if (c == '\n') {
          currentLineIsBlank = true;
          buffer = "";
        }
        else if (c == '\r') {
          if (buffer.indexOf("GET /?relay1") >= 0)
            relayPIN1read = digitalRead(relayPIN1);

          if (relayPIN1read == HIGH) {
            digitalWrite(relayPIN1, LOW);
          }
          if (relayPIN1read == LOW) {
            digitalWrite(relayPIN1, HIGH);
          }
        }
      }

Does any one know of any way to do this?

Improve this question

1 Answer 1

Reset to default
1

First print everything up to the colour. Then print the colour, which you change depending on the state of the pin. Then print the rest.

client.print("<button style='background-color: ");

if (digitalRead(PIN) == HIGH) {
    client.print("#0CF30C");
} else {
    client.print("#F30C0C");
}

client.print("; color:#000;'></button>");
Improve this answer
3
  • I did try that, but seamed to go HIGH and LOW as if it was in a 2 count loop.. but will give it another go... Thank you Commented Jun 12, 2019 at 11:03
  • @Ben You are sending a "toggle" command rather than a "set" or "reset" command. You should separate it out and use a similar system as the colour to change the command the button sends. Commented Jun 12, 2019 at 11:07
  • dont know what i was going last time.. but that worked like a charm.. thanks very much for your time :) Commented Jun 12, 2019 at 11:24

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.