#include <WiFi.h>
#include "AsyncTCP.h"
#include "ESPAsyncWebSrv.h"
#include <Adafruit_MPU6050.h>
#include <Adafruit_Sensor.h>
int x;
int y;
int z;
Adafruit_MPU6050 mpu;
const char* ssid = "Wokwi-GUEST";
const char* password = "";
AsyncWebServer server(80);
AsyncEventSource events("/events");
const char index_html[] PROGMEM = R"rawliteral(
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
body {
margin: 0;
display: flex;
height: 100vh;
justify-content: center;
align-items: center;
}
:root {
--size: 100px;
}
.perspective {
position: relative;
perspective: 800px;
perspective-origin: 50% -200px;
}
.box {
width: var(--size);
aspect-ratio: 1;
position: relative;
transform-style: preserve-3d;
transform-origin: 50px bottom -50px;
}
.face {
position: absolute;
width: var(--size);
aspect-ratio: 1;
background-color: hsl(
120,
65%,
var(--lightness)
);
}
.face.front {
--lightness: 66%;
}
.face.bottom {
--lightness: 74%;
top: 100%;
transform-origin: top;
transform: rotateX(-90deg);
}
.face.top {
--lightness: 74%;
bottom: 100%;
transform-origin: bottom;
transform: rotateX(90deg);
}
.face.back {
--lightness: 78%;
bottom: 200%;
transform-origin: center 150px -50px;
transform: rotateX(180deg);
}
.face.right {
--lightness: 70%;
left: 100%;
transform-origin: left;
transform: rotateY(90deg);
}
.face.left {
--lightness: 70%;
right: 100%;
transform-origin: right;
transform: rotateY(-90deg);
}
</style>
</head>
<body >
<div class="perspective">
<div class="box" id="caixa">
<div class="face top"></div>
<div class="face bottom"></div>
<div class="face back"></div>
<div class="face front"></div>
<div class="face left"></div>
<div class="face right"></div>
</div>
</div>
<script>
setInterval(function ( ) {
const reqY= new XMLHttpRequest();
reqY.onreadystatechange = function(){
document.getElementById("caixa").style.transform = "rotateY("+reqY.responseText+"deg)";
}
reqY.open('GET','/y',true);
reqY.send();
}, 60) ;
</script>
</body>
</html>)rawliteral";
void setup() {
Serial.begin(115200);
if (!mpu.begin()) {
Serial.println("Erro! Sensor MPU6050 não encontrado.");
while (1)
yield();
}
mpu.setAccelerometerRange(MPU6050_RANGE_8_G);
mpu.setGyroRange(MPU6050_RANGE_500_DEG);
mpu.setFilterBandwidth(MPU6050_BAND_21_HZ);
Serial.println("Sensor MPU6050 encontrado.");
WiFi.mode(WIFI_STA);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(1000);
Serial.println("Connecting to WiFi..");
}
Serial.println();
Serial.print("IP Address: ");
Serial.println(WiFi.localIP());
server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
request->send_P(200, "text/html", index_html);
});
events.onConnect([](AsyncEventSourceClient *client){
if(client->lastId()){
Serial.println("Client reconnected! Last message ID that it got is: %u\n");
}
client->send("hello!", NULL, millis(), 10000);
});
delay(500); // Pause for 2 seconds
server.on("/y", HTTP_GET, [](AsyncWebServerRequest *request){
request->send_P(200, "text/plain", String(y).c_str());
});
server.addHandler(&events);
server.begin();
}
void loop() {
sensors_event_t a, g, temp;
mpu.getEvent(&a, &g, &temp);
Serial.print("Acelerômetro: ");
x = (180*((a.acceleration.x+19)/19.6))+6;
y = (180*((a.acceleration.y+19)/19.6))+6;
z = (180*((a.acceleration.z+19)/19.6))+6;
Serial.print(" X:");
Serial.print(x);
Serial.print(" Y:");
Serial.print(y);
Serial.print(" Z:");
Serial.print(z);
Serial.println(" ");
delay(45);
}