ESP32 OLED Weather Clock

// ESP32 OLED Weather Clock - Advanced (3-page + web forecast + WiFiManager + MQTT)
#include <Wire.h>
#include <Adafruit_SSD1306.h>
#include <WiFiManager.h>
#include <HTTPClient.h>
#include <ArduinoJson.h>
#include <PubSubClient.h>
#include <WebServer.h>
#include <time.h>

Adafruit_SSD1306 oled(128,64,&Wire,-1);
WiFiClient wifiClient;
PubSubClient mqtt(wifiClient);
WebServer server(80);

const char* OWM_KEY="YourKey";
const char* CITY="London,GB";
const char* MQTT_HOST="192.168.1.100";
const char* MQTT_TOPIC="weather/shared";

float temp=0,feels=0,humidity=0,wind=0;
String desc="--";
String forecastJson="{}";
int page=0;
unsigned long lastFetch=0;

void fetchAll(){
  HTTPClient http;
  // Current weather
  http.begin(String("http://api.openweathermap.org/data/2.5/weather?q=")+CITY+"&units=metric&appid="+OWM_KEY);
  if(http.GET()==200){
    StaticJsonDocument<1024> doc;
    deserializeJson(doc,http.getString());
    temp=doc["main"]["temp"]; feels=doc["main"]["feels_like"];
    humidity=doc["main"]["humidity"]; wind=doc["wind"]["speed"];
    desc=doc["weather"][0]["description"].as<String>();
    // Share over MQTT
    char buf[256]; serializeJson(doc,buf);
    mqtt.publish(MQTT_TOPIC,buf);
  }
  http.end();
  // 7-day forecast
  http.begin(String("http://api.openweathermap.org/data/2.5/forecast?q=")+CITY+"&cnt=7&units=metric&appid="+OWM_KEY);
  if(http.GET()==200) forecastJson=http.getString();
  http.end();
}

void serveForecast(){
  StaticJsonDocument<2048> doc;
  deserializeJson(doc,forecastJson);
  String body="<h2>7-Day Forecast</h2><canvas id=c width=600 height=200></canvas>"
    "<script>var d=[";
  for(auto& item:doc["list"].as<JsonArray>()){
    body+=String((float)item["main"]["temp"])+",";
  }
  body+="];"
    "var ctx=document.getElementById("c").getContext("2d");"
    "ctx.beginPath();"
    "d.forEach((v,i)=>ctx.lineTo(i*(600/d.length),200-v*3));"
    "ctx.stroke();</script>";
  server.send(200,"text/html",body);
}

void showPage(){
  oled.clearDisplay(); oled.setTextSize(1);
  if(page==0){
    // Clock
    struct tm ti; getLocalTime(&ti);
    oled.setTextSize(2); oled.setCursor(8,5);
    oled.printf("%02d:%02d",ti.tm_hour,ti.tm_min);
    oled.setTextSize(1); oled.setCursor(0,36);
    char buf[24]; strftime(buf,24,"%a %d %b %Y",&ti); oled.println(buf);
  } else if(page==1){
    // Current weather
    oled.printf("%.1fC (feels %.1fC)n",temp,feels);
    oled.printf("Hum:%.0f%% Wind:%.1fm/sn",humidity,wind);
    oled.println(desc.substring(0,21));
  } else {
    // Forecast hint
    oled.println("Forecast at:");
    oled.println(WiFi.localIP().toString());
    oled.println("/forecast");
  }
  oled.display();
}

void setup(){
  Serial.begin(115200);
  Wire.begin(21,22);
  oled.begin(SSD1306_SWITCHCAPVCC,0x3C);
  oled.setTextColor(WHITE);
  oled.clearDisplay(); oled.setCursor(0,0);
  oled.println("Starting..."); oled.display();

  WiFiManager wm;
  wm.autoConnect("ESP32-WeatherClock");

  configTime(0,0,"pool.ntp.org");
  struct tm ti; while(!getLocalTime(&ti)) delay(500);

  mqtt.setServer(MQTT_HOST,1883);
  server.on("/forecast",serveForecast);
  server.begin();

  fetchAll(); lastFetch=millis();
  pinMode(0,INPUT_PULLUP);
}

void loop(){
  server.handleClient();
  if(!mqtt.connected()) mqtt.connect("ESP32Clock");
  mqtt.loop();
  if(digitalRead(0)==LOW){ page=(page+1)%3; delay(200); }
  static unsigned long ls=0;
  if(millis()-ls>5000){ page=(page+1)%3; ls=millis(); }
  if(millis()-lastFetch>600000){ fetchAll(); lastFetch=millis(); }
  showPage();
  delay(1000);
}