SMuFF WebInterface

The SMuFF-WebInterface (a.k.a. SMuFF-WI) is a browser based configuration and control tool, which I've created to give you a better user-experience when it comes to tinkering with all those settings and various options on the SMuFF.

Probably the best thing about the WI is that you have access to every option and setting on the SMuFF but, since it's browser based, you don't have to install anything (compared to the Terminal app for example). Simply click the link. It'll load up and it's ready to use!

Before you click the link, please ensure that you're using a browser which supports the Web Serial API, which is essential for this tool. This API allows a browser to open serial devices connected to your PC and communicate with such devices. Currently only Microsoft Edge and Google Chrome browsers fully support this interface, but others might join in the near future.

If you'd like to know more about this tool, hop over to my Github repository, where the source code of this tool is located. The WebInterface can be accessed directly via this link, which you can easily add to your browsers favorites. Please be aware that only the web page is being loaded from Github, everything else happens locally on your computer (i.e. after the page has loaded, you could easily disconnect your internet connection and it'll still run).

After clicking the link above, you'll be greeted with this startup page:

To connect the WI to your SMuFF, simply click the SMuFF V6 image and a new dialog with a list of available serial ports will show up.

Please notice: Your SMuFF doesn't necessarily have to be connected via a USB cable, this dialog will also list Bluetooth serial ports if your computer is equipped with a Bluetooth transceiver.

Also, the connection speed (baudrate) for this serial communication is hard coded to 115200 baud. Before you attempt connecting the WI with your SMuFF, make sure the baudrate on the SMuFF is being set accordingly! By default, all available ports on the SMuFF are configured for this baudrate.

Once the WI has established a connection to your SMuFF and queried the runtime parameters, it'll show various informations and control elements (some of which do both) on the main screen, as shown in the image below.
The top most region contains detailed information about the name of the SMuFF the WI has connected to, the firmware version, the controller board used and the current mode.
Beneath you'll find a couple of state informations, such as the current tool selected or the state of the endstop sensors. Most of them (Tools, Relay, Lid, Purge and Status) double as buttons, which can be clicked in order to flip the current state (i.e. open/close the Lid servo or flip the Relay). The darker rendered elements are disabled, mostly because the SMuFF has reported that those are not being used.

By default you'll see the Dashboard, which contains a few buttons to control the SMuFF (same as in the main menu of the SMuFF display), but also a console window below, which logs the communication from and to the SMuFF.

The G-Code text field allows you to send GCode commands the SMuFF understands manually. All GCodes commands entered manually will be logged in the History list on the right, which is convenient if you have to send the same sequence multiple times.
Because the History list is being reset each time you reload the page, you have the option to save this list locally to your computer by clicking onto the Disk symbol.
The arrow keys Up and Down in the G-Code text field allow you to browse through the history of commands previously entered one by one.
The console output can be copied to the clipboard or erased completely if needed, using the two buttons right to the Send button.

Just like in a modern messenger, data sent to the SMuFF is shown aligned right in the console window, data coming from the SMuFF is shown left aligned. This way it's easier to distinguish which commands have been sent and what the response to those commands was.

If you'd like to get a list of GCodes supported by the SMuFF, type in the first letter (i.e. 'M' or 'G') and send it. The SMuFF will respond with a list of commands it understands. GCodes commands on the SMuFF are mostly matching the ones on your 3D printer, for example: M119 will send you the endstop states, M20 will list the contents of the SD-Card and M300 will play a sound.

If you need to know the parameters supported by a specific GCode, append a question mark (?) at the and of the command (i.e. 'M20?'). The SMuFF will send you the parameter list for this GCode.

If you don't get any parameters back, this means your help folder on the SMuFFs SD-Card is missing files. You may check that.

A special feature of the WebInterface is the Live Control section. This shows you a graphical representation of your V6 model, and enables you to invoke certain functions simply by clicking on the active area.
For example: Clicking the servo horn will open/close the Lid on the SMuFF, whereas clicking on the Wiper will start the wipe sequence. By hovering the mouse over the image, WI will help you discovering the active areas.

The SMuFF is supposed to mirror the actions shown in the animations of Live Control. For example: If the Selector moves to the tool you've clicked on, the SMuFF is supposed to move to the same position.
If that's not the case, and the SMuFF moves in the opposite direction, this means you have to set the "Invert Stepper Direction" in the settings of the Selector.

In case you're missing some items here, such as the Filament Cutter or the Wiper, this means the SMuFF is not configured likewise. If you do have the one or the other option installed, make sure you've enabled this option in the settings of your SMuFF.

The most complex section is the Settings. Grouped into functional blocks, they'll show you all the settings and their according values currently set on the SMuFF. When you change those values, they will be sent to the SMuFF and become active right away. If the transmission of a changed value to the SMuFF was successful, the input field will be shown with a green background, if it fails, the background will become red.
The changes you make here are being stored in the internal memory of the SMuFF only. Means, if you're testing out some different settings and you don't want to keep them, reset the SMuFF and they're gone. If you'd like to make those changes permanent, click the Save to SD-Card button in the upper right corner.

The Swap Tools section lets you define which slot is assigned to which tool simply by dragging the tool up or down.
Swapping tools may become handy when you've sliced a model for a specific tool but the filament you need for this model is located in a different slot. Instead of swapping out the filament manually or firing up your slicer again and re-slicing the model, you can do it this way.
Each time the SMuFF receives a tool change GCode, i.e. T3, it'll look it up in this table and swap the slot the requested tool is assigned to. By default (i.e. no swaps
Please keep in mind: If you Save Swaps, they will become permanent, even if you power cycle your SMuFF. To get rid of swapped tools, click on Reset Swaps then save them.

In the Status Info section you'll see all the data coming from the TMC drivers, given that you have such installed on your controller board (which is always the case on a SKR E3 V1.2 or 2.0).
This screen reflects the same information you'll get using the M122 GCode command in the console window.
The values shown here in red indicate a faulty state, which you have to check because they could mess up the function of the SMuFF (although, not in this case since it only means there's no stepper motor connected to the Y-Axis driver, which is totally fine in this configuration because we're not using it).

The Board Info section gives you some useful information about the pin out of your controller board, as well as which connector on the board is supposed to be used for which item/function on the SMuFF.

And finally the Run Test section, which lets you pick and run / monitor test scripts located on the SD-Card of your SMuFF in folder test. If your unsure about the script selected, you can click on View Script to download and list the contents of the script in question.
While the test script is running, the test results such as time elapsed, loop count, number of tool changes and so on are being reflected in the according fields, just as on the SMuFFs display.

Please notice: If the WebInterface reports an error during the connection phase to the SMuFF, stating that the test scripts could not be loaded, this is because there are too many scripts located in the test folder and the buffer runs over. In such case reduce the amount of script files (i.e. delete those not feasible for your SMuFF) and reload the WI.