Wokwi - Online ESP32, STM32, Arduino Simulator

#include <WiFi.h>
#include <WebServer.h>

const char* ssid = "Coco Meme"; // Change the SSID
const char* password = "kokodayo44444"; // Change the Password

WebServer server(80);

void handleRoot() {
  String webpage = "<!DOCTYPE html><html><head><title>Entry and Exit Counts</title>";
  webpage += "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">";
  webpage += "<style>";
  webpage += "body { text-align:center; background-color: #f2f2f2; font-family: Arial, sans-serif; }";
  webpage += ".card { background-color: white; padding: 20px; background-color: #36454F; border-radius: 10px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); }";
  webpage += ".card2 { background-color: white; padding: 20px; background-color: #4F4036; border-radius: 10px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); margin-bottom: 20px; }";
  webpage += ".button { margin: 5px; padding: 10px 20px; border: none; border-radius: 5px; font-size: 16px; cursor: pointer; display: flex; align-items: center; justify-content: center; min-width: 150px; background-color: #2ca02c; color: white; transition: background-color 0.3s ease; }";
  webpage += ".rotate-button { background-color: #ff7f0e; }";
  webpage += ".capture-button { background-color: #1f77b4; }";
  webpage += ".save-button { background-color: #4F4036; }";
  webpage += ".refresh-button { background-color: #d62728; }";
  webpage += ".button .icon { margin-right: 10px; }";
  webpage += ".button:hover { background-color: #218c21; }";
  webpage += "</style>";
  webpage += "</head><body>";
  webpage += "<div class=\"card\">";
  webpage += "<div class=\"card2\">";
  webpage += "<h2>Arduino-Based Biometric Attendance System</h2>";
  webpage += "<p>Group 7</p>";
  webpage += "<p>Members:</p>";
  webpage += "<p>Gwyn S. Barte</p>";
  webpage += "<p>Jhon Ludwig C. Gayapa</p>";
  webpage += "<p>Kristine Mae P. Prado</p>";
  webpage += "<p>" + String(ssid) + "</p>";
  webpage += "</div>";
  webpage += "</div>";
  webpage += "<br>";
  webpage += "<div class=\"card\">";
  webpage += "<h2>ESP32-CAM Attendance System</h2>";
  webpage += "<p>Online room attendance counter and fingerprint status display</p>";
  webpage += "<div class=\"card2\">";
  webpage += "<h2>Online Attendance Counter</h2>";
  webpage += "<p>Number of Entry: <span id=\"entryCount\"></span></p>";
  webpage += "<p>Number of Exit: <span id=\"exitCount\"></span></p>";
  webpage += "</div>";
  webpage += "<div style=\"height: 20px;\"></div>";
  webpage += "<div class=\"card2\">";
  webpage += "<h2>Fingerprint Status</h2>";
  webpage += "<p>Status: <span id=\"fingerprintStatus\"></span></p>";
  webpage += "</div>";
  webpage += "</body></html>";

  server.send(200, "text/html", webpage);
}

void setup() {
  Serial.begin(9600);
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.println("Connecting to WiFi...");
  }
  Serial.println("WiFi connected");
  Serial.print("IP Address: ");
  Serial.println(WiFi.localIP());

  server.on("/", HTTP_GET, handleRoot);
  server.begin();
  Serial.println("HTTP server started");
}

void loop() {
  server.handleClient();
}