In this tutorial, I am going to show how to control state of Finite State Machine via webpage. As an example, I am going to show how to control three LEDs according to Finite State Machine model.
Demonstration VideoFirst of all, let’s think about real-time controlling Arduino via webpage:
Advantage: remotely and real-time controlling Arduino without developing and installing any special software and works on variety Operating System (Android, iOS, Windows) as long as it installed a web browser.
Disadvantage: need to have knowledge of web programming
Solution: PHPoC Shield for Arduino has a built-in Web Server and some pre-programmed web application, allowing user to remotely control and monitoring Arduino via Webpage without requiring any knowledge of web programming. See more at https://www.hackster.io/phpoc_man/arduino-websocket-056f16
The pre-programmed web application I used in this project is “Web Remote Control / Push”.
User interface is like below:When a WebSocket connection is established, if a button is pressed or released, the web application sends a command to Arduino. For example, when button A is pressed and released, ‘A’ and ‘a’ command is sent to Arduino, respectively.
There are 3 LEDs (Red, Green, Yellow) in this project. I use three button A, B, C to turn on/off these LEDs. When a button is pressed, the current LED is blinked in short time and turned off, new LED corresponding to this button is turned on.
State machine diagram is shown as below.I made two pieces of codes with the same functionality.
The first one is normal code. The other is State Machine code.
Comments