Monsters, brievenbussen en andere onzin

A presentation at Domotica Grunn in September 2017 in Groningen, Netherlands by Niels Leenheer

Slide 1

Slide 1

monsters, brievenbussen en andere onzin

Slide 2

Slide 2

Slide 3

Slide 3

een nieuw huis

Slide 4

Slide 4

Slide 5

Slide 5

Slide 6

Slide 6

10 meter

Slide 7

Slide 7

het huis van de toekomst

Slide 8

Slide 8

Slide 9

Slide 9

Slide 10

Slide 10

433MHz

Slide 11

Slide 11

Slide 12

Slide 12

Slide 13

Slide 13

Slide 14

Slide 14

Slide 15

Slide 15

Slide 16

Slide 16

IoT is zo ongelofelijk saai

Slide 17

Slide 17

raspberry pi met domoticz

Slide 18

Slide 18

Slide 19

Slide 19

kippenverwarming

Slide 20

Slide 20

brrrr!

Slide 21

Slide 21

kippenwaterdrinkbak

Slide 22

Slide 22

kippenwaterdrinkbakverwarmingselement

Slide 23

Slide 23

kippenwaterdrinkbakverwarmingselementschakelaar

Slide 24

Slide 24

kippenwaterdrinkbakverwarmingselementschakelaarthermometer

Slide 25

Slide 25

Slide 26

Slide 26

rfxcom

Slide 27

Slide 27

elke 30 seconden een “ping” met de temperatuur

Slide 28

Slide 28

temperatuur onder nul → zet de verwarming aan

Slide 29

Slide 29

zet klikaanklikuit schakelaar aan

Slide 30

Slide 30

Slide 31

Slide 31

The “S” in IoT stands for security

Slide 32

Slide 32

Slide 33

Slide 33

de vurige heksenpot

Slide 34

Slide 34

Doe-het-zelf IoT

Slide 35

Slide 35

brains (oftewel microcontrollers)

Slide 36

Slide 36

Arduino Uno ATmega238 16 Mhz 2 KB RAM 32 KB Flash

Slide 37

Slide 37

ESP-01 ESP 8266 80 Mhz 128 KB RAM 512 KB Flash

Slide 38

Slide 38

NodeMCU ESP 8266 80 Mhz 128 KB RAM 4 MB Flash

Slide 39

Slide 39

NodeMCU

Slide 40

Slide 40

Neopixel 24 serieel geschakelde WS2812 RGB LEDs

Slide 41

Slide 41

#include <Adafruit_NeoPixel.h> #define PIN #define PIXELS D1 24 Adafruit_NeoPixel strip = Adafruit_NeoPixel(PIXELS, PIN, NEO_GRB + NEO_KHZ800); void setup(void) { strip.begin(); strip.setBrightness(255); strip.setPixelColor(0, strip.Color(0, 0, 255)); strip.show(); } void loop(void) { }

Slide 42

Slide 42

int i = 0; void setup(void) { strip.begin(); strip.setBrightness(255); } void loop(void) { i = (i + 1) % PIXELS; strip.setPixelColor(i % PIXELS, strip.Color(0, 0, 0)); strip.setPixelColor((i + 1) % PIXELS, strip.Color(0, 0, strip.setPixelColor((i + 2) % PIXELS, strip.Color(0, 0, strip.setPixelColor((i + 3) % PIXELS, strip.Color(0, 0, strip.setPixelColor((i + 4) % PIXELS, strip.Color(0, 0, strip.show(); delay(8); } 63)); 127)); 195)); 255));

Slide 43

Slide 43

?! JavaScript? En C? Zo’n beetje hetzelfde. Ongeveer. Niet helemaal. Nee.

Slide 44

Slide 44

IKEA SOMMAR 2017 theelichthouder

Slide 45

Slide 45

Slide 46

Slide 46

Slide 47

Slide 47

Slide 48

Slide 48

Slide 49

Slide 49

WiFi is vast heel moeilijk…

Slide 50

Slide 50

const char* ssid = “……..”; const char* password = “……..”; ESP8266WebServer server(80); void setup(void) { WiFi.begin(ssid, password); while (WiFi.status() != WL_CONNECTED) delay(500); server.on(“/on”, { server.send(200, “text/plain”, “on”); }); server.on(“/off”, { server.send(200, “text/plain”, “off”); }); server.begin(); } void loop(void) { server.handleClient(); }

Slide 51

Slide 51

http://sparkle.local/api?command=power&status command=power&on command=power&off command=brightness&status command=brightness&set=50 command=color&status command=color&set=f34d0d

Slide 52

Slide 52

homebridge homebridge-better-http-rgb

Slide 53

Slide 53

siri

Slide 54

Slide 54

?

Slide 55

Slide 55

espruino

Slide 56

Slide 56

Slide 57

Slide 57

pixel monsters

Slide 58

Slide 58

Prolight 12W plafondlamp

Slide 59

Slide 59

Slide 60

Slide 60

Neopixel 64 serieel geschakelde WS2812 RGB LEDs

Slide 61

Slide 61

Slide 62

Slide 62

SD card Opslag van monsters Lichtgevoelige weerstand Nachtstand Buzzer Piepjes voor een notificatie

Slide 63

Slide 63

Slide 64

Slide 64

Slide 65

Slide 65

Slide 66

Slide 66

Slide 67

Slide 67

Slide 68

Slide 68

Slide 69

Slide 69

Slide 70

Slide 70

Slide 71

Slide 71

kan ik het meenemen in een vliegtuig? ben je gek geworden? ja, geen probleem

Slide 72

Slide 72

Slide 73

Slide 73

progressive web app

Slide 74

Slide 74

http://pixel.local

Slide 75

Slide 75

http://pixel.local

Slide 76

Slide 76

Slide 77

Slide 77

editor.addEventListener(‘touchstart’, handleTouch); editor.addEventListener(‘touchmove’, handleTouch); function handleTouch(e) { for (var i = 0; i < e.changedTouches.length; i++) { let elem = document.elementFromPoint( e.changedTouches[i].pageX, e.changedTouches[i].pageY ); if (elem.tagName && elem.tagName == ‘TD’ && editor.contains(elem)) { drawPixel(elem); } } e.preventDefault(); }

Slide 78

Slide 78

editor.addEventListener(‘touchstart’, handleTouch); editor.addEventListener(‘touchmove’, handleTouch); function handleTouch(e) { for (var i = 0; i < e.changedTouches.length; i++) { let elem = document.elementFromPoint( e.changedTouches[i].pageX, e.changedTouches[i].pageY ); if (elem.tagName && elem.tagName == ‘TD’ && editor.contains(elem)) { drawPixel(elem); } } e.preventDefault(); }

Slide 79

Slide 79

let socket = new WebSocket( “ws://” + window.location.host + “/ws” ); function drawPixel(elem) { if (elem.dataset.color != currentColor) { elem.dataset.color = currentColor; elem.style.backgroundColor = ‘#’ + currentColor; socket.send(JSON.stringify({ command: “draw”, x: elem.dataset.x, y: elem.dataset.y, color: currentColor })); } }

Slide 80

Slide 80

let socket = new WebSocket( “ws://” + window.location.host + “/ws” ); function drawPixel(elem) { if (elem.dataset.color != currentColor) { elem.dataset.color = currentColor; elem.style.backgroundColor = ‘#’ + currentColor; socket.send(JSON.stringify({ command: “draw”, x: elem.dataset.x, y: elem.dataset.y, color: currentColor })); } }

Slide 81

Slide 81

{ “command”: “draw”, “x”: 5, “y”: 5, “color”: “ffffff” }

Slide 82

Slide 82

{ “command”: “draw”, “x”: 5, “y”: 5, “color”: “ffffff” }

Slide 83

Slide 83

Slide 84

Slide 84

Slide 85

Slide 85

Slide 86

Slide 86

socket.onmessage = function(msg) { let data = JSON.parse(msg.data); if (data.command == “draw”) { let elem = document.querySelector( ‘td[data-x=’ + data.x + ‘]’ + ‘[data-y=’ + data.y + ‘]’ ); elem.dataset.color = data.color; elem.style.backgroundColor = ‘#’ + data.color }; } }

Slide 87

Slide 87

socket.onmessage = function(msg) { let data = JSON.parse(msg.data); if (data.command == “draw”) { let elem = document.querySelector( ‘td[data-x=’ + data.x + ‘]’ + ‘[data-y=’ + data.y + ‘]’ ); elem.dataset.color = data.color; elem.style.backgroundColor = ‘#’ + data.color }; } }

Slide 88

Slide 88

demo

Slide 89

Slide 89

het mysterie van de spookbrievenbus

Slide 90

Slide 90

brieven bus

Slide 91

Slide 91

magneetcontact

Slide 92

Slide 92

bij openen van de deksel een signaal

Slide 93

Slide 93

http://pixel.local/api?command=notify&icon=mailbox

Slide 94

Slide 94

Slide 95

Slide 95

Slide 96

Slide 96

Slide 97

Slide 97

magneetcontact combineren met een bewegingsdetector? oplossing #1

Slide 98

Slide 98

magneetcontact uitzetten bij harde westenwind? oplossing #2

Slide 99

Slide 99

oplossing #3

Slide 100

Slide 100

de wispelturige wasmachine

Slide 101

Slide 101

Slide 102

Slide 102

Slide 103

Slide 103

Begin programma 24,9 watt Wasmachine uit 0,3 watt Standby verbruik 4,6 watt

Slide 104

Slide 104

Slide 105

Slide 105

De was is klaar!

Slide 106

Slide 106

De was is klaar! De was is klaar! De was is klaar! De was is klaar!

Slide 107

Slide 107

Slide 108

Slide 108

2000 watt

Slide 109

Slide 109

20 - 200 watt

Slide 110

Slide 110

2 - 5 watt

Slide 111

Slide 111

De was is klaar! De was is klaar! De was is klaar! De was is klaar!

Slide 112

Slide 112

Slide 113

Slide 113

commandArray = {} if (uservariables[‘WasmachineBezig’] == 2) then s = uservariables_lastupdate[‘WasmachineBezig’] lastUpdate = os.time{ year=string.sub(s, 1, 4), month=string.sub(s, 6, 7), day=string.sub(s, 9, 10), hour=string.sub(s, 12, 13), min=string.sub(s, 15, 16), sec=string.sub(s, 18, 19) } difference = os.difftime (os.time(), lastUpdate) if (difference > 300) then commandArray[‘Variable:WasmachineBezig’] = ‘0’ commandArray[‘OpenURL’] = ‘pixel.local/api?command=notify&icon=shirt’ end end return commandArray

Slide 114

Slide 114

De was is klaar!

Slide 115

Slide 115

Slide 116

Slide 116

Slide 117

Slide 117

bedankt! vragen? @html5test