Monitoring and Control of Micro-controller Analog & Digital IOs from a Web Browser

 

Download Project

 

This example demonstrates how to monitor and control inputs and outputs of a micro-controller from a Web Browser through WiFi.

 

Target

Vega Aries v2.0 development board is used in this example. However, any CASP supported boards can be used.

ESP8266 WiFi module is used for WiFi communication.

 

Description

Connect the circuit as shown below. Connect any sensor to the ADC pin A0 & A1 of the target board for sensing. We use the on-board LEDs and a PWM output for controlling. Connect any DC motor through a suitable driver circuit (not shown the figure) to the PWM0 output of the board.

 

Following are the steps to properly program the target board.

·     Connect the target to the host PC via a USB cable.

·     Note the serial port number to which the board that is connected to the host PC, from the host operating system.

·     Run CASP and load the ‘target_model’ project.

·     Open Home->Simulation->Setup Simulation Parameters menu item. Under TargetHW->General tabs set ‘Target Hardware Programmer Port’ parameter to the serial port to which the board is connected.

·     Build the model and program the board by clicking on Run button.

 

Following are the steps to connect the remote device (PC or Mobile Phone) for monitoring and control

·     The ESP8266 block WiFi in the target model is set to Access Point mode with SSID: esp8266_ap and SSID Password: 0000000000. User may need to connect the remote monitoring device such as a computer or a mobile phone to this network before continuing.

·     After successfully establishing WiFi connection with the target, open a web browser, preferably Mozilla Firefox or Google Chrome on the device. Type the IP address 10.10.0.1 in the web browser. A page as shown in below animation should open up and start automatically updating itself at certain time intervals.

·     To control a digital or analog output, first turn off the auto refresh by clicking on ‘Auto Refresh OFF’ and then enter the output tag and value to control it as shown in below animation. Turn auto refresh back ON to auto update the digital and analog inputs.

browser_img.gif 

 

References

Please go through our video tutorials, tutorial projects and CASP main documentation for getting started with CASP.