/plafondlamp.html
Last active Dec 3, 2016
Plafondlamp
| <!-- http://blog.crutzen.eu/?p=822 --> | |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src="http://cdn.jsdelivr.net/timepicker.js/latest/timepicker.min.js"></script> | |
| <link href="http://cdn.jsdelivr.net/timepicker.js/latest/timepicker.min.css" rel="stylesheet"/> | |
| <style> | |
| body { | |
| margin: 2em; | |
| } | |
| #colorpicker { | |
| height: 5em; | |
| width: 5em; | |
| padding: 0; | |
| display: none; | |
| } | |
| #time { | |
| display: none; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <h1>Plafondlamp</h1> | |
| <h2>Kleur</h2> | |
| <select id="mode" onchange="changeMode()"> | |
| <option value="auto">Regenboog | |
| <option value="disco">Disco | |
| <option value="select">Kies een kleur | |
| <option value="sleep">Inslapen | |
| </select> | |
| <br> | |
| <input id="colorpicker" type="color" value="#000000" onchange="showColor(this.value)" /> | |
| <h2>Wekker</h2> | |
| <input type="checkbox" name="alarm" onchange="changeAlarm(this.checked)"/>Aan<br /> | |
| <input id="time" type="text" placeholder="Klik hier"> | |
| <script type="text/javascript"> | |
| function showColor(newColor) { | |
| sendToParticle('sendcolor', newColor) | |
| } | |
| function changeMode() { | |
| var mode = document.getElementById("mode").value; | |
| if (mode == "auto") { | |
| document.getElementById("colorpicker").style.display = "none"; | |
| sendToParticle('sendmode', 'auto'); | |
| } | |
| else if (mode == "select") { | |
| document.getElementById("colorpicker").style.display = "inline"; | |
| sendToParticle('sendmode', 'select'); | |
| } | |
| else if (mode == "sleep") { | |
| document.getElementById("colorpicker").style.display = "none"; | |
| sendToParticle('sendmode', 'sleep'); | |
| } | |
| else if (mode == "disco") { | |
| document.getElementById("colorpicker").style.display = "none"; | |
| sendToParticle('sendmode', 'disco'); | |
| } | |
| } | |
| function changeAlarm(checked) { | |
| if (checked) { | |
| document.getElementById('time').style.display = 'inline'; | |
| sendToParticle('sendalarm', 'on'); | |
| } | |
| else { | |
| document.getElementById('time').style.display = 'none'; | |
| sendToParticle('sendalarm', 'off'); | |
| } | |
| } | |
| function setAlarm(h, m) { | |
| sendToParticle('sendhour', date.hour().toString()); | |
| sendToParticle('sendminute', date.minute().toString()); | |
| } | |
| function sendToParticle(func, val) { | |
| var request = new XMLHttpRequest(); | |
| var dev_id = 'Your Particle Device ID'; | |
| var access = 'Your Particle Device Secret'; | |
| var data = 'params='+val+'&access_token='+access; | |
| var url = 'https://api.particle.io/v1/devices/' + dev_id + '/' + func + '/'; | |
| request.open('POST', url, true); | |
| request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8'); | |
| request.send(data); | |
| } | |
| var timepicker = new TimePicker('time', { | |
| lang: 'en', | |
| theme: 'dark' | |
| }); | |
| var input = document.getElementById('time'); | |
| var hour = 0; | |
| var minute = 0; | |
| timepicker.on('change', function(evt) { | |
| var value = (evt.hour || '00') + ':' + (evt.minute || '00'); | |
| evt.element.value = value; | |
| hour = evt.hour; | |
| minute = evt.minute; | |
| }); | |
| timepicker.on('close', function(evt) { | |
| setAlarm(hour, minute); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
| /* | |
| http://blog.crutzen.eu/?p=822 | |
| */ | |
| #define BLYNK_PRINT Serial | |
| #include "blynk.h" | |
| // You should get Auth Token in the Blynk App. | |
| // Go to the Project Settings (nut icon). | |
| char blynkAuth[] = "Blynk token here"; | |
| int ledR = D1; | |
| int ledG = D2; | |
| int ledB = D3; | |
| int currentR = 0; | |
| int currentG = 0; | |
| int currentB = 0; | |
| int colorWheelPos = 0; | |
| const int discoColors[][3] = { | |
| {255, 0, 0}, {0, 255, 0}, {0, 0, 255}, | |
| {255, 255, 0}, {255, 0, 255}, {0, 255, 255}, | |
| {255, 15, 0}, {255, 0, 15}, {255, 15, 15}, | |
| {15, 255, 0}, {0, 255, 15}, {15, 255, 15}, | |
| {15, 0, 255}, {0, 15, 255}, {15, 15, 255}, | |
| {255, 127, 0}, {255, 0, 127}, {255, 127, 127}, | |
| {127, 255, 0}, {0, 255, 127}, {127, 255, 127}, | |
| {127, 0, 255}, {0, 127, 255}, {127, 127, 255}, | |
| {255, 240, 0}, {255, 0, 240}, {255, 240, 240}, | |
| {240, 255, 0}, {0, 255, 240}, {240, 255, 240}, | |
| {240, 0, 255}, {0, 240, 255}, {240, 240, 255} | |
| }; | |
| const int discoDuration[] = {125, 250, 375, 500}; | |
| #define MODE_AUTO 0 | |
| #define MODE_SELECT 1 | |
| #define MODE_SLEEP 2 | |
| #define MODE_DISCO 3 | |
| int mode = MODE_SELECT; | |
| bool alarm = false; | |
| int alarmH = 0; | |
| int alarmM = 0; | |
| void setup() | |
| { | |
| delay(5000); // Allow board to settle; seems to prevent breathing green led | |
| setColor(currentR , currentG , currentB); | |
| Blynk.begin(blynkAuth); | |
| pinMode(ledR, OUTPUT); | |
| pinMode(ledG, OUTPUT); | |
| pinMode(ledB, OUTPUT); | |
| Particle.function("sendcolor", sendColor); | |
| Particle.function("sendmode", sendMode); | |
| Particle.function("sendalarm", sendAlarm); | |
| Particle.function("sendhour", sendHour); | |
| Particle.function("sendminute", sendMinute); | |
| Time.zone(1); // UTC+1 | |
| } | |
| void loop() | |
| { | |
| Blynk.run(); | |
| if (alarm && alarmH == Time.hour() && alarmM == Time.minute()) { | |
| modeWakeUp(); | |
| } | |
| else { | |
| if (mode == MODE_AUTO) { | |
| modeAuto(); | |
| } | |
| else if (mode == MODE_SELECT) { | |
| modeSelect(); | |
| } | |
| else if (mode == MODE_SLEEP) { | |
| modeGoToSleep(); | |
| } | |
| else if (mode == MODE_DISCO) { | |
| modeDisco(); | |
| } | |
| } | |
| } | |
| void modeAuto() | |
| { | |
| setColorWheel(colorWheelPos); | |
| colorWheelPos = (colorWheelPos + 1) % 256; | |
| delay(100); | |
| } | |
| void modeSelect() | |
| { | |
| setColor(currentR, currentG, currentB); | |
| } | |
| void modeWakeUp() | |
| { | |
| Particle.publish("Wake up!"); | |
| int wait = 5000; | |
| for (int r = 1; (r < 64) && alarm; r++) { | |
| setColor(r, 0, 0); | |
| delay(wait); | |
| } | |
| for (int g = 1; (g < 32) && alarm; g++) { | |
| setColor(63, g, 0); | |
| delay(wait); | |
| } | |
| for (int b = 1; (b < 32) && alarm; b++) { | |
| setColor(63, 31, b); | |
| delay(wait); | |
| } | |
| mode = MODE_AUTO; | |
| } | |
| void modeGoToSleep() | |
| { | |
| Particle.publish("Going to sleep..."); | |
| int duration = 30; // minutes | |
| int b = 128; // brightness | |
| while (b >= 0 && mode == MODE_SLEEP) { | |
| setColor(0, b, (int)b/2); | |
| int s = 0; | |
| // check every second if we're still in sleep mode | |
| while (s <= duration*60/128 && mode == MODE_SLEEP) { // seconds per step | |
| delay(1000); | |
| s++; | |
| } | |
| b--; | |
| } | |
| if (mode == MODE_SLEEP) { | |
| currentR = 0; | |
| currentG = 0; | |
| currentB = 0; | |
| mode = MODE_SELECT; | |
| } | |
| } | |
| void modeDisco() | |
| { | |
| Particle.publish("Disco!"); | |
| while (mode == MODE_DISCO) { | |
| int c = random(33); | |
| setColor(discoColors[c][0], discoColors[c][1], discoColors[c][2]); | |
| delay(discoDuration[random(4)]); | |
| } | |
| } | |
| int sendColor(String hexColor) | |
| { | |
| long long number = strtoll( &hexColor[1], NULL, 16); | |
| long long r = number >> 16; | |
| long long g = number >> 8 & 0xFF; | |
| long long b = number & 0xFF; | |
| setColor(r, g, b); | |
| currentR = r; | |
| currentG = g; | |
| currentB = b; | |
| Particle.publish("Color", hexColor); | |
| } | |
| int sendMode(String m) { | |
| Particle.publish("Color mode", m); | |
| if (m == "auto") { | |
| mode = MODE_AUTO; | |
| } | |
| else if (m == "select") { | |
| mode = MODE_SELECT; | |
| } | |
| else if (m == "sleep") { | |
| mode = MODE_SLEEP; | |
| } | |
| else if (m == "disco") { | |
| mode = MODE_DISCO; | |
| } | |
| } | |
| int sendAlarm(String al) { | |
| alarm = (al == "on"); | |
| Particle.publish("Alarm", al); | |
| } | |
| int sendHour(String hour) { | |
| alarmH = hour.toInt(); | |
| Particle.publish("Alarm hour", hour); | |
| } | |
| int sendMinute(String minute) { | |
| alarmM = minute.toInt(); | |
| Particle.publish("Alarm minute", minute); | |
| } | |
| // Input a value 0 to 255 to get a color value. | |
| // The colours are a transition r - g - b - back to r. | |
| void setColorWheel(byte wheelPos) { | |
| if (wheelPos < 85) { | |
| setColor(wheelPos*3, 255 - wheelPos*3, 0); | |
| } | |
| else if (wheelPos < 170) { | |
| wheelPos -= 85; | |
| setColor(255 - wheelPos*3, 0, wheelPos*3); | |
| } | |
| else { | |
| wheelPos -= 170; | |
| setColor(0, wheelPos*3, 255 - wheelPos*3); | |
| } | |
| } | |
| void setColor(int r, int g, int b) | |
| { | |
| currentR = r; | |
| currentG = g; | |
| currentB = b; | |
| analogWrite(ledR, (int)r); | |
| analogWrite(ledG, (int)g); | |
| analogWrite(ledB, (int)b); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment