If you don't yet have an AdafruitIO account, you can use these two buttons to find out how to create an account and how to create a feed:
The AdafruitIO Feed you create will be the source of the messages that the cube will fetch. You can put a message into this feed, and the cube will automatically be able to display it after a short delay. There are two Feeds you have to create:
cube-words- this feed will contain text messages that will be scrolling across the sides fo the cubecube-pixels- this feed will contain string messages which will be parsed into an array of pixel coordinates that will be turned on or off. Messages to this feed, if formatted correctly, can show pixel art at the top of the cube with a specified color.
Once you get your feed created (use the guide above for details about how to do that), you can publish some test messages.
Send test messages
First, grab your AdafruitIO username and key from https://io.adafruit.com/. Click the yellow button that says "API key" on the navigation bar, which should open a popup that contains these details.
Copy and paste this curl command to a terminal to send a test message to your cube-words feed that you just created, making sure to replace the placeholders YOUR_USERNAME and YOUR_KEY with your own details.
curl https://io.adafruit.com/api/v2/YOUR_USERNAME/feeds/cube-words/data \
-H "Content-Type: application/json" \
-H "X-AIO-Key: YOUR_KEY" \
-d '{"value": "hello, cube!!!"}'
You can check your feed page to verify that the message did get published into your feed. Go to https://io.adafruit.com/, click on Feeds and click into cube-words. You should see the message "hello cube!!!" published there.
Then, you can send a test message to the cube-pixels feed. This message needs to be a specific format for the code to interpret it properly. The format is as follows:
COLOR-x:y,x:y,x:y...
Where COLOR is an enum that is either PURPLE, AMBER, JADE, CYAN, BLUE, GOLD, or PINK, and x:y is the x and y coordinate of a pixel that needs to be turned on with the specified color.
This is not a standard format, it's something very specific to the cube, so I've provided a sample message here. Remember to replace the YOUR_ placeholders with your details.
curl https://io.adafruit.com/api/v2/YOUR_USERNAME/feeds/cube-pixels/data \
-H "Content-Type: application/json" \
-H "X-AIO-Key: YOUR_KEY" \
-d '{"value": "PINK-1:1,1:2,1:5,1:6,2:0,2:1,2:2,2:3,2:4,2:5,2:6,2:7,3:0,3:1,3:2,3:3,3:4,3:6,3:7,4:1,4:2,4:3,4:4,4:5,4:6,5:2,5:3,5:4,5:5,6:3,6:4"}'
Again, verify that you've published the message correctly in the cube-pixels feed. Go to https://io.adafruit.com/, click on Feeds and click into cube-pixels. You should see the message published there.
When you successfully fetch a message from this feed using your cube, you'll see an adorable pixel heart <3
Custom webpage
To make this message publishing easy and fun, I've created a webpage that will allow you to draw pixel art and select a color, which will publish a well-formatted message into your cube-pixels feed. There is also a text box to send a word message to the cube-words feed. The details about how exactly I made this page is outside the scope of this tutorial, but you can modify it to publish to your own feed:
- At the top of the file script.js, you'll find three variables, and each of them have placeholders that start with
YOUR_. Replace these placeholders with your own AdafruitIO username and key. Save the file. - Open the file index.html in a modern browser, preferably Chrome.
You can now draw something and it will send a properly formatted string to your cube-pixels feed, and will send anything you type in the text box to the cube-words feed. Download the zip file below to start modifying and playing with these files!
At the end of this tutorial, you should be able to see the latest messages you've sent to your feeds glowingly displayed on your cube!
Text editor powered by tinymce.
