phptuts/Instructions.md

## arduino.ino
#include <WiFi.h>
#include <WebServer.h>
#include <WebSocketsServer.h>

const char* ssid = "Noisebridge";
const char* password = "noisebridge";

const int irSensorPin = 13;
bool objectDetected = false;

const char index_html[] PROGMEM = R"rawliteral(
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Intruder Alert</title>
  <style>
    body { font-family: sans-serif; text-align: center; padding-top: 50px; background: #111; color: white; }
    h1 { font-size: 3em; }
    .flashing { animation: flash 1s infinite; }
    @keyframes flash {
      0% { color: red; }
      50% { color: yellow; }
      100% { color: red; }
    }
  </style>
</head>
<body>
  <h1 id="alert">System Armed</h1>
  <button id="enableSpeech" style="font-size: 1.5em; padding: 10px;">🗣️ Enable Voice Alerts</button>
  <script>
    const alertText = document.getElementById('alert');
    const siren = document.getElementById('siren');
    const ws = new WebSocket(`ws://${location.hostname}:81`);
    let lastState = "";
    let speechEnabled = false;

    document.getElementById('enableSpeech').addEventListener('click', () => {
      speechEnabled = true;
      document.getElementById('enableSpeech').style.display = 'none';

      // Prime the speech engine with a silent utterance
      const u = new SpeechSynthesisUtterance(" ");
      speechSynthesis.speak(u);
    });
    function speak(text) {
      if (!speechEnabled) return;
      const utterance = new SpeechSynthesisUtterance(text);
      speechSynthesis.cancel();
      speechSynthesis.speak(utterance);
    }

    ws.onmessage = event => {
      const msg = event.data;
      if (msg.includes("Object detected")) {
        if (lastState !== "detected") {
          alertText.textContent = "🚨 Intruder Alert! 🚨";
          alertText.classList.add("flashing");
          speak("Intruder Alert");
          siren.play();
          lastState = "detected";
        }
      } else {
        if (lastState !== "clear") {
          alertText.textContent = "✅ All Clear";
          alertText.classList.remove("flashing");
          alertText.style.color = "green";
          speak("All clear");
          siren.pause();
          siren.currentTime = 0;
          lastState = "clear";
        }
      }
    };
  </script>
</body>
</html>
)rawliteral";

WebServer server(80);
WebSocketsServer webSocket = WebSocketsServer(81);

void sendToClients(const char* msg) {
  webSocket.broadcastTXT(msg);
}

void handleRoot() {
  server.send(200, "text/html", index_html);
}

void setup() {
  Serial.begin(115200);
  pinMode(irSensorPin, INPUT);

  WiFi.begin(ssid, password);
  Serial.print("Connecting to WiFi");
  while (WiFi.status() != WL_CONNECTED) {
    delay(500); Serial.print(".");
  }
  Serial.println("\nConnected! IP address: ");
  Serial.println(WiFi.localIP());

  server.on("/", handleRoot);
  server.begin();
  webSocket.begin();
  webSocket.onEvent([](uint8_t, WStype_t, uint8_t*, size_t) {});
}

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

  bool current = digitalRead(irSensorPin) == LOW;
  if (current != objectDetected) {
    objectDetected = current;
    if (objectDetected) {
      sendToClients("Object detected!");
    } else {
      sendToClients("Object removed.");
    }
  }

  delay(100);
}

## Instructions.md

      
    Raw
  

              Instructions.md
            
          
    Install Required library


WiFi


WebServer


WebSocketsServer


Install Espressif Boards


Wiring:


D13 for the out pin
VCC -> 3.3 V
GND to GND

Challenge


Change the sound or the website
Wire an ultrasonic sensor and sense the distance
Do something funny
	#include <WiFi.h>
	#include <WebServer.h>
	#include <WebSocketsServer.h>

	const char* ssid = "Noisebridge";
	const char* password = "noisebridge";

	const int irSensorPin = 13;
	bool objectDetected = false;

	const char index_html[] PROGMEM = R"rawliteral(
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>Intruder Alert</title>
	<style>
	body { font-family: sans-serif; text-align: center; padding-top: 50px; background: #111; color: white; }
	h1 { font-size: 3em; }
	.flashing { animation: flash 1s infinite; }
	@keyframes flash {
	0% { color: red; }
	50% { color: yellow; }
	100% { color: red; }
	}
	</style>
	</head>
	<body>
	<h1 id="alert">System Armed</h1>
	<button id="enableSpeech" style="font-size: 1.5em; padding: 10px;">🗣️ Enable Voice Alerts</button>
	<script>
	const alertText = document.getElementById('alert');
	const siren = document.getElementById('siren');
	const ws = new WebSocket(`ws://${location.hostname}:81`);
	let lastState = "";
	let speechEnabled = false;

	document.getElementById('enableSpeech').addEventListener('click', () => {
	speechEnabled = true;
	document.getElementById('enableSpeech').style.display = 'none';

	// Prime the speech engine with a silent utterance
	const u = new SpeechSynthesisUtterance(" ");
	speechSynthesis.speak(u);
	});
	function speak(text) {
	if (!speechEnabled) return;
	const utterance = new SpeechSynthesisUtterance(text);
	speechSynthesis.cancel();
	speechSynthesis.speak(utterance);
	}

	ws.onmessage = event => {
	const msg = event.data;
	if (msg.includes("Object detected")) {
	if (lastState !== "detected") {
	alertText.textContent = "🚨 Intruder Alert! 🚨";
	alertText.classList.add("flashing");
	speak("Intruder Alert");
	siren.play();
	lastState = "detected";
	}
	} else {
	if (lastState !== "clear") {
	alertText.textContent = "✅ All Clear";
	alertText.classList.remove("flashing");
	alertText.style.color = "green";
	speak("All clear");
	siren.pause();
	siren.currentTime = 0;
	lastState = "clear";
	}
	}
	};
	</script>
	</body>
	</html>
	)rawliteral";

	WebServer server(80);
	WebSocketsServer webSocket = WebSocketsServer(81);

	void sendToClients(const char* msg) {
	webSocket.broadcastTXT(msg);
	}

	void handleRoot() {
	server.send(200, "text/html", index_html);
	}

	void setup() {
	Serial.begin(115200);
	pinMode(irSensorPin, INPUT);

	WiFi.begin(ssid, password);
	Serial.print("Connecting to WiFi");
	while (WiFi.status() != WL_CONNECTED) {
	delay(500); Serial.print(".");
	}
	Serial.println("\nConnected! IP address: ");
	Serial.println(WiFi.localIP());

	server.on("/", handleRoot);
	server.begin();
	webSocket.begin();
	webSocket.onEvent([](uint8_t, WStype_t, uint8_t*, size_t) {});
	}

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

	bool current = digitalRead(irSensorPin) == LOW;
	if (current != objectDetected) {
	objectDetected = current;
	if (objectDetected) {
	sendToClients("Object detected!");
	} else {
	sendToClients("Object removed.");
	}
	}

	delay(100);
	}
No results found