Multiple blink on esp8266

i clone the setting using millis "//LED1" to "//LED2", means multiple millis but not my expectation.

if only one millis on "//LED1"

  • it can blink on "//LED1" ,1 second blinking, match my expectation
  • work as normal

if two millis on "//LED1" and "//LED1"

  • it can blink on both
  • but not my expectation, blink so fast.
/*
   This code will configure ESP8266 in station mode and it will then act as a web server after connecting to a WiFi Router. It will then turn On/Off 4 LEDs as per input from the connected client
*/

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <FastLED.h>

#define NUM_LEDS 300
#define BRIGHTNESS 255
#define LED_TYPE WS2812
#define DATA_PIN 5

CRGB leds[NUM_LEDS];
unsigned long actTime = 0;
unsigned long remTime = 0;
const unsigned long period = 1000;


/*Specifying the SSID and Password of the WiFi*/

const char *ssid = "Yukitson";
const char *password = "23062306";

//Specifying the Webserver instance to connect with HTTP Port: 80
ESP8266WebServer server(80);

//Specifying the boolean variables indicating the status of LED1 to LED4
bool led1_status = false, led2_status = false, led3_status = false, led4_status = false;

void setup() {
  FastLED.setMaxPowerInVoltsAndMilliamps(5, 1000);
  FastLED.addLeds<NEOPIXEL, DATA_PIN>(leds, NUM_LEDS);
  FastLED.setBrightness(BRIGHTNESS);
  //Starting the serial communication channel
  Serial.begin(115200);
  Serial.println();
  Serial.print("Connecting to ");
  Serial.print(ssid);

  //Connecting to the local WiFi network
  WiFi.begin(ssid, password);

  //Keep checking the WiFi status until it is connected to the wifi network

  while (WiFi.status() != WL_CONNECTED) {
    delay(100);
    Serial.print(".");
  }
  Serial.println("");
  Serial.print("WiFi Connected with IP Address: ");
  Serial.println(WiFi.localIP());

  //Specifying the functions which will be executed upon corresponding GET request from the client
  server.on("/", handle_OnConnect);
  server.on("/led1on", handle_led1on);
  server.on("/led1off", handle_led1off);
  server.on("/led2on", handle_led2on);
  server.on("/led2off", handle_led2off);
  server.on("/led3on", handle_led3on);
  server.on("/led3off", handle_led3off);
  server.on("/led4on", handle_led4on);
  server.on("/led4off", handle_led4off);
  server.onNotFound(handle_NotFound);

  //Starting the Server
  server.begin();
  Serial.println("HTTP Server Started");
}

bool is_red = false;

void loop() {

  if (WiFi.status() == WL_CONNECTED)  //Check if ESP8266 is still connected to the internet
  {
    //Assign the server to handle the clients
    server.handleClient();

    //Turn the LEDs ON/OFF as per their status set by the connected client

    //LED1
    if (led1_status == false) {
      fill_solid(leds, NUM_LEDS, CRGB::Black);
      FastLED.show();
    } else {

      actTime = millis();
      if (actTime - remTime >= period) {
        remTime = actTime;
        if (!is_red) {
          is_red = true;
          fill_solid(leds, NUM_LEDS, CRGB::Red);
          FastLED.show();
        } else {
          is_red = false;
          fill_solid(leds, NUM_LEDS, CRGB::Black);
          FastLED.show();
        }
      }
    }

    //LED2
    if (led2_status == false) {
      fill_solid(leds, NUM_LEDS, CRGB::Black);
      FastLED.show();
    } else {
      actTime = millis();
      if (actTime - remTime >= period) {
        remTime = actTime;
        if (!is_red) {
          is_red = true;
          fill_solid(leds, NUM_LEDS, CRGB::Blue);
          FastLED.show();
        } else {
          is_red = false;
          fill_solid(leds, NUM_LEDS, CRGB::Black);
          FastLED.show();
        }
      }
    }

    //LED3
    if (led3_status == false) {

    } else {

    }

    //LED4
    if (led4_status == false) {

    } else {

    }
  } else {
    Serial.println("WiFi Disconnected!!!");
    Serial.print("Trying to establish the connection...");

    //Keep checking the WiFi status until it is connected to the wifi network
    while (WiFi.status() != WL_CONNECTED) {
      delay(1000);
      Serial.print(".");
    }
    Serial.println("");
    Serial.print("WiFi Connected with IP Address: ");
    Serial.println(WiFi.localIP());
  }
}

void handle_OnConnect() {
  Serial.println("Client Connected");
  server.send(200, "text/html", HTML());
}

void handle_led1on() {
  Serial.println("LED1 ON");
  led1_status = true;
  is_red = false;
  server.send(200, "text/html", HTML());
}

void handle_led1off() {
  Serial.println("LED1 OFF");
  led1_status = false;
  server.send(200, "text/html", HTML());
}

void handle_led2on() {
  Serial.println("LED2 ON");
  led2_status = true;
  server.send(200, "text/html", HTML());
}

void handle_led2off() {
  Serial.println("LED2 OFF");
  led2_status = false;
  server.send(200, "text/html", HTML());
}

void handle_led3on() {
  Serial.println("LED3 ON");
  led3_status = true;
  server.send(200, "text/html", HTML());
}

void handle_led3off() {
  Serial.println("LED3 OFF");
  led3_status = false;
  server.send(200, "text/html", HTML());
}

void handle_led4on() {
  Serial.println("LED4 ON");
  led4_status = true;
  server.send(200, "text/html", HTML());
}

void handle_led4off() {
  Serial.println("LED4 OFF");
  led4_status = false;
  server.send(200, "text/html", HTML());
}

void handle_NotFound() {
  server.send(404, "text/plain", "Not found");
}

String HTML() {
  String msg = "<!DOCTYPE html> <html>\n";
  msg += "<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\">\n";
  msg += "<title>LED Control</title>\n";
  msg += "<style>html{font-family:Helvetica; display:inline-block; margin:0px auto; text-align:center;}\n";
  msg += "body{margin-top: 50px;} h1{color: #444444; margin: 50px auto 30px;} h3{color:#444444; margin-bottom: 50px;}\n";
  msg += ".button{display:block; width:80px; background-color:#f48100; border:none; color:white; padding: 13px 30px; text-decoration:none; font-size:25px; margin: 0px auto 35px; cursor:pointer; border-radius:4px;}\n";
  msg += ".button-on{background-color:#f48100;}\n";
  msg += ".button-on:active{background-color:#f48100;}\n";
  msg += ".button-off{background-color:#26282d;}\n";
  msg += ".button-off:active{background-color:#26282d;}\n";
  msg += "</style>\n";
  msg += "</head>\n";
  msg += "<body>\n";
  msg += "<h1>ESP8266 Web Server</h1>\n";
  msg += "<h3>Using Station (STA) Mode</h3>\n";

  if (led1_status == false) {
    msg += "<p>LED1 Status: OFF</p><a class=\"button button-on\" href=\"/led1on\">ON</a>\n";
  } else {
    msg += "<p>LED1 Status: ON</p><a class=\"button button-off\" href=\"/led1off\">OFF</a>\n";
  }

  if (led2_status == false) {
    msg += "<p>LED2 Status: OFF</p><a class=\"button button-on\" href=\"/led2on\">ON</a>\n";
  } else {
    msg += "<p>LED2 Status: ON</p><a class=\"button button-off\" href=\"/led2off\">OFF</a>\n";
  }

  if (led3_status == false) {
    msg += "<p>LED3 Status: OFF</p><a class=\"button button-on\" href=\"/led3on\">ON</a>\n";
  } else {
    msg += "<p>LED3 Status: ON</p><a class=\"button button-off\" href=\"/led3off\">OFF</a>\n";
  }

  if (led4_status == false) {
    msg += "<p>LED4 Status: OFF</p><a class=\"button button-on\" href=\"/led4on\">ON</a>\n";
  } else {
    msg += "<p>LED4 Status: ON</p><a class=\"button button-off\" href=\"/led4off\">OFF</a>\n";
  }

  msg += "</body>\n";
  msg += "</html>\n";
  return msg;
}

You only have a single global variable named remTime which seems to be used by the millis() timing sections of your code. This will lead to interaction between the timing of each LED

may i have some advise?

The remTime variable holds the time that the blink started but you use the same variable for each of the LEDs

Use a different variable to hold the start time of each LED

tried but same outcome.

/*
   This code will configure ESP8266 in station mode and it will then act as a web server after connecting to a WiFi Router. It will then turn On/Off 4 LEDs as per input from the connected client
*/

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <FastLED.h>

#define NUM_LEDS 300
#define BRIGHTNESS 255
#define LED_TYPE WS2812
#define DATA_PIN 5

CRGB leds[NUM_LEDS];
unsigned long actTime = 0;
unsigned long remTime = 0;
unsigned long remTime2 = 0;

const unsigned long period = 1000;


/*Specifying the SSID and Password of the WiFi*/

const char *ssid = "Yukitson";
const char *password = "23062306";

//Specifying the Webserver instance to connect with HTTP Port: 80
ESP8266WebServer server(80);

//Specifying the boolean variables indicating the status of LED1 to LED4
bool led1_status = false, led2_status = false, led3_status = false, led4_status = false;

void setup() {
  FastLED.setMaxPowerInVoltsAndMilliamps(5, 1000);
  FastLED.addLeds<NEOPIXEL, DATA_PIN>(leds, NUM_LEDS);
  FastLED.setBrightness(BRIGHTNESS);
  //Starting the serial communication channel
  Serial.begin(115200);
  Serial.println();
  Serial.print("Connecting to ");
  Serial.print(ssid);

  //Connecting to the local WiFi network
  WiFi.begin(ssid, password);

  //Keep checking the WiFi status until it is connected to the wifi network

  while (WiFi.status() != WL_CONNECTED) {
    delay(100);
    Serial.print(".");
  }
  Serial.println("");
  Serial.print("WiFi Connected with IP Address: ");
  Serial.println(WiFi.localIP());

  //Specifying the functions which will be executed upon corresponding GET request from the client
  server.on("/", handle_OnConnect);
  server.on("/led1on", handle_led1on);
  server.on("/led1off", handle_led1off);
  server.on("/led2on", handle_led2on);
  server.on("/led2off", handle_led2off);
  server.on("/led3on", handle_led3on);
  server.on("/led3off", handle_led3off);
  server.on("/led4on", handle_led4on);
  server.on("/led4off", handle_led4off);
  server.onNotFound(handle_NotFound);

  //Starting the Server
  server.begin();
  Serial.println("HTTP Server Started");
}

bool is_red = false;

void loop() {

  if (WiFi.status() == WL_CONNECTED)  //Check if ESP8266 is still connected to the internet
  {
    //Assign the server to handle the clients
    server.handleClient();

    //Turn the LEDs ON/OFF as per their status set by the connected client

    //LED1
    if (led1_status == false) {
      fill_solid(leds, NUM_LEDS, CRGB::Black);
      FastLED.show();
    } else {

      actTime = millis();
      if (actTime - remTime >= period) {
        remTime = actTime;
        if (!is_red) {
          is_red = true;
          fill_solid(leds, NUM_LEDS, CRGB::Red);
          FastLED.show();
        } else {
          is_red = false;
          fill_solid(leds, NUM_LEDS, CRGB::Black);
          FastLED.show();
        }
      }
    }

    //LED2
    if (led2_status == false) {
      fill_solid(leds, NUM_LEDS, CRGB::Black);
      FastLED.show();
    } else {
      actTime = millis();
      if (actTime - remTime2 >= period) {
        remTime2 = actTime;
        if (!is_red) {
          is_red = true;
          fill_solid(leds, NUM_LEDS, CRGB::Blue);
          FastLED.show();
        } else {
          is_red = false;
          fill_solid(leds, NUM_LEDS, CRGB::Black);
          FastLED.show();
        }
      }
    }

    //LED3
    if (led3_status == false) {

    } else {

    }

    //LED4
    if (led4_status == false) {

    } else {

    }
  } else {
    Serial.println("WiFi Disconnected!!!");
    Serial.print("Trying to establish the connection...");

    //Keep checking the WiFi status until it is connected to the wifi network
    while (WiFi.status() != WL_CONNECTED) {
      delay(1000);
      Serial.print(".");
    }
    Serial.println("");
    Serial.print("WiFi Connected with IP Address: ");
    Serial.println(WiFi.localIP());
  }
}

void handle_OnConnect() {
  Serial.println("Client Connected");
  server.send(200, "text/html", HTML());
}

void handle_led1on() {
  Serial.println("LED1 ON");
  led1_status = true;
  is_red = false;
  server.send(200, "text/html", HTML());
}

void handle_led1off() {
  Serial.println("LED1 OFF");
  led1_status = false;
  server.send(200, "text/html", HTML());
}

void handle_led2on() {
  Serial.println("LED2 ON");
  led2_status = true;
  server.send(200, "text/html", HTML());
}

void handle_led2off() {
  Serial.println("LED2 OFF");
  led2_status = false;
  server.send(200, "text/html", HTML());
}

void handle_led3on() {
  Serial.println("LED3 ON");
  led3_status = true;
  server.send(200, "text/html", HTML());
}

void handle_led3off() {
  Serial.println("LED3 OFF");
  led3_status = false;
  server.send(200, "text/html", HTML());
}

void handle_led4on() {
  Serial.println("LED4 ON");
  led4_status = true;
  server.send(200, "text/html", HTML());
}

void handle_led4off() {
  Serial.println("LED4 OFF");
  led4_status = false;
  server.send(200, "text/html", HTML());
}

void handle_NotFound() {
  server.send(404, "text/plain", "Not found");
}

String HTML() {
  String msg = "<!DOCTYPE html> <html>\n";
  msg += "<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\">\n";
  msg += "<title>LED Control</title>\n";
  msg += "<style>html{font-family:Helvetica; display:inline-block; margin:0px auto; text-align:center;}\n";
  msg += "body{margin-top: 50px;} h1{color: #444444; margin: 50px auto 30px;} h3{color:#444444; margin-bottom: 50px;}\n";
  msg += ".button{display:block; width:80px; background-color:#f48100; border:none; color:white; padding: 13px 30px; text-decoration:none; font-size:25px; margin: 0px auto 35px; cursor:pointer; border-radius:4px;}\n";
  msg += ".button-on{background-color:#f48100;}\n";
  msg += ".button-on:active{background-color:#f48100;}\n";
  msg += ".button-off{background-color:#26282d;}\n";
  msg += ".button-off:active{background-color:#26282d;}\n";
  msg += "</style>\n";
  msg += "</head>\n";
  msg += "<body>\n";
  msg += "<h1>ESP8266 Web Server</h1>\n";
  msg += "<h3>Using Station (STA) Mode</h3>\n";

  if (led1_status == false) {
    msg += "<p>LED1 Status: OFF</p><a class=\"button button-on\" href=\"/led1on\">ON</a>\n";
  } else {
    msg += "<p>LED1 Status: ON</p><a class=\"button button-off\" href=\"/led1off\">OFF</a>\n";
  }

  if (led2_status == false) {
    msg += "<p>LED2 Status: OFF</p><a class=\"button button-on\" href=\"/led2on\">ON</a>\n";
  } else {
    msg += "<p>LED2 Status: ON</p><a class=\"button button-off\" href=\"/led2off\">OFF</a>\n";
  }

  if (led3_status == false) {
    msg += "<p>LED3 Status: OFF</p><a class=\"button button-on\" href=\"/led3on\">ON</a>\n";
  } else {
    msg += "<p>LED3 Status: ON</p><a class=\"button button-off\" href=\"/led3off\">OFF</a>\n";
  }

  if (led4_status == false) {
    msg += "<p>LED4 Status: OFF</p><a class=\"button button-on\" href=\"/led4on\">ON</a>\n";
  } else {
    msg += "<p>LED4 Status: ON</p><a class=\"button button-off\" href=\"/led4off\">OFF</a>\n";
  }

  msg += "</body>\n";
  msg += "</html>\n";
  return msg;
}

You have 4 buttons on your web page. Please explain what each of them should do. For instance, what should happen if 2 or more LED statuses are true at the same time ?

pls read my question on #1, please focus on LED1 and LED2 is ok.
LED3 and LED4 is empty.
I only copy LED1 <> LED2 but the LED arnormal.

I still don't know exactly what you are expecting the sketch to do

This mean that, when led1 button on is clicked, led1 will be blink with millis() as per below.

What should happen if 2 of the buttons are clicked ?

Good question, if both clicked on, the output seems nearly expect, but have little flashing.
normally, would not clicked on both.

I am still confused about what should happen when a single button is clicked. Please explain it in simple words.

If this not correct then please reply with a similar explanation

"When the first button is clicked the LEDs should flash briefly in red every second"

"When the second button is clicked the LEDs should flash briefly in blue every second"

For now, let's leave aside what should happen if two buttons are clicked

Exactly which ESP8266 board are you using ?
I ask because it seems unusual that you are using a pin number of 5 to control the LEDs. Which board have you got selected in the IDE ?

Let me try video later

「UKHeliBob via Arduino Forum <notifications@arduino.discoursemail.com>」在 2022年11月7日 週一,18:15 寫道:

Why do we need a video ?
Just describe what you want the sketch to do

ESP8266 broad

two buttons are clicked Not the point of my question.

My question is how to not delay when clicked on/off on the web.

Maybe my code is wrong, please give some hints.

My objective, clicked one of the button on/off to control DATAPIN 5,
when clicked on LED1, blink color red each second
when clicked off LED1, off

when clicked on LED2, blink color blue each second
when clicked off LED2, off

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.