Kutluhan Aktar
Published © CC BY

IoT Tesla Coil and Cooling Fan on the Localhost

Develop a web application in PHP and JavaScript (w/ AJAX) to control a mini Tesla coil module and a cooling fan via Arduino Nano 33 IoT.

ExpertFull instructions provided4 hours4,568
IoT Tesla Coil and Cooling Fan on the Localhost

Things used in this project

Hardware components

Arduino Nano 33 IoT
Arduino Nano 33 IoT
×1
Arduino Mega 2560
Arduino Mega 2560
×1
DIY Mini Tesla Coil Module
×1
DigitSpace DC Motor Fan 130 DIY
×1
2-Way Relay
×1
Breadboard (generic)
Breadboard (generic)
×2
SparkFun Female Barrel Power to Wire Jack
×1
Resistor 220 ohm
Resistor 220 ohm
×1
5 mm LED: Green
5 mm LED: Green
×2
Jumper wires (generic)
Jumper wires (generic)
×1

Software apps and online services

Arduino IDE
Arduino IDE
Notepad++

Hand tools and fabrication machines

Soldering iron (generic)
Soldering iron (generic)
Solder Wire, Lead Free
Solder Wire, Lead Free
Hot glue gun (generic)
Hot glue gun (generic)

Story

Read more

Custom parts and enclosures

Fritzing

Schematics

Schematic

Circuit

Code

IoT_Tesla_Coil_and_Cooling_Fan.ino

Arduino
         ////////////////////////////////////////////////////  
        //       IoT Tesla Coil and Cooling Fan           //
       //                on Localhost                    //
      //           -------------------------            //
     //              Arduino Nano 33 IoT               //           
    //               by Kutluhan Aktar                // 
   //                                                //
  ////////////////////////////////////////////////////

// Develop a web application in PHP (Tesla Coil Controller) to control a Tesla coil and fan via Arduino Nano 33 IoT. 
// Get information from the Tesla Coil Controller without needing to trigger an event by hand.
//
// For more information:
// https://www.theamplituhedron.com/projects/IoT-Tesla-Coil-and-Cooling-Fan-on-the-Localhost
// 
// You can inspect the mentioned web application in free version on TheAmplituhedron before downloading on your computer if you are a subscriber:
// https://www.theamplituhedron.com/dashboard/Tesla-Coil-Controller
//
// Connections
// Arduino Nano 33 IoT:           
//                                2-Way Relay (5V)
// D2  --------------------------- IN_1
// D3  --------------------------- IN_2
//                                Cooling Fan Control LED (Green)
// D4  --------------------------- 



// Include required libraries:
#include <SPI.h>
#include <WiFiNINA.h>

char ssid[] = "[SSID]";       // your network SSID (name)
char pass[] = "[PASSWORD]";               // your network password (use for WPA, or use as key for WEP)
int keyIndex = 0;                          // your network key Index number (needed only for WEP)

int status = WL_IDLE_STATUS;

char server[] = "192.168.1.20";    // enter the loclhost address

// Define the application (Tesla Coil Controller) terminal path in the localhost.
String terminal = "/Tesla_Coil_Controller/terminal.php";

// Initialize the Ethernet client library
WiFiClient client;

// Define the data holders.
String readString, coil_status, fan_status;

// Define the 2-Way Relay input pins:
#define IN_1 2
#define IN_2 3

// Define the cooling fan control LED:
#define c_LED 4

void setup() {
Serial.begin(9600);

pinMode(IN_1, OUTPUT);
pinMode(IN_2, OUTPUT);
pinMode(c_LED, OUTPUT);

 // check for the WiFi module:
  if (WiFi.status() == WL_NO_MODULE) { Serial.println("Communication with WiFi module failed!"); }
  // attempt to connect to Wifi network:
  while (status != WL_CONNECTED) {
    Serial.print("Attempting to connect to SSID: ");
    Serial.println(ssid);
    // Connect to WPA/WPA2 network. Change this line if using open or WEP network:
    status = WiFi.begin(ssid, pass);
    // wait 10 seconds for connection:
    delay(10000);
     // Verify connection on the serial monitor.
     Serial.println("Connected to WiFi!");
  }

}

void loop() {
 // Connect to the web application named Tesla Coil Controller on the localhost.
 if (client.connect(server, 80)) {
   Serial.println("Connected to the localhost!"); // if you get a connection, report back via serial:
   // Make an HTTP request:
   client.println("GET " + terminal + "?feature=print HTTP/1.1");
   client.println("Host: 192.168.1.20");
   client.println("Connection: close");
   client.println();
   delay(1000);
 }else{
   Serial.print("Conection Failed!"); 
 }

 // Get the response text to obtain the command variables (coil and fan).
 while(client.available()){ char c = client.read(); readString += c; }
 if(readString != ""){
   // Split the reposnse string by a pre-defined delimiter in a simple way. '%'(percentage) is defined as the delimiter in this project.
   int delimiter_1 = readString.indexOf("%");
   int delimiter_2 = readString.indexOf("%", delimiter_1 +1);
   int delimiter_3 = readString.indexOf("%", delimiter_2 +1);
   // Glean information as substrings.
   coil_status = readString.substring(delimiter_1 + 1, delimiter_2);
   fan_status = readString.substring(delimiter_2 + 1, delimiter_3);

   readString = "";
 }

 Serial.println("Coil Status: " + coil_status);
 Serial.println("Fan Status: " + fan_status);

 // Activate the requested commands:
 if(coil_status == "ON"){ digitalWrite(IN_1, HIGH); }else if(coil_status == "OFF"){ digitalWrite(IN_1, LOW); }
 if(fan_status == "ON"){ digitalWrite(IN_2, HIGH); digitalWrite(c_LED, HIGH); }else if(fan_status == "OFF"){ digitalWrite(IN_2, LOW); digitalWrite(c_LED, LOW); }

}

class.php

PHP
<?php 

class tesla_coil {
	public $conn, $table;
	
	public function database_define($DBServerName, $DBUserName, $DBPassword, $DBName, $table){
		// Define the table name, and connect to the database.
		$this->table = $table;
		$this->conn = mysqli_connect($DBServerName, $DBUserName, $DBPassword, $DBName);
	}
	
	public function save_data($coil, $fan){
		// Save new commmands to the table.
		$sql = "UPDATE `$this->table` SET `coil`='$coil', `fan`='$fan' WHERE id=1";
		if(mysqli_query($this->conn, $sql)){ echo "SAVED!<br>Coil => ".$coil."<br>Fan => ".$fan; }else{ echo 'ERROR!'; }

	}
	
	public function print_data(){
		// Print the current command variables.
		$sql = "SELECT * FROM `$this->table` WHERE id=1";
		$result = mysqli_query($this->conn, $sql);
		while($rows = mysqli_fetch_assoc($result)){
			echo '%'.$rows['coil'].'%'.$rows['fan'].'%';
		}
	}
}

?>

terminal.php

PHP
<?php 

// Include the tesla_coil class.
include_once "class.php";
// Define a new tesla_coil object.
$tesla_coil = new tesla_coil();

// Define the database and the table in which you want to save data.
// Enter the server name, the user name, the user password, the database name (teslacoilcontroller), and the table name (values).
// On the localhost, these are the default settings. Change the database name (teslacoilcontroller) and the table name (values) if you created a different database and table.
$tesla_coil->database_define("localhost", "root", "", "teslacoilcontroller", "values");

// Depending on the feature variable, save new commands to the table or print the current command variables.
if(isset($_GET["feature"]) && $_GET["feature"] == "save" && isset($_GET["coil"]) && isset($_GET["fan"])){
	$tesla_coil->save_data($_GET["coil"], $_GET['fan']);
}

if(isset($_GET["feature"]) && $_GET["feature"] == "print"){
	$tesla_coil->print_data();
}


?>

index.html

HTML
<!DOCTYPE html>
<html>
<head>
 <title>Tesla Coil Controller</title>
 
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta name="theme-color" content="#ff5c33">
 <meta name="apple-mobile-web-app-status-bar-style" content="#ff5c33">

 <!--link to favicon-->
 <link rel="icon" type="image/png" sizes="36x36" href="icon.png">
 <link rel="icon" type="image/png" sizes="48x48" href="icon.png">
 <link rel="icon" type="image/png" sizes="78x78" href="icon.png">

  <!-- link to font -->
 <link href="https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@300;400&display=swap" rel="stylesheet">
 
 <!--link to index.css-->
 <link rel="stylesheet" type="text/css" href="index.css">
 
 <!-- link to FontAwesome-->
 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous">
 
  <!--link to jQuery script-->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

</head>
 <body>
<div id="controller">
<h2>Tesla Coil Controller</h2>
<p>Tesla Coil:</p>
<label>Activate <input type="radio" name="coil" value="ON"/> <span></span> </label>
<label>Deactivate <input type="radio" name="coil" value="OFF" checked /> <span></span> </label>
<p>Cooling Fan:</p>
<label>Activate <input type="radio" name="fan" value="ON"/> <span></span> </label>
<label>Deactivate <input type="radio" name="fan" value="OFF" checked /> <span></span> </label>
<p id="text">Waiting...</p>
</div>

<!-- Implement the index.js file -->
<script type="text/javascript" src="index.js"></script>

 </body>
 </html>

index.css

CSS
html{background-color:#eb2e00;font-family: 'Roboto Slab', serif;}

div{display:block;background-color:#1F2020;width:80%;margin:auto;border:2px solid white;border-radius:20px;padding-left:10px;padding-right:10px;}
h2{color:white;font-size:25px;text-align:center;user-select:none;}
p{color:#A5282C;text-decoration:underline;font-size:20px;}
#text{text-align:center;color:#F3D060;font-size:15px;text-decoration:none;}

label {display:block;position:relative;cursor:pointer;font-size:25px;color:#F3D060;user-select:none;padding-left:35px;margin-left:20px;margin-top:20px;margin-bottom:20px;}
label input{position:absolute;height:0;width:0;}
span {position:absolute;top:1px;left:0;height:30px;width:30px;background-color:#EE7762;}
span:after {content: "\2714";position: absolute;top:-1px;right:5px;display:none;color:#5EB0E5;}
label:hover span {background-color:#A5282C;}
label input:checked ~ span {background-color:#A5282C;}
label input:checked ~ span:after {display: block;}

index.js

JavaScript
document.getElementById("controller").addEventListener("input", () => {
	// Define variables.
	let coil, fan;
	// Get selected values.
	document.getElementsByName("coil").forEach((object) => { if(object.checked) coil = object.value; });
	document.getElementsByName("fan").forEach((object) => { if(object.checked) fan = object.value; });
	
	$.ajax({
		// Define the required variables to save commands to the database.
		url: "terminal.php?feature=save&coil=" + coil + "&fan=" + fan,
		type: "GET",
		success: (response) => {
			// Print the response text to see whether it is successful or not.
			$("#text").html("DATA => " + response);
		}
	});
});

table.sql

SQL
-- CREATE A DATABASE TABLE NAMED VALUES --

CREATE TABLE `values`(
   id int(11) AUTO_INCREMENT PRIMARY KEY NOT NULL,
   coil varchar(255) NOT NULL,
   fan varchar(255) NOT NULL
    
);

-- INSERT DEFAULT VARIABLES -- 

INSERT INTO `values`(`coil`, `fan`) VALUES ('OFF', 'OFF');

Credits

Kutluhan Aktar

Kutluhan Aktar

79 projects • 291 followers
Self-Taught Full-Stack Developer | @EdgeImpulse Ambassador | Maker | Independent Researcher

Comments

Related channels and tags
  • Arduino
  • DigitSpace
  • Home Automation
  • SparkFun