Simple RGB LED control from a web POST command

The could be tutorial #2 after you blink the board LED from the cloud. The controls the color or the RGB led from the cloud. I was looking for a simple way to send information to my Photon via JavaScript. This is a building block, hopefully helps others.


Another problem I ran into, but don’t see where it would go.
There is a 64 character limit in a post, to get the most of it:

// an int variable in JavaScript encoded from base10 to base 36
// then posted, the particle function is passed the String value
// in my case I wanted an unsigned long, so parsed it with
var base10int = std::strtoul(value, NULL, 36);
// if you have a delimiter e.g. "_" between values
char *end;
var base10int1 = std::strtoul(value, &end, 36);
var base10int2 = std::strtoul(++end, &end, 36);
var base10int3 = std::strtoul(++end, NULL, 36);
1 Like

Thanks for sharing this @makerken !
I will try it out and if it works I will use it for setting the mood color in my living room…


Just tried it and it did work, but I did have several panic resets
Any idea what may cause this?

Anyway, I will try it with LED strings later.
The picker is really handy! Thanks again!


I was worried the Photon was going SOS, but it turned out it was great at representing red but not good at the other colors. The default delay in the sketch seems SOS-ie so change it to 800ms or 3000ms.

Also the limit is 1 color change per second, a burst of 4 can be done but there is a 4 second recharge time. The ‘respectful’ HTML file only updates once per second, but a few lines longer and I wanted to keep it as simple as possible.

The read me on GitHub is pretty good, but did you find anything that could be better?

Once I got a handle on this it made sense to control most anything. I was controlling a APA102 matrix with the 32bit code, it was repeating a pattern of 6 colours.

Sorry, didn’t see which comment you were responding to. I could see the std::strtoul causing problems, my debugging although elementary has served me well enough. Publishing exactly what I’m passing to the function called from the web int webFunction( value ) { Particle.publish( "Full", value ); } is helpful because then I know what I’m dealing with. There were multiple different things that I caught using that, one char is all it takes.

The jscolor picker is easy to get what value you want, but I could save you reading documentation, what LEDs are you controlling?

Hi @makerken , thanks!
I really like your color picker and the way you integrate it with Photons!
Yesterday, I have used your approach to control the night lighting (around the floor) at our home. It works perfectly!!!

Here’s my sketch:

#include <neopixel.h>
#define PIXEL_COUNT 20
#define PIXEL_PIN D4
#define PIXEL_TYPE WS2812
Adafruit_NeoPixel strip = Adafruit_NeoPixel(PIXEL_COUNT, PIXEL_PIN, PIXEL_TYPE);
int rgb[3];

void setup()
  Particle.function("rgb", ledrgb);

  // Initialize the RGB color to BLUE, until the color picker is used:
  rgb[0] = 0;
  rgb[1] = 0;
  rgb[2] = 255;

  Particle.publish("Lighting","Night color is BLUE @ B&B",60,PRIVATE);


void loop()
  strip.setPixelColor(0, strip.Color(200,200,200));;

  // Use the "Picker" web form to vary color!
  for(int i=1;i<16;i++)
    strip.setPixelColor(i, strip.Color(rgb[0], rgb[1], rgb[2]));

int ledrgb( String value )
    String redgreenblue[3];
    String delimiter = "_";
    int j = 0;

    for (int i = 0; i < value.length(); i++)
        if (value[i] == *delimiter)
          redgreenblue[j] += value[i];

    rgb[0] = redgreenblue[0].toInt();
    rgb[1] = redgreenblue[1].toInt();
    rgb[2] = redgreenblue[2].toInt();

    Particle.publish("Lighting","NEW night color is picked @ B&B",60,PRIVATE);
    // Optionally publish the RGB values as string:
    Particle.publish("red", String(rgb[0]));
    Particle.publish("green", String(rgb[1]));
    Particle.publish("blue", String(rgb[2]));

    return 1;

I see you are doing great in writing Javascript/HTML apps. I am just starting to learn this by looking at code like yours. In this area I have another question, a bit ‘off topic’ maybe:

For my home, (where I am using about 10 Photons to control about everything), I’d like to put together a small website for the family to use on our smartphone for monitoring and controlling all Photons…

It would consist of an index.html page, listing all the rooms.
Then I want to make one page per room, showing:

  • All “Particle.variables” of the room (Temperature, humidity, human movement, light value, gas detection value, CO2 value, …)
    => Of course, I need to see the variable values, but it would be nice to have also simple gauges or bargraphs in some cases.

  • All “Particle.functions” of the room (Turning lights ON/OFF, control colour, moods, temperature, door lock, RF device control, music selection …)
    => I’d like to use radio buttons, on/off switches, sliders, color pickers :wink: etc…

Have you made already something like this?

That would be great!
There are some tutorials already on this forum, but they are limited and don’t show all the possibilities I’m imagining to use. If I would have one example of each interface, I will probably be able to create that mini site myself…

Perhaps we need to create a new thread for this?
I’m sure many readers of this forum would love this too!


Full credit goes to for the color picker, it’s documentation and license is great. I didn’t have any hand in writing it. It is impressive.

I love your idea. I’ll put something together, I’m thinking a dynamic single page app would be nice.

1 Like

Hey @makerken, that sounds great!
I’m curious to try it out…

This color picker is mine, you can tell me if you don’t like it. It is still early for what this could be doing, so comment on what you’d like to see next. There was a ‘same origin policy’ error when I started trying learning Angular so I learned and used some jQuery mobile this time.

1 Like

Hi Ken, how have you been since last year?
Any new ideas to control Particle devices using Java?

Your color picker is used everyday to set the colour and intensity of the lights in our new home: Works like magic!

I still have a dream to control more Particle functions in a similar way like described in my post

It would be great if you could put me on the way with an example:
Two “buttons” (small rectangles with a text string in it) each calling one function on a Particle device, when clicked…


Awesome! I had no idea, I like community involvement because I quickly find other projects as soon as I’ve learned what I want, and stop short of documenting and sharing.

I got the fundamentals of something working last year, that would log the temperature/humidity in a google sheet and be able to graph it on a website. Played with some css svg to make a list controlling multiple rooms pretty. It was really for me learning web technologies, I thought you discovered HomeBridge and used that. For most things that is more convenient, although it’s been improved I think I made a better UI for multi-room control.

Well the way the world works is the email previous to this forum notification was for “Expected shipment date: Monday, Nov 19 - Wednesday, Nov 21” of my Particle mesh, so this be shiny and drawing my attention again.

I already had most of it working, I think querying the most recent 10 rows from a google sheet was giving me trouble. I’ll dig out that project soon and share.

1 Like

Wow, sounds great Ken! Thanks for your feedback :clap::older_man:

Indeed, I do use various methods like Homebridge (for control on IOS devices including Siri voice control) and OpenHAB (similar but more complex)
That’s fine for calling functions and displaying some data like room temperatures, but it’s not as flexible and more difficult to use outside of the WiFi network.

What I hope to achieve with your help is a simple and flexible on-line document which I can host securely on my http server, reachable anytime, from anywhere…

Not urgent of course…