Robo-Tank Web App - Development

[Rob F]

This week I've been reformatting things for the new template and everything is pretty much finished. I've been spending some time on the port configuration screen and this is what I've come up with, not sure if it's a winner yet but it's working good so see what happens.

This is the settings menu coming from the home page, as things are added more icons will appear. The dosing screens are the same as the widget was.


This is "Configure Ports" screen. At the top you see a setting for Robo-Tank or Custom, if Robo-Tank is selected you get the following screens and later it'll effect other things through out, mainly pictures or to simplify things.

The idea is a person clicks a port and then they edit the port. The image will resize based on screen size.



After clicking a port you'll get the details and can edit them. As this is a DC port the functions available are AC outlet, DC port, Light, Dosing Pump or Auto Feeder. When you click on a sensor the list is a variety of sensors. For the sensor the functions all do the same in the backend, it's is just so the appropriate sensor icon shows on the home page.

As the DB9's technically have 8 ports when you click it the options will be AC power bar or the extensions I have available. If a user does want to DIY extra ports on the DB9 they can flip to "custom controller" and edit each pin separately then go back to Robo-Tank.



This is the screen for "custom", it groups each driver and the pins available. I just noticed now this pic is wrong, pins for each driver are mixed as I changed the sort for something else but you get the idea. When hovering over a box an icon will appear to edit it.