OctoPrint is an incredibly popular and capable open-source project created and maintained by Gina Häußge. It allows you to remotely monitor and control your 3D printer. Traditionally you can check your OctoPrint status via a browser, but what if you wanted to get a quick status check without switching tabs?

This project uses Adafruit IO as an MQTT broker for OctoPrint and CircuitPython, running on a Feather ESP32-S2 Reverse TFT. OctoPrint sends MQTT messages to Adafruit IO as individual feeds with the OctoPrint MQTT plugin. The Feather checks the Adafruit IO feeds for new messages and updates the display accordingly, letting you see what's happening with your printer at your desk, coffee table, etc.

The Feather can also send messages to OctoPrint using the OctoPrint REST API, enabled with the OctoPrint MQTT Subscribe plugin. You'll ping Adafruit IO feeds with the buttons on the Feather to trigger commands in OctoPrint such as pausing or canceling a print.

The TFT display on the Feather will show the current status of your printer according to OctoPrint alongside the OctoPrint mascot. For additional visualization, the onboard NeoPixel will show the rainbow animation during a print and blink a corresponding color for status states.

If you are actively printing, a progress bar will be displayed denoting your print's progress. 

The D0, D1 and D2 buttons can send REST API commands via Adafruit IO to OctoPrint. Their functionality is shown on the TFT and varies depending on if your printer is printing or not.

If your printer is idle, you can set the hotend temperature to 0 (cooldown), set the hotend temperature to 200 (heat up) or reboot your OctoPrint server. If you are printing, you can pause, resume or cancel your print.

Prerequisite Setup and Guides

This project assumes that you are already running an OctoPrint instance. It will not work unless you have OctoPrint running since it works in tandem with OctoPrint using the MQTT and MQTT Subscribe plugins. OctoPrint has many resources available to guide you through the setup and installation.

Additionally, you will need an Adafruit IO account since Adafruit IO is acting as the MQTT broker, logging the MQTT messages from OctoPrint in IO feeds to be accessed by the Feather and sending REST commands to OctoPrint. There are guides on the Learn System, linked here and below, to assist you with this.

This project assumes that you are already running an OctoPrint server instance. It will not work unless you have OctoPrint installed and running.

Parts

Video of a rectangular microcontroller with a TFT display. A pink manicured finger presses each of the tactile buttons, which are recognized on the TFT display.
Like Missy Elliot, we like to "put our [Feather] down, flip it and reverse it" and that's exactly what...
$24.95
In Stock
Angled shot of a pink/purple woven USB cable plugged into a laptop port and a small dev board.
This cable is not only super-fashionable, with a woven pink and purple Blinka-like pattern, it's also made for USB C for our modernized breakout boards, Feathers and more. 
$3.95
In Stock
Black Nylon Screw and Stand-off Set with M2.5 Threads, kit box
Totaling 380 pieces, this M2.5 Screw Set is a must-have for your workstation. You'll have enough screws, nuts, and hex standoffs to fuel your maker...
$16.95
In Stock
Opened box showing many nylon screws
Totaling 420 pieces, this M3 Screw Set is a must-have for your workstation. You'll have enough screws, nuts, and hex standoffs to fuel...
$16.95
In Stock

Optional for monitoring additional feeds:

Text image that reads "IO+"
The all-in-one Internet of Things service from Adafruit you know and love is now even better with IO+. The 'plus' stands for MORE STUFF! More feeds, dashboards,...
$99.00
In Stock

The project may be mounted in a 3D printed case, described below. The case consists of three parts: the main lid, the main box and the tentacles. The case parts can print with no supports.

The STL file can be downloaded directly here or from Printables.

The case is modeled to resemble an octopus to honor the OctoPrint mascot. 

The Feather mounts to the case lid with M2.5 and M2 hardware and the tentacles attach to the box with M3 hardware. There is a slot for a USB cable to plug into the Feather's USB port.

Search for the Plugin

To begin, go to your OctoPrint server in your web browser.

Then, you'll navigate to OctoPrint Settings by clicking on the wrench icon at the top of your OctoPrint browser window.

In OctoPrint Settings, click on Plugin Manager in the left navigation menu. In the Plugin Manager, click on +Get More.

Install the Plugin

This will open the Install new Plugins... window. In the search box, type in "mqtt". The MQTT plugin will appear at the top of the list. Click Install to install the plugin.

Restart OctoPrint

After the installation finishes, a Plugin management log dialog box will appear letting you know that you need to restart OctoPrint to complete the installation. Click Restart now to restart OctoPrint. When you're asked if you're sure that you want to restart, click Proceed.

After OctoPrint finishes restarting, you'll be prompted to reload the server. To do this, click Reload now.

Confirm Installation

After reloading the server, navigate back to OctoPrint Settings and the Plugin Manager. In the manager, search for "mqtt". The MQTT plugin should now appear under Installed Plugins.

Search for and Install the Plugin

After installing the MQTT plugin, return to the Install new Plugins... window and search for "MQTT Subscribe". Click Install to install the plugin.

Reboot OctoPrint

After the installation finishes, a Plugin management log dialog box will appear letting you know that you need to restart OctoPrint to complete the installation. Click Restart now to restart OctoPrint. When you're asked if you're sure that you want to restart, click Proceed.

After OctoPrint finishes restarting, you'll be prompted to reload the server. To do this, click Reload now.

Confirm Installation

After reloading the server, navigate back to OctoPrint Settings and the Plugin Manager. In the manager, search for "mqtt subscribe". The MQTT Subscribe plugin should now appear under Installed Plugins.

The OctoPrint MQTT plugin needs to be configured in a specific way in order for Adafruit IO to act as the MQTT broker. For more information on the Adafruit IO MQTT API, check out the documentation page.

MQTT Broker Settings

In OctoPrint Settings, navigate to the MQTT page under Plugins. This displays the MQTT plugin configuration.

In the Broker tab, enter io.adafruit.com in the Host box. Enter 8883 in the Port box. Under Protocol version, select MQTTv311

Further down in the Broker tab, check off "The broker requires username and password to connect." Enter your Adafruit IO username in the Username box and your Adafruit IO password key in the Password box.

Then check off "The broker requires TLS to connect."

MQTT Topics

For Adafruit IO to subscribe to the MQTT topics in the MQTT plugin, their topic names need to match the Adafruit IO feed format: {Adafruit IO username}/feeds/{feed name}. This can be configured in the Topics tab.

There are many possible MQTT topics to subscribe to in the MQTT plugin. For the purposes of this project, only a few will be selected. If you are on the free tier of Adafruit IO with a ten feed limit, this project may max out your feeds if you select too many topics since the feeds are created automatically as they are received by Adafruit IO. For more feeds, you can consider upgrading to Adafruit IO+.

If you are on the free tier of Adafruit IO, you only have a maximum of 10 feeds available. You can have additional feeds with IO+.

Under General, in the Topics tab, enter your Adafruit IO username followed by a forward slash ( / ).

Under Event messages, check off "Activate event messages". 

In the Topic box, enter feeds/{event}. This will let the individual events automatically create feeds in your Adafruit IO account named for the event.

For topics, select Server events, Communication events and Printing events.

Under Progress messages, check off "Activate progress messages". This allows for the printing progress percentage messages to be monitored.

When you're finished, click the Save button at the bottom of the window.

Feeds in Adafruit IO

After configuring the plugin, navigate to your Feeds tab in Adafruit IO. As your printer performs tasks, you should see feeds begin to populate with the MQTT topics from OctoPrint that you selected in the plugin.

After configuring the MQTT plugin, you can setup the MQTT Subscribe plugin. The MQTT Subscribe plugin listens for REST requests on MQTT topics. These REST requests correspond with the OctoPrint REST API. For more information on the OctoPrint REST API, check out the documentation page.

Generate an API Key

Before configuring the plugin, you'll need to generate an API key. Navigate to the MQTT Subscribe tab under the Plugins section. Next to the API KEY box, click on the blue plus sign (+) button. You'll see your API key populate in the box.

Add the Topics

The MQTT topics that MQTT Subscribe will listen to will need to match the Adafruit IO feed format: {Adafruit IO username}/feeds/{feed name}

To add a new topic, click on the plus sign (+) button on the right side of the window. 

This will open a blank MQTT Topic Editor window. You will add six topics to match the CircuitPython code. You'll edit the Topic, Type, REST API and REST Parameters sections for each topic. You can reference the charts below to see how each topic should be setup.

Reboot OctoPrint

Topic:

{Adafruit IO username}/feeds/shutdown

Type:

post

REST API:

/api/system/commands/core/restart

REST Parameters:

{"command":"restart"}

Preheat Printer

Preheats printer hotend to 200°C.

Topic:

{Adafruit IO username}/feeds/heatup

Type:

post

REST API:

/api/printer/tool

REST Parameters:

{
  "command": "target",
  "targets": {
    "tool0": 200
  }
}

Cooldown Printer

Sets printer hotend to 0°C.

Topic:

{Adafruit IO username}/feeds/cooldown

Type:

post

REST API:

/api/printer/tool

REST Parameters:

{
  "command": "target",
  "targets": {
    "tool0": 0
  }
}

Pause Print

Topic:

{Adafruit IO username}/feeds/printpaused

Type:

post

REST API:

/api/job

REST Parameters:

{
  "command": "pause",
  "action": "pause"
}

Resume Print

Topic:

{Adafruit IO username}/feeds/printresumed

Type:

post

REST API

/api/job

REST Parameters:

{
  "command": "pause",
  "action": "resume"
}

Cancel Print

Topic:

{Adafruit IO username}/feeds/printcancelled

Type:

post

REST API:

/api/job

REST Parameters:

{
  "command": "cancel"
}

After setting up the six topics, your MQTT Subscribe plugin window should look similar to this. Once you're finished, click Save in the bottom right-hand corner.

CircuitPython is a derivative of MicroPython designed to simplify experimentation and education on low-cost microcontrollers. It makes it easier than ever to get prototyping by requiring no upfront desktop software downloads. Simply copy and edit files on the CIRCUITPY drive to iterate.

CircuitPython Quickstart

Follow this step-by-step to quickly get CircuitPython running on your board.

Click the link above to download the latest CircuitPython UF2 file.

Save it wherever is convenient for you.

Plug your board into your computer, using a known-good data-sync cable, directly, or via an adapter if needed.

Double-click the reset button (highlighted in red above), and you will see the RGB status LED(s) turn green (highlighted in green above). If you see red, try another port, or if you're using an adapter or hub, try without the hub, or different adapter or hub.

For this board, tap reset and wait for the LED to turn purple, and as soon as it turns purple, tap reset again. The second tap needs to happen while the LED is still purple.

If double-clicking doesn't work the first time, try again. Sometimes it can take a few tries to get the rhythm right!

A lot of people end up using charge-only USB cables and it is very frustrating! Make sure you have a USB cable you know is good for data sync.

You will see a new disk drive appear called FTHRS2BOOT. Drag the adafruit_feather_esp32s2_reverse_tft_etc.uf2 file to FTHRS2BOOT.

The BOOT drive will disappear and a new disk drive called CIRCUITPY will appear.

That's it!

If you've worked on WiFi projects with CircuitPython before, you're probably familiar with the secrets.py file. This file is a Python file that is stored on your CIRCUITPY drive that contains all of your secret WiFi information, such as your SSID, SSID password and any API keys for IoT services. 

As of CircuitPython 8, there is support for a settings.toml file. Similar to secrets.py, the settings.toml file separates your sensitive information from your main code.py file.

Your settings.toml file should be stored in the main directory of your CIRCUITPY drive. It should not be in a folder.

settings.toml File Example

Here is an example on how to format your settings.toml file.

# Comments are supported
CIRCUITPY_WIFI_SSID="guest wifi"
CIRCUITPY_WIFI_PASSWORD="guessable"
CIRCUITPY_WEB_API_PORT=80
CIRCUITPY_WEB_API_PASSWORD="passw0rd"
test_variable="this is a test"
thumbs_up="\U0001f44d"

In a settings.toml file, it's important to keep these factors in mind:

  • Strings are wrapped in double quotes; ex: "your-string-here"
  • Integers are not quoted and may be written in decimal with optional sign (+1, -1, 1000) or hexadecimal (0xabcd).
    • Floats, octal (0o567) and binary (0b11011) are not supported.
  • Use \u escapes for weird characters, \x and \ooo escapes are not available in .toml files
    • Example: \U0001f44d for 👍 (thumbs up emoji) and \u20ac for € (EUR sign)
  • Unicode emoji, and non-ASCII characters, stand for themselves as long as you're careful to save in "UTF-8 without BOM" format

 

 

When your settings.toml file is ready, you can save it in your text editor with the .toml extension.

Accessing Your settings.toml Information in code.py

In your code.py file, you'll need to import the os library to access the settings.toml file. Your settings are accessed with the os.getenv() function. You'll pass your settings entry to the function to import it into the code.py file.

import os

print(os.getenv("test_variable"))

In the upcoming CircuitPython WiFi examples, you'll see how the settings.toml file is used for connecting to your SSID and accessing your API keys.

Once you've finished setting up your reverse TFT Feather ESP32-S2 with CircuitPython, you can access the code and necessary libraries by downloading the Project Bundle.

To do this, click on the Download Project Bundle button in the window below. It will download as a zipped folder.

# SPDX-FileCopyrightText: 2023 Liz Clark for Adafruit Industries
# SPDX-License-Identifier: MIT

import time
import ssl
import os
import json
import socketpool
import wifi
import board
import digitalio
import terminalio
import adafruit_requests
from adafruit_io.adafruit_io import IO_HTTP, AdafruitIO_RequestError
import displayio
from adafruit_progressbar.horizontalprogressbar import (
    HorizontalProgressBar,
    HorizontalFillDirection,
)
from adafruit_display_shapes.rect import Rect
from adafruit_display_text import bitmap_label,  wrap_text_to_lines
import neopixel
from adafruit_led_animation.animation.rainbow import Rainbow
from adafruit_led_animation.animation.blink import Blink

aio_username = os.getenv('aio_username')
aio_key = os.getenv('aio_key')

wifi.radio.connect(os.getenv('CIRCUITPY_WIFI_SSID'), os.getenv('CIRCUITPY_WIFI_PASSWORD'))

# Make the display context
splash = displayio.Group()
board.DISPLAY.show(splash)

# set progress bar width and height relative to board's display
width = 183
height = 30

x = 50
#y = board.DISPLAY.height // 3
y = 100

# Create a new progress_bar object at (x, y)
progress_bar = HorizontalProgressBar(
    (x, y),
    (width, height),
    fill_color=0x000000,
    outline_color=0xFFFFFF,
    bar_color=0x13c100,
    direction=HorizontalFillDirection.LEFT_TO_RIGHT
)

# Append progress_bar to the splash group
splash.append(progress_bar)

rect = Rect(40, 0, 2, 135, fill=0xFFFFFF)
splash.append(rect)

img = displayio.OnDiskBitmap("octoprint_logo.bmp")
idle_icons = displayio.OnDiskBitmap("idle_icons.bmp")
printing_icons = displayio.OnDiskBitmap("printing_icons.bmp")
finished_icon = displayio.OnDiskBitmap("finished_icon.bmp")

tile_grid = displayio.TileGrid(bitmap=img, pixel_shader=img.pixel_shader, x = 185, y=5)
splash.append(tile_grid)

icon_grid = displayio.TileGrid(bitmap=idle_icons, pixel_shader=idle_icons.pixel_shader, x = 0, y=0)
splash.append(icon_grid)

text = bitmap_label.Label(terminalio.FONT, text="Connecting", scale=2, x=55, y=45)
splash.append(text)

led = digitalio.DigitalInOut(board.LED)
led.direction = digitalio.Direction.OUTPUT

button0 = digitalio.DigitalInOut(board.D0)
button0.direction = digitalio.Direction.INPUT
button0.pull = digitalio.Pull.UP

button1 = digitalio.DigitalInOut(board.D1)
button1.direction = digitalio.Direction.INPUT
button1.pull = digitalio.Pull.DOWN

button2 = digitalio.DigitalInOut(board.D2)
button2.direction = digitalio.Direction.INPUT
button2.pull = digitalio.Pull.DOWN
# Our array of key objects
button0_state = False
button1_state = False
button2_state = False

pixel = neopixel.NeoPixel(board.NEOPIXEL, 1, brightness = 0.6)

# Create a socket pool
pool = socketpool.SocketPool(wifi.radio)

requests = adafruit_requests.Session(pool, ssl.create_default_context())
# Initialize an Adafruit IO HTTP API object
io = IO_HTTP(aio_username, aio_key, requests)

try:
    # get feed
    # printing monitors the printer progress feed
    printing_status = io.get_feed("printing")
except AdafruitIO_RequestError:
    # if no feed exists, create one
    printing_status = io.create_new_feed("printing")
try:
    print_done = io.get_feed("printdone")
except AdafruitIO_RequestError:
    print_done = io.create_new_feed("printdone")
try:
    printer_state = io.get_feed("printerstatechanged")
except AdafruitIO_RequestError:
    printer_state = io.create_new_feed("printerstatechanged")
try:
    shutdown = io.get_feed("shutdown")
except AdafruitIO_RequestError:
    shutdown = io.create_new_feed("shutdown")
try:
    heat_up = io.get_feed("heatup")
except AdafruitIO_RequestError:
    heat_up = io.create_new_feed("heatup")
try:
    cooldown = io.get_feed("cooldown")
except AdafruitIO_RequestError:
    cooldown = io.create_new_feed("cooldown")
try:
    resume = io.get_feed("printresumed")
except AdafruitIO_RequestError:
    resume = io.create_new_feed("printresumed")
try:
    pause = io.get_feed("printpaused")
except AdafruitIO_RequestError:
    pause = io.create_new_feed("printpaused")
try:
    cancelled = io.get_feed("printcancelled")
except AdafruitIO_RequestError:
    cancelled = io.create_new_feed("printcancelled")

read_feeds = [printing_status, printer_state, print_done]
send_while_idle_feeds = [cooldown, heat_up, shutdown]
send_while_printing_feeds = [pause, resume, cancelled]
new_feed_msg = ["None", "None", "None"]
last_feed_msg = ["none","none","none"]
msg_json = [{"path": "none"}, {"state_id": "NONE"}, {"path": "none"}]
print_progress = 0
current_state = 0
last_state = None
state_value = 0
current_file = None
finished_file = None
red = (255, 0, 0)
green = (0, 255, 0)
blue = (0, 0, 255)
cyan = (0, 255, 255)
purple = (255, 0, 255)
yellow = (255, 255, 0)

printer_state_options = ["OPEN_SERIAL", "DETECT_SERIAL",
"DETECT_BAUDRATE", "CONNECTING", "OPERATIONAL", "PRINTING", "PAUSING", "PAUSED",
"CLOSED", "ERROR", "FINISHING", "CLOSED_WITH_ERROR", "TRANSFERING_FILE", "OFFLINE", "STARTING",
"CANCELLING", "UNKNOWN", "NONE"]
colors = [green, yellow, cyan, yellow,
          green, purple, yellow, yellow, red,
          red, blue, red, yellow, red,
          purple, red, red, red]

clock = 5

rainbow = Rainbow(pixel, speed=0.1, period=2)
blink = Blink(pixel, speed=0.5, color=green)

while True:
    if button0.value and button0_state:
        led.value = False
        button0_state = False
    if not button1.value and button1_state:
        led.value = False
        button1_state = False
    if not button2.value and button2_state:
        led.value = False
        button2_state = False

    if current_state in ("PRINTING", "PAUSED", "PAUSING"):
        rainbow.animate()
        if not button0.value and not button0_state:
            led.value = True
            io.send_data(send_while_printing_feeds[0]["key"], "ping")
            button0_state = True
        if button1.value and not button1_state:
            led.value = True
            io.send_data(send_while_printing_feeds[1]["key"], "ping")
            button1_state = True
        if button2.value and not button2_state:
            led.value = True
            io.send_data(send_while_printing_feeds[2]["key"], "ping")
            button2_state = True
    else:
        blink.color=colors[state_value]
        blink.animate()
        if not button0.value and not button0_state:
            if finished_file == current_file:
                current_file = "None"
                progress_bar.value = 100
                progress_bar.bar_color = colors[state_value]
                text.text = "\n".join(wrap_text_to_lines("Status: %s" % current_state, 11))
                icon_grid.bitmap = idle_icons
                icon_grid.pixel_shader = idle_icons.pixel_shader
                button0_state = True
            else:
                led.value = True
                io.send_data(send_while_idle_feeds[0]["key"], "ping")
                button0_state = True
        if button1.value and not button1_state:
            led.value = True
            io.send_data(send_while_idle_feeds[1]["key"], "ping")
            button1_state = True
        if button2.value and not button2_state:
            led.value = True
            io.send_data(send_while_idle_feeds[2]["key"], "ping")
            button2_state = True
    if (time.monotonic() - clock) > 15:
        #  get data
        for feed in range(3):
            try:
                data = io.receive_data(read_feeds[feed]["key"])
            except AdafruitIO_RequestError:
                print("Check that OctoPrint is sending data! Check your IO dashboard.")
            #  if a new value is detected
            if data["value"] != last_feed_msg[feed]:
                #  assign value to new_msg
                new_feed_msg[feed] = data["value"]
                msg_json[feed] = json.loads(data["value"])
                #  set servo angle
                print(read_feeds[feed]["key"])
                print()
                print(new_feed_msg[feed])
                print()
                #time.sleep(1)
                print_progress = int(msg_json[0]['progress'])
                current_file = str(msg_json[0]['path'])
                current_state = str(msg_json[1]['state_id'])
                finished_file = str(msg_json[2]['path'])
                state_value = printer_state_options.index(current_state)
                #  log msg
                last_feed_msg[feed] = new_feed_msg[feed]
            #time.sleep(1)
        if current_state == "PRINTING":
            #print_progress = int(msg_json[0]['progress'])
            progress_bar.value = print_progress
            #octoprint green
            progress_bar.bar_color = 0x13c100
            text.text = "\n".join(wrap_text_to_lines("%d%% Printed" % print_progress, 7))
            icon_grid.bitmap = printing_icons
            icon_grid.pixel_shader = printing_icons.pixel_shader
        elif current_state in ("PAUSED", "PAUSING"):
            progress_bar.value = print_progress
            progress_bar.bar_color = colors[state_value]
            text.text = "\n".join(wrap_text_to_lines("Status: %s" % current_state, 11))
            icon_grid.bitmap = printing_icons
            icon_grid.pixel_shader = printing_icons.pixel_shader
        # when a print is finished:
        elif finished_file == current_file and print_progress == 100:
            progress_bar.value = 100
            progress_bar.bar_color = purple
            text.text = "\n".join(wrap_text_to_lines("Print Finished!", 11))
            icon_grid.bitmap = finished_icon
            icon_grid.pixel_shader = finished_icon.pixel_shader
        # when printer is idle, display status
        else:
            progress_bar.value = 100
            progress_bar.bar_color = colors[state_value]
            text.text = "\n".join(wrap_text_to_lines("Status: %s" % current_state, 11))
            icon_grid.bitmap = idle_icons
            icon_grid.pixel_shader = idle_icons.pixel_shader
        #  reset clock
        clock = time.monotonic()

Upload the Code and Libraries to the Reverse TFT Feather ESP32-S2

After downloading the Project Bundle, plug your reverse TFT Feather ESP32-S2 into the computer's USB port with a known good USB data+power cable. You should see a new flash drive appear in the computer's File Explorer or Finder (depending on your operating system) called CIRCUITPY. Unzip the folder and copy the following items to the reverse TFT Feather ESP32-S2's CIRCUITPY drive. 

  • lib folder
  • code.py
  • octoprint_logo.bmp
  • finished_icon.bmp
  • idle_icons.bmp
  • printing_icons.bmp

Your reverse TFT Feather ESP32-S2 CIRCUITPY drive should look like this after copying the lib folder, octoprint_logo.bmp, finished_icon.bmp, idle_icons.bmp, printing_icons.bmp image files and the code.py file.

CIRCUITPY

Add Your settings.toml File

As of CircuitPython 8.0.0, there is support for Environment Variables. These Environmental Variables are stored in a settings.toml file. Similar to secrets.py, the settings.toml file separates your sensitive information from your main code.py file. Add your settings.toml file as described in the Create Your settings.toml File page earlier in this guide. You'll need to include your aio_username, aio_key, CIRCUITPY_WIFI_SSID and CIRCUITPY_WIFI_PASSWORD.

CIRCUITPY_WIFI_SSID = "your-ssid-here"
CIRCUITPY_WIFI_PASSWORD = "your-ssid-password-here"

aio_username = "your-aio-username-here"
aio_key = "your-aio-key-here"

How the CircuitPython Code Works

The code begins by creating a HorizontalProgressBar() object. This progress bar will display the progress of an active print and will act as an additional visual cue for the current status of the printer when it is idle.

# Make the display context
splash = displayio.Group()
board.DISPLAY.show(splash)

width = 165
height = 30

x = 70
y = 100

# Create a new progress_bar object at (x, y)
progress_bar = HorizontalProgressBar(
    (x, y),
    (width, height),
    fill_color=0x000000,
    outline_color=0xFFFFFF,
    bar_color=0x13c100,
    direction=HorizontalFillDirection.LEFT_TO_RIGHT
)

# Append progress_bar to the splash group
splash.append(progress_bar)

Display Attributes

Next, a rectangle is created to act as a display divider. It appears as a thick white line on the display to separate the button icons from the progress bar and status message. Then, the OctoPrint logo and idle icons are imported as TileGrid objects. 

rect = Rect(60, 0, 2, 135, fill=0xFFFFFF)
splash.append(rect)

img = displayio.OnDiskBitmap("octoprint_logo.bmp")
idle_icons = displayio.OnDiskBitmap("idle_icons.bmp")
printing_icons = displayio.OnDiskBitmap("printing_icons.bmp")
finished_icon = displayio.OnDiskBitmap("finished_icon.bmp")

tile_grid = displayio.TileGrid(bitmap=img, pixel_shader=img.pixel_shader, x = 185, y=5)
splash.append(tile_grid)

text = bitmap_label.Label(terminalio.FONT, text="Connecting", scale=2, x=75, y=45)
splash.append(text)

Buttons and NeoPixel

The front buttons are setup as inputs and the onboard NeoPixel is setup as a NeoPixel object.

button0 = digitalio.DigitalInOut(board.D0)
button0.direction = digitalio.Direction.INPUT
button0.pull = digitalio.Pull.UP

button1 = digitalio.DigitalInOut(board.D1)
button1.direction = digitalio.Direction.INPUT
button1.pull = digitalio.Pull.DOWN

button2 = digitalio.DigitalInOut(board.D2)
button2.direction = digitalio.Direction.INPUT
button2.pull = digitalio.Pull.DOWN

button0_state = False
button1_state = False
button2_state = False

pixel = neopixel.NeoPixel(board.NEOPIXEL, 1, brightness = 0.6)

Feeds

After connecting to Adafruit IO, the code tries to get the feeds corresponding to the MQTT topics defined in the OctoPrint MQTT plugins. If the feeds do not exist, they are created.

pool = socketpool.SocketPool(wifi.radio)

requests = adafruit_requests.Session(pool, ssl.create_default_context())
io = IO_HTTP(aio_username, aio_key, requests)

try:
    # get feed
    printing_status = io.get_feed("printing")
    print_done = io.get_feed("printdone")
    printer_state = io.get_feed("printerstatechanged")
    shutdown = io.get_feed("shutdown")
    heat_up = io.get_feed("heatup")
    cooldown = io.get_feed("cooldown")
    resume = io.get_feed("printresumed")
    pause = io.get_feed("printpaused")
    cancelled = io.get_feed("printcancelled")

except AdafruitIO_RequestError:
    # if no feed exists, create one
    printing_status = io.create_new_feed("printing")
    print_done = io.create_new_feed("printdone")
    printer_state = io.create_new_feed("printerstatechanged")
    shutdown = io.create_new_feed("shutdown")
    heat_up = io.create_new_feed("heatup")
    cooldown = io.create_new_feed("cooldown")
    resume = io.create_new_feed("printresumed")
    pause = io.create_new_feed("printpaused")
    cancelled = io.create_new_feed("printcancelled")

The Loop

In the loop, the code functionality is determined by the current state of the printer. This status is determined by the incoming messages on the PrinterStateChanged topic. If the printer is PRINTING, PAUSED or PAUSING, then the onboard NeoPixel displays the rainbow swirl animation and the buttons have the ability to send pause, resume and cancel messages to OctoPrint.

if current_state in ("PRINTING", "PAUSED", "PAUSING"):
        rainbow.animate()
        if not button0.value and not button0_state:
            led.value = True
            io.send_data(send_while_printing_feeds[0]["key"], "ping")
            button0_state = True
        if button1.value and not button1_state:
            led.value = True
            io.send_data(send_while_printing_feeds[1]["key"], "ping")
            button1_state = True
        if button2.value and not button2_state:
            led.value = True
            io.send_data(send_while_printing_feeds[2]["key"], "ping")
            button2_state = True

For any other state, the onboard NeoPixel will blink a color that matches the status message. For example, red for disconnected and green for operational.

The buttons can send heat up, cooldown and reboot messages to OctoPrint unless a print has just finished. In that case, the D0 button confirms that the print has completed and that updates the display and button abilities. 

The button icons are updated by changing the icon_grid bitmap and pixel_shader attributes to the different icon bitmap files.

else:
        blink.color=colors[state_value]
        blink.animate()
        if not button0.value and not button0_state:
            if finished_file == current_file:
                current_file = "None"
                progress_bar.value = 100
                progress_bar.bar_color = colors[state_value]
                text.text = "\n".join(wrap_text_to_lines("Status: %s" % current_state, 11))
                icon_grid.bitmap = idle_icons
                icon_grid.pixel_shader = idle_icons.pixel_shader
                button0_state = True
            else:
                led.value = True
                io.send_data(send_while_idle_feeds[0]["key"], "ping")
                button0_state = True
        if button1.value and not button1_state:
            led.value = True
            io.send_data(send_while_idle_feeds[1]["key"], "ping")
            button1_state = True
        if button2.value and not button2_state:
            led.value = True
            io.send_data(send_while_idle_feeds[2]["key"], "ping")
            button2_state = True

Ping IO

Every fifteen seconds, Adafruit IO is checked for a new message from OctoPrint. If a new message has been logged in a feed, then that message is converted to a JSON entry so that it can be parsed.

if (time.monotonic() - clock) > 15:
        #  get data
        for feed in range(3):
            try:
                data = io.receive_data(read_feeds[feed]["key"])
            except AdafruitIO_RequestError:
                print("Check that OctoPrint is sending data! Check your IO dashboard.")
            #  if a new value is detected
            if data["value"] != last_feed_msg[feed]:
                #  assign value to new_msg
                new_feed_msg[feed] = data["value"]
                msg_json[feed] = json.loads(data["value"])
                print(read_feeds[feed]["key"])
                print()
                print(new_feed_msg[feed])
                print()
                print_progress = int(msg_json[0]['progress'])
                current_file = str(msg_json[0]['path'])
                current_state = str(msg_json[1]['state_id'])
                finished_file = str(msg_json[2]['path'])
                state_value = printer_state_options.index(current_state)
                #  log msg
                last_feed_msg[feed] = new_feed_msg[feed]

If the printer is printing, then the progress bar and status text is updated with the print progress percentage.

if current_state == "PRINTING":
            progress_bar.value = print_progress
            #octoprint green
            progress_bar.bar_color = 0x13c100
            text.text = "\n".join(wrap_text_to_lines("%d%% Printed" % print_progress, 7))
            icon_grid.bitmap = printing_icons
            icon_grid.pixel_shader = printing_icons.pixel_shader

If the printer is paused, then the progress bar's color is updated to yellow.

elif current_state in ("PAUSED", "PAUSING"):
            progress_bar.value = print_progress
            progress_bar.bar_color = colors[state_value]
            text.text = "\n".join(wrap_text_to_lines("Status: %s" % current_state, 11))
            icon_grid.bitmap = printing_icons
            icon_grid.pixel_shader = printing_icons.pixel_shader

The code determines if a print has finished by comparing the file name on the printing topic and the PrintDone topic. If those file names match and the print progress is 100%, then the display updates to show that a print is finished.

# when a print is finished:
        elif finished_file == current_file and print_progress == 100:
            progress_bar.value = 100
            progress_bar.bar_color = purple
            text.text = "\n".join(wrap_text_to_lines("Print Finished!", 11))
            icon_grid.bitmap = finished_icon
            icon_grid.pixel_shader = finished_icon.pixel_shader

If the printer is idle, then the progress bar displays a color that matches the blinking NeoPixel and the button icon bitmap changes to match their functionality.

# when printer is idle, display status
        else:
            progress_bar.value = 100
            progress_bar.bar_color = colors[state_value]
            text.text = "\n".join(wrap_text_to_lines("Status: %s" % current_state, 11))
            icon_grid.bitmap = idle_icons
            icon_grid.pixel_shader = idle_icons.pixel_shader

Insert an M3 screw into the mounting hole in the tentacle base.

Attach the case box to the tentacle base using an M3 nut.

Mount the Feather

Place the case lid on top of the Feather so that the buttons and TFT slot into their cutout areas.

Attach the left side of the Feather (side with the three buttons) to the lid using M2.5 hardware.

Attach the right side of the Feather (side with the reset button) to the lid using M2 hardware.

Create the Octopus

Close the case by snapping the lid onto the case box.

That completes the assembly! You can power the Feather over USB or with a battery connected to the JST-PH battery port.

After confirming that OctoPrint is transmitting MQTT messages to Adafruit IO, power-up the Feather ESP32-S2 reverse TFT. You should see the TFT screen display the latest status message transmitted to Adafruit IO from OctoPrint.

If the printer is not printing, the latest event message will be displayed on the TFT. The onboard NeoPixel will blink in a corresponding color that matches the event message. For example, red for Offline, green for Operational, etc.

You'll have options for sending cooldown, heat up and reboot messages with the three buttons.

If a print is running, the print progress will be shown on the screen as a percentage and a progress bar. The onboard NeoPixel will display the rainbow animation. You'll have options for sending pause, resume and cancel messages with the three buttons.

When a print finishes, the display will show text letting you know that the print has completed. You can press the D0 button to dismiss the message and resume showing the latest event message.

Going Further

There are a lot of MQTT topics that you can monitor or control for OctoPrint. This project really only began to scratch the surface of what is available and possible. Adafruit IO also has actions available, such as SMS and IFTTT, that could be helpful for OctoPrint. For example, you could monitor the PrintDone topic with an SMS action so that you recieve a text message when a print finishes.

This guide was first published on Feb 08, 2023. It was last updated on Feb 13, 2023.