[2024-04-21] Version 1.4.2 released! Check the change log to see the fixes and new features added. Be part of the Clock Club and create your own clockface using Canvas.
The DIY smart wall clock device
Clockwise was an idea I had while working with 64x64 LED matrices. These displays are about the size of a wall clock and with the ESP32, besides controlling the content presented on the display we also gain the functionality of WiFi, Bluetooth, touch buttons and other sensors, which gives us basically a smart wall clock. From there I started to develop a platform to create the Clockfaces, or skins that the clock can have. The possibilities are many and I hope that with help from contributors, we can grow the options even more.
Create a new custom Clockface starting from here or take a look at the Clock Club and discover how to create new ones using just a JSON file with no coding.
Mario Bros. Clock | Time in Words |
---|---|
https://github.com/jnthas/cw-cf-0x01 | https://github.com/jnthas/cw-cf-0x02 |
World Map Clock | Castlevania Clock Tower |
---|---|
https://github.com/jnthas/cw-cf-0x03 | https://github.com/jnthas/cw-cf-0x04 |
Pacman | Pokedex |
---|---|
https://github.com/jnthas/cw-cf-0x05 | https://github.com/jnthas/cw-cf-0x06 |
Canvas | Description |
---|---|
Canvas is a special type of Clockface that is capable of rendering different themes described in a JSON file. Find out more here. |
|
https://github.com/jnthas/cw-cf-0x07 |
The three main hardware components of Clockwise are:
With these components in hand, just follow the wiring instructions according to the library used, by default Clockwise uses the ESP32-HUB75-MatrixPanel-I2S-DMA but any Adafruit GFX compatible library should work. The default wiring connection is showed below.
1) Go to https://clockwise.page/ and select the desired clockface 2) Connect the ESP32 device on your computer's USB port 3) Click on the Flash button 4) A dialog will appear, select the correct USB port and click in Connect (screenshot) 5) Select the INSTALL and INSTALL again (screenshot) 6) Wait while the flash tool uploads the firmware and finish (screenshot) 7) From the version 1.1.0, click in NEXT on step 6, Improv will start looking for available WiFi networks to connect 8) Select your local network (must be a 2.4GHz) and enter with your password (screenshot) 9) If connection was successful, a message with button VISIT DEVICE will pop up and you can visit the Clockwise setting page (screenshot)
After flashing your clockface, you will have a step to configure the WiFi. But in case you change your access point or password, you can set up just the WiFi connecting the Clockwise on USB, opening https://clockwise.page and clicking in Flash button, a window will pop up with a few options where you can re-configure your WiFi network (screenshot) as well as open the Settings page to change preferences using button VISIT DEVICE. Remember: it is important to use a 2.4GHz WiFi, it will not work on 5GHz.
The settings page have the following options
pool.ntp.org
, but you can configure your own (local) NTP server to be used.time.google.com
.Clockwise uses PlatformIO as IDE, so the configuration is already done if you use the same. The Clockwise structure consists mainly of three folders
.
├── clockfaces
│ ├── cw-cf-0x01
│ ├── cw-cf-0x02
│ └── cw-cf-0x03
├── lib
│ ├── cw-commons
│ ├── cw-gfx-engine
│ └── timeinwords -> ../clockfaces/cw-cf-0x02/
└── src
└── main.cpp
Clone this repository and then run the following command to clone the clockface submodules
.../clockwise$ git submodule update --init firmware/clockfaces
To create the symbolic link run the following command inside lib/ folder:
.../clockwise/firmware/lib$ ln -s ../clockfaces/cw-cf-0x02/ timeinwords
Or, if you prefer, you can get the same result by copying the desired clockface folder into lib/
The same way as web flashing, when connecting for the first time you will have to configure the wifi, follow the instructions in Configuring WiFi section above.
You can use the official Esspressif IoT Development Framekwork (aka esp-idf) to build and upload this project to an ESP32 device, including the ESP32-Trinity board.
Follow the Step By Step installation instructions.
Follow the instructions here.
git clone --recurse-submodules https://github.com/jnthas/clockwise.git
idf.py reconfigure
idf.py menuconfig
(select Clockwise Configuration
and choose the clockface)idf.py flash
idf.py monitor