Wled setup

WLED is an open-source software application that controls LED light strips and matrices. It is specifically tailored for use with ESP8266 and ESP32 microcontroller units. WLED stands out for its user-friendly interface and extensive feature set, including a wide range of lighting effects, colour palettes, and configurations. It supports Android and iOS devices through a web-based interface or dedicated app, allowing users to easily customize and control their LED setups. Additionally, WLED integrates with popular smart home solutions and offers advanced features like music synchronization, making it a versatile choice for DIY enthusiasts and professional lighting setups.

Below is based on the Wled Getting Started guide

Wiring the led to the ESP32

Always ensure that the ESP32 and the LED strips are powered appropriately, and the power supply has enough capacity to handle the LEDs' current draw (see image below to hook up a power supply)

Default pins:

LED DATA (ESP32) Default: 2, (suggested: 1, 2, 3, 4, 16)
Button: 0
IR Remote: 4
Relay: 12

See Getting Started for more details

In general, use one of the GPIOs that support output and are not used by the ESP32 for critical functions. Good choices are GPIOs 2, 4, 12, 14, 15, 16, 17, 18, 19, 21, 22, 23, 25, 26, 27, 32, or 33.

Upload the firmware

To upload the firmware, do the following:

Connect the ESP32 to the computer.
Go to this website: https://install.wled.me/ (Chrome Browser works well)
Press Install
Choose the port from the available ports

Connect to the Wled interface

Open wifi
Choose WLED-AP (password: wled1234)
The captive portal will show up where you can control the Wled.

Connect to a WIFI network

Connect to the WLED-AP wifi
Change the WIFI settings under Config - SSID and password.
Give a name for the wled device (in this example "mywled")
In the wifi setting set "AP opens" to "Always". This ensures that you can connect to Wled wifi even though the Wled is connected to another wifi.
Restart the wemos.
Goto mywled.local to while the computer is on the same wifi.
Or... connect to its local IP (you can find it in the router configuration) or in the client IP.
Download the app "WLED- Native" from IOS or Android app stores.

Adding interactivity

Multiple button types can be created:

Momentary push-buttons (active low, active high)
Switches (be careful with the selection of GPIO for the switch since some GPIOs will prevent successful boot of ESP if held LOW or HIGH at boot)
PIR motion detection sensor (they set GPIO HIGH when motion is detected.
Some GPIO pins on ESP32 can act as momentary touch buttons with no additional hardware.

Analog "buttons" (also with inverted logic) can be used as potentiometers or analogue input buttons. They can control:
- Global brightness
- Effect speed
- Effect intensity
- Palette
- Primary colour hue
- Segment N opacity

With analog input only use ADC1 not ADC2 which interferes with wifi (see pinlayout below).

See more here:

https://kno.wled.ge/features/macros/

Control Commands:

These commands are used to directly control the LED lights. They include turning the LEDs on/off, setting the brightness, changing colors, selecting effects, and adjusting effect speed and intensity.

On/Off: T=1 (on) or T=0 (off)
Brightness: A=<value> where <value> is from 0 to 255
Color: R=<value>&G=<value>&B=<value> for setting RGB color values
Effect: FX=<effect_id> to select an effect by its ID
Speed: SX=<value> to set the effect speed
Intensity: IX=<value> to set the effect intensity

Example wiring of potentiometer.

Example wiring of button (active low example)

Example wiring of joystick.

Setting up a button example

Wiring (obs order of pins on joystick may differ)

2. Go to Settings => Led Preferences. Then, set the GPIO pin.

3. Go to Settings => Time & Macros. Then, set the buttons actions. The number represents the id in the step 4.

4. Goto front control panel and press "+ Preset". Then uncheck "Use current state" then add the API command

The pin maping of the ESP32 Mini

This is a relatively technical diagram. You will not need this in the beginning but at a later state this will help you to look up the different pins and what they can do. The green boxes indicate the the pin can be used to read analog signals (0v to 3.3v). The pink boxes indicates that the pin can be used as touch sensor.

Control Wled over Websocket + p5js

Communication is done via JSON API: https://kno.wled.ge/interfaces/json-api/

The official websocket guide can be found here: https://kno.wled.ge/interfaces/websocket/

P5jS: WebSocket example: https://editor.p5js.org/hobye/sketches/u_RXbKk4t

JSON COMMAND

Turn on: {"on": true}
Turn off: {"on": false}
Set Brightness (0-255): {"bri": 128}
Change Color (RGB): {"seg": [{"col": [[255, 0, 0]]}]}
Apply effect with ID 10: {"seg": [{"fx": 10}]}
Adjust Effect Speed and Intensity (0-255):
Set speed and intensity: {"seg": [{"sx": 128, "ix": 128}]}
Apply palette with ID 5: {"seg": [{"pal": 5}]}

Allow for insecure connections in chrome on editer.p5js.org

Go to editor.p5j.org
Go to site settings can be opened from the URL.
Scroll down to insecure content and choose "allow".
Refresh page
You should now have a "not secure" warning.

2. Run P5 sketch

Open: https://editor.p5js.org/hobye/sketches/AvfVdx0_c
Change the ip for your wled IP - Use the wled app to look it up
Make sure you are on the same wifi network
Run the sketch and test the buttons.

MQTT + p5js

Communication is done via JSON API: https://kno.wled.ge/interfaces/json-api/

The official mqtt guide can be found here: https://kno.wled.ge/interfaces/mqtt/

P5jS: WebSocket example: https://editor.p5js.org/hobye/sketches/RE30GYpxR

Get mqtt liveview here: https://www.shiftr.io/try

Click on ‘Settings’ and then ‘Sync interfaces’ Scroll down until you find the ‘MQTT’ settings.
Click the checkbox to ‘Enable MQTT’
Set the broker to public.cloud.shiftr.io and the port to 1883
Set user to: public
Set password to: public
Scroll down to the bottom and click ‘Save’, the board will need rebooting for the changes to take effect.