Introduction

This project is meant to serve as a reference base platform for nearly any IoT project. Various aspects of the architecture were chosen for modularity even though something this simple might have been possible with a smaller set of components. Some key features of this project are the fully formed web interface, a 3d printed enclosure, and a local user interface. Each of these items are important for any practical project yet it seems like there are few if any project examples online that document every aspect of a complete device; especially the enclosure and web interface.

This project ties together an Arduino compatible AVR controller, an ESP8266 internet interface, and a responsive JavaScript web client. The project includes a local control interface with a simple, inexpensive 20x2 LCD and 5 button input; a JavaScript based responsive web client using Angular 1.x; a REST interface for other direct automation control; and a MQTT client for a messaging based interface.

Every aspect of the project is open source or open hardware.

The completed reference project is a schedule based controller for a single 24V solenoid valve. These valves are commonly found in sprinkler systems. The motivation for this project was to separate the pool fill valve from my sprinkler controller and provide an automation interface. Later projects could implement closed loop feedback for filling the pool. None of the individual capabilities of this project are unique or innovative; there are many other solutions, both commercial and DIY, to keep a pool full. However, this platform will be used over and over for more IoT projects in the future. In the process of completing this project I’ve learned many new skills and practiced existing skills. These include electronic schematic design, electronic board fabrication, soldering, physical hardware design, 3d printing, vinyl label design and cutting, AVR programming, ESP8266 programming, MQTT client design, REST interface design, JavaScript programming, HTTP, CSS, and Angular responsive web design. The web interface was especially challenging given my existing skills and took me a very long time to complete.

Roadmap

This is an incomplete list of activities that must be completed before the project is finished.

Section	Topic	Status
Controller	PCBs	Complete
Enclosure	Box	Complete
	Faceplate	Complete
	Faceplate Label	Not Started
Controller Software	Schedule	Complete
	Command Interface	Complete
	LCD Menu	Not Started
Javascript Client		Complete
ESP Server	WiFi Client Code	Started
	Debugging w/o Serial	Started
	Tracking KPIs	Started
	SNTP Client	Started

Hardware Design

Power Supply

Solenoid Control

Local Display w/ Navigation Keys

Controller

WiFi and Web Interface

Enclosure

Controller Software

Serial Command Interface

LCD and Keypad Menu

Parameter Storage

Time Keeping

Schedule

Valve Timer

Run Queue

Web Interface

Architecture

The web interface is implemented in an ESP8266 WiFi module. This was chosen because it has a lot of community support and will run the Arduino libraries. The Arduino libraries were chosen to complement the same libraries in the attached ATMega AVR. The ESP8266 is responsible for all the Internet facing functions such as NTP time keeping, REST interface, serving static web resources, and the MQTT client.

Serial Command Interface

WiFi Network Management and mDNS

NTP Client

Controller Time Update Task

Web Server

REST Interface

Parameter Storage

Web Client

Architecture

The web client interface implemented as an Angular 1.x single page application. The web client talks directly to the REST interface in the ESP8266 web server. Each of the pages are dynamically populated from the REST interface. The user interface is based on the model-view-controller concept implemented in Angular services, controllers, and html templates.

This is the part of the project where I have the least experience and I am sure there are aspects that can be vastly improved.

REST Interface

The REST interface is designed for both the web interface and as a general automation interface for access by other systems. Using the REST interface for all the web client interaction ensures that alternative clients can be created that have complete control over every aspect of the system.

Model

View

Controller

Node Test Client

I quickly realized that uploading changes to the ESP8266 takes some time. Given my serious lack of experience with JavaScript web clients and Angular I was in for many iterations of changes. To make prototyping the client side JavaScript bearable, I created a very basic REST server and static page server in NodeJS. This is a good reference client for prototyping changes.

Remaining Tasks