สร้างระบบตั้งเวลาเปิด-ปิดอุปกรณ์ด้วย ESP32 Web Server

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

// ==================== การตั้งค่า WiFi ====================
const char* ssid = "YOUR_WIFI_SSID";        // แก้ไขเป็น WiFi ของคุณ
const char* password = "YOUR_WIFI_PASSWORD"; // แก้ไขเป็นรหัสผ่าน WiFi

// ==================== การตั้งค่า Hardware ====================
const int RELAY_PIN = 26;  // GPIO ที่ต่อกับ Relay
const int LED_PIN = 2;     // ในบอร์ด LED (สำหรับทดสอบ)

// ==================== การตั้งค่า Web Server ====================
WebServer server(80);

// ==================== การตั้งค่า Timer ====================
struct Timer {
    int hour;
    int minute;
    bool action;  // true = เปิด, false = ปิด
    bool enabled;
};

#define MAX_TIMERS 8
Timer timers[MAX_TIMERS] = {
    {6, 0, true, true},    // เปิดเวลา 06:00
    {18, 0, false, true},  // ปิดเวลา 18:00
    {7, 30, true, false},  // Timer ที่ 3 (ปิดใช้งาน)
    {0, 0, false, false},
    {0, 0, false, false},
    {0, 0, false, false},
    {0, 0, false, false},
    {0, 0, false, false}
};

bool relayState = false;
bool manualOverride = false;
unsigned long lastCheckTime = 0;
const unsigned long CHECK_INTERVAL = 60000; // ตรวจสอบทุก 1 นาที

// ==================== ฟังก์ชันตั้งค่าเริ่มต้น ====================
void setup() {
    Serial.begin(115200);
    delay(1000);
    
    // ตั้งค่า Pin
    pinMode(RELAY_PIN, OUTPUT);
    pinMode(LED_PIN, OUTPUT);
    digitalWrite(RELAY_PIN, LOW);
    digitalWrite(LED_PIN, LOW);
    
    // เชื่อมต่อ WiFi
    Serial.println("\n\nเชื่อมต่อ WiFi...");
    WiFi.begin(ssid, password);
    
    int attempts = 0;
    while (WiFi.status() != WL_CONNECTED && attempts < 20) {
        delay(500);
        Serial.print(".");
        attempts++;
    }
    
    if (WiFi.status() == WL_CONNECTED) {
        Serial.println("\n✅ WiFi เชื่อมต่อสำเร็จ!");
        Serial.print("🌐 IP Address: ");
        Serial.println(WiFi.localIP());
        
        // แสดงใน Serial Monitor
        Serial.println("🔗 เปิดหน้าเว็บ: http://" + WiFi.localIP().toString());
    } else {
        Serial.println("\n❌ ไม่สามารถเชื่อมต่อ WiFi ได้");
    }
    
    // ตั้งค่า NTP Time (เวลาอินเทอร์เน็ต)
    configTime(7 * 3600, 0, "pool.ntp.org", "time.nist.gov");
    Serial.println("⏰ กำลังตั้งเวลาจากเซิร์ฟเวอร์ NTP...");
    
    // ตั้งค่า Web Server
    setupWebServer();
    
    Serial.println("✅ พร้อมใช้งาน!");
}

// ==================== ฟังก์ชันหลัก ====================
void loop() {
    server.handleClient();
    
    // ตรวจสอบ Timer ทุก 1 นาที
    unsigned long currentTime = millis();
    if (currentTime - lastCheckTime >= CHECK_INTERVAL) {
        lastCheckTime = currentTime;
        checkTimers();
    }
    
    delay(10);
}

// ==================== ฟังก์ชันตรวจสอบ Timer ====================
void checkTimers() {
    struct tm timeinfo;
    if (!getLocalTime(&timeinfo)) {
        Serial.println("❌ ไม่สามารถรับเวลาได้");
        return;
    }
    
    int currentHour = timeinfo.tm_hour;
    int currentMinute = timeinfo.tm_min;
    
    // ตรวจสอบทุก Timer
    for (int i = 0; i < MAX_TIMERS; i++) {
        if (timers[i].enabled && 
            timers[i].hour == currentHour && 
            timers[i].minute == currentMinute) {
            
            // ทำการเปิด/ปิด Relay
            setRelay(timers[i].action);
            Serial.printf("⏰ Timer %d: %s\n", i + 1, timers[i].action ? "เปิด" : "ปิด");
        }
    }
}

// ==================== ฟังก์ชันควบคุม Relay ====================
void setRelay(bool state) {
    relayState = state;
    digitalWrite(RELAY_PIN, state ? HIGH : LOW);
    digitalWrite(LED_PIN, state ? HIGH : LOW);
    manualOverride = true;
}

// ==================== ฟังก์ชันตั้งค่า Web Server ====================
void setupWebServer() {
    // หน้าหลัก
    server.on("/", []() {
        String html = generateWebPage();
        server.send(200, "text/html", html);
    });
    
    // API: อัปเดต Timer
    server.on("/api/timer", HTTP_POST, []() {
        if (server.hasArg("index") && server.hasArg("hour") && 
            server.hasArg("minute") && server.hasArg("action")) {
            
            int index = server.arg("index").toInt();
            timers[index].hour = server.arg("hour").toInt();
            timers[index].minute = server.arg("minute").toInt();
            timers[index].action = server.arg("action") == "1";
            timers[index].enabled = server.hasArg("enabled") ? 
                server.arg("enabled") == "1" : true;
            
            server.send(200, "application/json", "{\"status\":\"ok\"}");
        } else {
            server.send(400, "application/json", "{\"status\":\"error\"}");
        }
    });
    
    // API: เปิด/ปิด Relay แบบ Manual
    server.on("/api/relay", HTTP_POST, []() {
        bool state = server.arg("state") == "1";
        setRelay(state);
        server.send(200, "application/json", "{\"status\":\"ok\"}");
    });
    
    // API: ดึงสถานะ
    server.on("/api/status", HTTP_GET, []() {
        struct tm timeinfo;
        getLocalTime(&timeinfo);
        
        String json = "{";
        json += "\"relay\":" + String(relayState ? "true" : "false") + ",";
        json += "\"hour\":" + String(timeinfo.tm_hour) + ",";
        json += "\"minute\":" + String(timeinfo.tm_min) + ",";
        json += "\"second\":" + String(timeinfo.tm_sec) + ",";
        json += "\"timers\":[";
        
        for (int i = 0; i < MAX_TIMERS; i++) {
            if (i > 0) json += ",";
            json += "{";
            json += "\"hour\":" + String(timers[i].hour) + ",";
            json += "\"minute\":" + String(timers[i].minute) + ",";
            json += "\"action\":" + String(timers[i].action ? "true" : "false") + ",";
            json += "\"enabled\":" + String(timers[i].enabled ? "true" : "false");
            json += "}";
        }
        json += "]}";
        
        server.send(200, "application/json", json);
    });
    
    server.begin();
    Serial.println("🌐 Web Server เริ่มทำงานแล้ว");
}

// ==================== สร้างหน้าเว็บ ====================
String generateWebPage() {
    struct tm timeinfo;
    getLocalTime(&timeinfo);
    
    String html = "<!DOCTYPE html>";
    html += "<html lang='th'>";
    html += "<head>";
    html += "<meta charset='UTF-8'>";
    html += "<meta name='viewport' content='width=device-width, initial-scale=1.0'>";
    html += "<title>ESP32 Power Timer</title>";
    html += "<style>";
    html += "body{font-family:sarabun,sans-serif;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;margin:0;padding:20px}";
    html += ".container{max-width:800px;margin:0 auto;background:white;border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,0.3);padding:30px}";
    html += "h1{text-align:center;color:#333;margin-bottom:10px}";
    html += ".status{text-align:center;font-size:24px;margin-bottom:30px;padding:15px;border-radius:10px}";
    html += ".status.on{background:#4ade80;color:white}";
    html += ".status.off{background:#f87171;color:white}";
    html += ".time{text-align:center;font-size:18px;color:#666;margin-bottom:20px}";
    html += ".timer{background:#f9fafb;padding:15px;border-radius:10px;margin-bottom:10px;border-left:4px solid #667eea}";
    html += ".timer h3{margin:0 0 10px 0;color:#333}";
    html += ".timer-controls{display:flex;gap:10px;align-items:center}";
    html += "input[type='number']{width:60px;padding:8px;border:1px solid #ddd;border-radius:5px}";
    html += "button{padding:10px 20px;border:none;border-radius:5px;cursor:pointer;font-weight:bold;transition:all 0.3s}";
    html += ".btn-primary{background:#667eea;color:white}";
    html += ".btn-primary:hover{background:#5568d3}";
    html += ".btn-danger{background:#f87171;color:white}";
    html += ".btn-success{background:#4ade80;color:white}";
    html += ".toggle{position:relative;display:inline-block;width:50px;height:26px}";
    html += ".toggle input{opacity:0;width:0;height:0}";
    html += ".slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s;border-radius:26px}";
    html += ".slider:before{position:absolute;content:'';height:20px;width:20px;left:3px;bottom:3px;background-color:white;transition:.4s;border-radius:50%}";
    html += "input:checked+.slider{background-color:#667eea}";
    html += "input:checked+.slider:before{transform:translateX(24px)}";
    html += "</style>";
    html += "</head>";
    html += "<body>";
    html += "<div class='container'>";
    html += "<h1>⏰ ระบบตั้งเวลา ESP32</h1>";
    
    // สถานะ Relay
    html += "<div class='status " + String(relayState ? "on" : "off") + "'>";
    html += relayState ? "🔌 สถานะ: เปิดอยู่" : "🔌 สถานะ: ปิดอยู่";
    html += "</div>";
    
    // เวลาปัจจุบัน
    html += "<div class='time'>";
    html += "🕐 เวลา: " + String(timeinfo.tm_hour) + ":" + 
            String(timeinfo.tm_min) + ":" + String(timeinfo.tm_sec);
    html += "</div>";
    
    // ปุ่มเปิด/ปิด Manual
    html += "<div style='text-align:center;margin-bottom:30px'>";
    html += "<button class='btn-primary' onclick='toggleRelay()'>เปิด/ปิด แบบ Manual</button>";
    html += "</div>";
    
    // รายการ Timer
    html += "<h2 style='color:#333;margin-bottom:20px'>📋 รายการ Timer</h2>";
    
    for (int i = 0; i < MAX_TIMERS; i++) {
        html += "<div class='timer'>";
        html += "<h3>Timer " + String(i + 1) + "</h3>";
        html += "<div class='timer-controls'>";
        html += "<input type='number' id='hour" + String(i) + "' value='" + 
                String(timers[i].hour) + "' min='0' max='23' placeholder='ชม.'>";
        html += "<span>:</span>";
        html += "<input type='number' id='minute" + String(i) + "' value='" + 
                String(timers[i].minute) + "' min='0' max='59' placeholder='นาที'>";
        html += "<label class='toggle'>";
        html += "<input type='checkbox' id='enabled" + String(i) + "' " + 
                String(timers[i].enabled ? "checked" : "") + " onchange='toggleTimer(" + String(i) + ")'>";
        html += "<span class='slider'></span>";
        html += "</label>";
        html += "<button class='btn-success' onclick='saveTimer(" + String(i) + ")'>บันทึก</button>";
        html += "</div>";
        html += "</div>";
    }
    
    html += "</div>";
    html += "<script>";
    html += "function toggleRelay(){";
    html += "  fetch('/api/relay', {method: 'POST', headers: {'Content-Type': 'application/x-www-form-urlencoded'}, body: 'state=' + (relayState ? '0' : '1')}).then(()=>location.reload());";
    html += "}";
    html += "function saveTimer(index){";
    html += "  const hour = document.getElementById('hour' + index).value;";
    html += "  const minute = document.getElementById('minute' + index).value;";
    html += "  const enabled = document.getElementById('enabled' + index).checked;";
    html += "  fetch('/api/timer', {method: 'POST', headers: {'Content-Type': 'application/x-www-form-urlencoded'}, body: 'index=' + index + '&hour=' + hour + '&minute=' + minute + '&action=1&enabled=' + (enabled ? '1' : '0')}).then(()=>location.reload());";
    html += "}";
    html += "setInterval(()=>location.reload(), 60000);"; // รีโหลดทุก 1 นาที
    html += "</script>";
    html += "</body>";
    html += "</html>";
    
    return html;
}