It’s been a while since I’ve been here. After getting my Bearded Dragon’s cage monitoring working the way I wanted I haven’t really had any other big projects. After finishing college, getting a new job, and moving I’m finally ready to take on my next project.
I’ve got a few RGB LED strips and a nice black and white cityscape canvas picture that looks awesome when it is backlit. What I’d like to do is create a website that allows me to pick any color and brightness of my LED strips so I can change the color of the backlit picture.
Any thoughts or help would be greatly appreciated!
That is wonderful! That’s a great start for what I’m wanting to do. Thank you!
The light got put on the back burner for now. I just don’t have the programing background to get it the way I wanted it. I could make it fade in and work with a hard coded time, but the front end is not my specialty. I need to spend some more time with Java before I can get that one finished.
25m!? That should keep you busy for a while. Wow. lol
I’m trying to work on the sunrise part, but there are no code examples to be found anywhere on the web. Guess I’ll have to make my own color fade then…
I try to take it one step at a time, the posted code being the first step. I wanted to be able to control my strips from the web, although an actual color picker is yet to be made. I tried to get it working on mobile devices (I’ve got an iPad/iPhone), which is why I used jQuery Mobile. So far so good…
I was hoping on using the timeAlarms library for setting up the times, but I’ve got nowhere near the skills required to set a time for that through the web. Guess I’ll have to ask @bko for some help on that one
Making it pretty is last on my list. If I can get it working with some ugly web buttons, I can always throw some CSS on it later
Well, I ordered 50m 60/m 5050 RGB strip, but plan on stuffing around 25m of it in a yet-to-be-made false ceiling. Should provide enough light to get me up Then, I’d like to put around 6m under my bed, well, because I can…
I was thinking about putting approximately 8m behind a yet-to-be-made cinema wall, for some sort of static ambilight. But having seen some standalone ambilight solutions, I guess I’m gonna go for one of those
It’d also be nice to create some automatic stair lights, by putting them under the steps, and activating them with either a PIR sensor, or a light-switch.
The ultimate goal would be to automate my bedroom, powered by That’d include the lightning, curtains, sound, television, and my electric bed. Something like a “cinema button” would be nice; lights dim, bed goes upright, curtains close, tv/sound system goes on, media player activates, and the fun can begin
All those dreams are curtesy of . Now if only I could program AND have time to do so… A nice heap of cash wouldn’t be bad either
Hi everyone! I love the idea of a sunrise wakeup display. I’ve posted a set of R,G,B color lookup tables to use with ws2812b LED strips somewhere on here. They’re 5bit resolution, but still work decently well at converting #rrggbb values into brightness values for the LEDs to reproduce the color picked.
Also thought I would drop some jQuery baesd js here I picked up courtesy of @bko . The function sends a POST request with the innerHTML from an element in a drop down menu. It also rewrites an asterisk next to the currently selected option. (I used it to select modes for a lamp).
document.getElementById('mode_list').addEventListener('click', pickLampMode, false);
function pickLampMode (evt) {
var oldState = document.getElementById('mode_list').getElementsByTagName("a");
var regE = /\(\*\)/;
for (var i = 0; i < oldState.length; i++) {
var newState = oldState[i].childNodes[0].nodeValue;
oldState[i].childNodes[0].nodeValue = newState.replace(regE, "");
}
var _OWL = evt.target;
var aReturn = _OWL.parentElement.getElementsByTagName("div");
var lmval = aReturn[0].childNodes[0].nodeValue;
var lm = "mode=";
var requestURL = "https://api.spark.io/v1/devices/" + deviceID + "/" + postFunc + "/";
var terms = lm+lmval;
document.getElementById('returnVal').innerHTML = terms;
var upText = _OWL.parentElement.getElementsByTagName("a");
upText[0].childNodes[0].nodeValue += " (*)";
$.post( requestURL, { access_token: accessToken, a: terms });
}
id=“mode_list” is the id of an unordered list <ul> containing a bunch of list <li> items containing the hidden divs which contain the lmval value.
Here’s the HTML:
<ul id="mode_list">
<li><a href="#" id="off" name="lamp_mode">Off</a><div style="visibility:hidden;">0</div></li>
<li><a href="#" id="torch" name="lamp_mode">Torch</a><div style="visibility:hidden;">1</div></li>
<li><a href="#" id="color_cycle" name="lamp_mode">Color Wheel</a><div style="visibility:hidden;">2</div></li>
<li><a href="#" id="lava_lamp" name="lamp_mode">Lava Lamp</a><div style="visibility:hidden;">3</div></li>
<li><a href="#" id="lamp" name="lamp_mode">Lamp (*)</a><div style="visibility:hidden;">4</div></li>
<li><a href="#" id="lamp_wave" name="lamp_mode">Lamp Wave</a><div style="visibility:hidden;">5</div></li>
<li><a href="#" id="lamp_viz" name="lamp_mode">Sound Visualization</a><div style="visibility:hidden;">6</div></li>
</ul>```
Apologies for the poor formatting. The `<a href>` tags are one of the prerequisites for a drop down menu script, so it might be different for you.
I spruced it up a little for you. If you have large blocks of text, you can wrap them in ``` and ``` (3 backticks on a line, followed by your code, and ended with 3 more backticks).
You guys are awesome. My fiancé is in town this weekend so I haven’t had time to do much, but I did do some basic testing. Just ignore the chair backs in the way.
If you’re using jQuery anyways, you might as well take advantage of it. I’ve posted a jsFiddle with some simplified JavaScript that takes advantage of jQuery more:
That’d include the lightning, curtains, sound, television, and my electric bed. Something like a “cinema button” would be nice; lights dim, bed goes upright, curtains close, tv/sound system goes on, media player activates, and the fun can begin 