CRODUINO NOVA AS AN AP (ACCESS POINT)

CRODUINO NOVA AS AN AP (ACCESS POINT)
11.Jan.2023

You are a beginner with Croduino. Or electronics? A specific module caught your eye, but you do not know how to use it? Do not worry, HUM is here for you! How to Use Module (HUM) is a blog tutorials series by e-radionica where you will find all you need in order to begin working with your favorite module. Tutorials include technical characteristics, work principles, instructions on how to connect the module with Croduino and the basic code. Everything else is left to your imagination.

INTRODUCTION

You must have once had the idea to create a project to control your devices using your smartphone or computer, and now we are here with a tutorial that describes exactly that. We will use the Croduino Nova 2 as an AP (access point) to be able to connect to it and control certain devices (e.g. lighting in our case). What is an AP, and how to set up a Croduino Nova 2 to work as an AP and manage the devices connected to its pins is described in the tutorial below.

WHAT IS AN AP?

AP (access point or wireless AP) is a device that allows other devices to connect to it using some sort of communication (usually WiFi) and have Internet access via that device. Our wireless home network is an example of an AP that we connect to using different devices and have access to the Internet. With Croduino Nova 2 we will not allow access to the Internet, it will allow us to manage Croduino pins or devices connected to these pins.

When we connect to our Croduino via some WiFi network using a mobile phone or computer, it is necessary to open a web page in the browser by entering an IP address (if we did not change it in the WiFI library, it was set to 192.168.4.1).
This is similar to the server mode of Croduino Nova 2, except that we are not connecting to a local network, but rather creating a local network using Croduino (i.e. AP) to which other devices can connect. Its advantage is the fact that we do not need a separate device (router) on which we would create a local area network and connect Croduino and a mobile phone or computer.

ARDUINO CODE

If you haven’t added Croduino Nova 2 to the Arduino IDE so far, and if you are using the Croduino Nova 2 for the first time, check the tutorial on how to program Croduino Nova 2 from Arduino IDE.
We use the ESP8266WiFi library in the code, but we do not need to install it because when we add the ESP8266 module to the board manager, this library is also installed.                                To use the Croduino NOVA as an AP, you do not need to change anything on it, we just upload the appropriate code and the Croduino becomes an AP. In order to test how it works, we will connect the LEDs with the corresponding resistor for each diode to pin 4 and 5. When we connect to the Croduino and visit the web site, we should see the same display as is in the image below. When we click on the LED ON, we turn on the LED and when we click on the LED OFF, we turn off the LED connected to pin 4. The same applies to the LED connected to pin 5, and in front of each group of buttons, the status of the LED which is controlled by the buttons is displayed.

In the image below, we see what the mobile phone display for a single LED looks like and, as we can see, it is of the appropriate size because in the code for the web page we have added a part that scales the page display depending on the device on which it is displayed.

//including the ESP8266WiFi library that allows working with WiFi on the ESP8266 module
#include <ESP8266WiFi.h>
//setting the password for our AP (our network) and the name of our AP
const char AP_Password[] = "12345678";
const char AP_Name[] = "Croduino_AP";
//the constructor for the ESP866WiFi library to which we submit our AP port number
WiFiServer server(80);
 
//the strings to which we save the web page that will be displayed when we enter the IP address to the browser
String header = "HTTP/1.1 200 OK\r\nContent-Type: text/html\r\n\r\n";
//the html1_1 string is used to display the page and for adjusting certain parameters (color, font size, button size)
//in the beginning, we set the scaling of the web page, for it to be displayed in the appropriate size on our mobile phone
String html_1 = "<!DOCTYPE html><html><head><meta name='viewport' content='width=device-width,"
" initial-scale=1.0'/><meta charset='utf-8'><style>body {font-size:140%;}"
" #main {display: table; margin: auto; padding: 0 10px 0 10px; } h2,{text-align:center; }"
" .button { padding:10px 10px 10px 10px; width:100%; background-color: #4CAF50; font-size: 120%;}</style>"
"<title>AP LED</title></head><body><div id='main'><h2>Kontrola LED diode</h2>";
//the string to which we save the LED diode status (the text that is displayed when the LED diode is on or off)
String html_LED = "";//status 1 of the LED diode
String html_LED2=""; //status 2 of the LED diode
//setting the button for turning the diode on or off
String html_2 = "<form id='F1' action='LEDON'><input class='button' type='submit' value='LED ON' ></form><br>";
String html_3 = "<form id='F2' action='LEDOFF'><input class='button' type='submit' value='LED OFF' ></form><br>";
//here we can add another button, just change the name and ID (this can be seen in the example for the second diode)
String html1_4="<form id='F3' action='LED2ON'><input class='button' type='submit' value='LED 2 ON' ></form><br>";
String html1_5="<form id='F4' action='LED2OFF'><input class='button' type='submit' value='LED 2 OFF' ></form><br>";
//labels for closing the HTML code
String html_end = "</div></body></html>";
 
//the string to which we save the client's request (the device that is connected to our AP)
String request = "";
int LED_Pin = 4; //the pin to which the LED diode is connected
int LED2_Pin=5; //the pin to which the second LED diode is connected
 
void setup()
{
 pinMode(LED_Pin, OUTPUT); //setting the LED_Pin as an output
 pinMode(LED2_Pin, OUTPUT); //setting the LED2_Pin as an output
 //creating our AP with the name and password we have set in the beginning
 boolean conn = WiFi.softAP(AP_Name, AP_Password);
 //starting the server
 server.begin();
 
}
 
void loop()
{
 
 //checking whether there is a client connected to our AP (as long as there is no client, we repeat the checking procedure)
 WiFiClient client = server.available();
 if (!client) { return; }
 //reading the first line of the request sent by the client that is connected to our AP
 request = client.readStringUntil('\r');
 
 //checking whether there is LEDON in the client's request and if there is, we turn the LED diode on
 if ( request.indexOf("LEDON") > 0 ) { digitalWrite(LED_Pin, HIGH); }
 //checking whether there is LEDOFF in the client's request and if there is, we turn the LED diode off
 if ( request.indexOf("LEDOFF") > 0 ) { digitalWrite(LED_Pin, LOW); }
 
 //checking the request for the second LED diode
 if ( request.indexOf("LED2ON") > 0 ) { digitalWrite(LED2_Pin, HIGH); }
 if ( request.indexOf("LED2OFF") > 0 ) { digitalWrite(LED2_Pin, LOW); }
 
 //checking the state of the LED diode by reading the pin to which it is connected and depending on the result, we display the text about whether it is on or off 
 if (digitalRead(LED_Pin) == HIGH) { html_LED = "LED diode is on<br><br>"; }
 if(digitalRead(LED_Pin) == LOW) { html_LED = "LED diode is off<br><br>"; }
 //checking the state of the second LED diode
 if (digitalRead(LED2_Pin) == HIGH) { html_LED2 = "LED2 diode is on<br><br>"; }
 if(digitalRead(LED2_Pin) == LOW) { html_LED2 = "LED2 diode is off<br><br>"; }
 
 client.flush();
 //sending our html code to the client, it is displayed as a web page to the client (each string is a part of the page)
 client.print( header );
 client.print( html_1 );
 client.print( html_LED );
 client.print( html_2 );
 client.print( html_3 );
 //sending the code for the second LED diode
 client.print(html_LED2);
 client.print(html1_4);
 client.print(html1_5);
 //here you should add sending of the code for all buttons (before sending the html_end string)
 client.print( html_end);
 
 delay(5);
}