Published January 10, 2019 © GPL3+

A Cooler Way to Warm Up Your Car

It's winter. Don't let your car run for 20 minutes just for a little warmth. Build this WiFi-connected heater and spare the pollution!

IntermediateShowcase (no instructions)3 hours1,046

Things used in this project

Hardware components

NodeMCU Development Board

5V/30A Relay Module

DHT22 Temperature Sensor

LED (generic)

5V USB Charger

Plastic Enclosure

Rubber Grommet

Extension Cord

Software apps and online services

Arduino IDE

Story

Preface:

The Wisconsin winter was settling in and my 2005 Buick LeSabre was destined to become an icicle once again. I pondered constructing a remote car starter using the venerable ESP8266 module. It’s been done many times before with various MCUs, and well-documented tutorials exist. But as I read several forum posts regarding this topic, I began to form a new opinion about the age old tradition of “warming up the car." Instead of running the engine for heat, I thought, why not use a small electric space heater? Not a breakthrough idea by any stretch, but one that had not occurred to me before.

Things I considered:

Information from several sources suggested that idling a car’s engine at cold temperatures promotes oil breakdown and excessive mechanical wear.
Idling your engine for 20 minutes or more multiple times a day (just to have a comfortable cabin temperature) is bad for the environment.
I have access to outdoor power (120v) and WiFi at home and at work; the two places my car spends most of its time.
I already owned a small 1500W electric heater.

With all that in mind, a remote controlled electric heater seemed like the perfect alternative, with the caveat that I’d have to plug it in every time I exit the car. But I can live with that...

After experimenting with the heater by itself on a few cold mornings, I was encouraged by the results. The small heater was able to warm the car’s cabin to a comfortable temp and defrost the windows in about the same amount of time that the car’s engine heat would take.

It's hot... but not "set your car on fire" hot

*Safety: I chose to place the heater on the floor of the passenger seat. After heating for 30 minutes, I checked the area around the heater for hot spots and was not worried about melting or burning any part of the car’s interior. The output of the small heater is simply not hot enough to cause damage or risk fire. Furthermore, this model heater has built-in thermal protection and a tip-over kill switch that will cut power if the device overheats or falls over.

The Build:

There are many approaches to consider with a project like this. Should it use WiFi, BLE, connect to internet or not, broadcast an AP, connect to a local network? I had some past successes with the ESP8266 and wanted to gain more experience with web development, so I chose to build the device to connect to my local WiFi network and serve up a simple webpage, avoiding any need to connect to the internet. I stumbled upon Mikael Söderström’s blog and decided this was a perfect place to begin.

The hardware is minimal:

ESP8266 development board
5V/30A relay module to control the heater
Temperature sensor
LED to indicate status
5V power supply
Plastic enclosure
Rubber grommets
Extension cable

I already had a water-resistant DS18B20 temperature sensor, but instead decided to use a DHT22 as it had a faster response to temp changes and provided adequate thermal separation from the other components. For power, I disassembled a spare 750mA USB wall charger.

almost together...

Assembly was a bit tricky because I chose a small enclosure. Modifying both the power supply and the relay module was necessary to get it all to fit. The result turned out well, with a nice tight fit ensuring that the low and high voltage components would stay safely separated.

The Code:

I made several additions to Mikael’s code to achieve the desired functionality. I really liked the looks of his simple, yet colorful webpage to display the temperature. I started by adding the ESP8266WifiMulti library to store both my home and work WiFi networks. I added the mDNS library to avoid having to always know the device’s (potentially changing) IP address.

In my implementation, the client is polling the server for both the temperature and the relay state once per second. In this way, the web UI is always able to adapt to the state of the device. This is not a very efficient method, as it is creating lots of network traffic, but it works for me at the moment. I didn’t feel the need to mess with websockets or another method of data transfer for this first version. Perhaps the next version will be cloud-connected and use MQTT...

I also added a couple of functions for safety: a heat timeout, and an over-temp cut off. If I accidentally leave the heat on, it will shut off after 1 hour. If the temp in the car reaches 90 degrees F, the heat will shut off. (Or whichever happens first)

The webpage has a lot of dynamic content. The temperature will update automatically, and the background color gradient will change in response to the temperature range. The button toggles the heater on and off, and will only change state upon a successful response from the device. The button will also toggle its state when either the safety timeout or over-temp limit is reached. Additionally, an over-temp message will appear on the screen and the button will temporarily deactivate while the temp limit is surpassed. Reloading the page will not affect how the user interface looks or functions.

Since the web code was becoming a bit lengthy, I switched from a string concatenation method, to loading the page data from a char array stored in PROGMEM. Not only is this more efficient for the MCU to process, but it separates the web code nicely from the device code and makes the program much more readable.

cooler temp

Hotter temp

There is plenty of room for improvement. Currently, there is little error handling or input validation implemented. I’m just sort if relying on the TCP/IP stack to handle network errors, and assuming the device will function the way I want it to. Here’s hoping!

Code

#include <WiFiClient.h>
#include <ESP8266WiFiMulti.h>
#include <ESP8266WebServer.h>
#include <ESP8266mDNS.h>
#include <DHT.h>
#include "root.h"

#define DHTPIN  D5              
#define DHTTYPE DHT22  

ESP8266WiFiMulti wifiMulti;
ESP8266WebServer server(80);
DHT dht(DHTPIN, DHTTYPE);

const int RELAY = D6;
const int LED = D7;
const long checkRelayInterval = 3600000;  // 1 hour safety shutoff
unsigned long checkTempInterval = 1000;

String text;
double temperature;
float bTemp = (dht.readTemperature(true)) - 2.9;  // A backup temp in case getTemperature() returns NaN. (-2.9 for calibration)
boolean getRelayOnTimeHasRun = false;
boolean checkSafetyTempHasRun = false;
unsigned long currentMillis = 0;
unsigned long relayOnMillis = 0;
unsigned long checkTempMillis = 0;

void setup(void){
  Serial.begin(115200);
  
  pinMode(RELAY, OUTPUT);
  digitalWrite(RELAY, 0);
  pinMode(LED, OUTPUT);
  digitalWrite(LED, 1);

  dht.begin();
  temperature = getTemperature();

  wifiMulti.addAP("your ssid 1", "your pw 1");
  wifiMulti.addAP("your ssid 2", "your pw 2");

  Serial.print("Connecting");
  int attemptCounter = 0;
  
  while (wifiMulti.run() != WL_CONNECTED) {   // Scan for wifi networks and connect to the strongest of the networks listed above
    Serial.print('.');
    digitalWrite(LED, 0);   // Blink LED slowly while wifi is connecting
    delay(450);
    digitalWrite(LED, 1);
    delay(450);

    if (attemptCounter >= 15) {  // If wifi can't connect, blink LED fast to indicate error
      while(1){
        digitalWrite(LED, 0);
        delay(150);
        digitalWrite(LED, 1);
        delay(150);
      }
    }
    attemptCounter ++;
  }
  Serial.println();
  Serial.print("Connected to: ");
  Serial.println(WiFi.SSID());              
  Serial.print("IP address: ");
  Serial.println(WiFi.localIP());          
  
  if (MDNS.begin("wifiheat", WiFi.localIP())) {   // Start the mDNS responder for wifiheat.local
    Serial.println("mDNS responder started");
  } else {
    Serial.println("Error setting up MDNS responder!");
  }

  server.on("/", []() {server.send_P(200, "text/html", PAGE_ROOT);});
  server.on("/heatOn", handleHeatOn);
  server.on("/heatOff", handleHeatOff);
  server.on("/data.txt", handleTemperature);
  server.on("/heatState", handleHeatState);
    
  server.begin();
  Serial.println("Web server started");

  for (int i=0; i<4; i++) {
    digitalWrite(LED, 0);   // Setup was successful, fast blink LED 4 times
    delay(70);
    digitalWrite(LED, 1);
    delay(70);
  }
}

void handleTemperature() {
  text = String(temperature, 1);
  server.send(200, "text/html", text);
}

void handleHeatOn() { 
  Serial.println("Heat ON");
  digitalWrite(RELAY, HIGH);
  server.send(200, "text/html", "");
}

void handleHeatOff() { 
  Serial.println("Heat OFF");
  digitalWrite(RELAY, LOW);
  server.send(200, "text/html", "");
}

void handleHeatState() { 
  String heatState = String(digitalRead(RELAY));
  server.send(200, "text/html", heatState);
}

float getTemperature() {
  float temp = (dht.readTemperature(true)) - 2.9;  // Returns temperature in F, subtracted 2.9 for calibration
  
  if(!isnan(temp)){  // Prevents the UI from displaying the NaN that is occasionally returned from the DHT22
    bTemp = temp;
    return(temp);
  }
  else{
    return(bTemp);
  }
}

void checkTemperatureOnInterval() {
  if (currentMillis - checkTempMillis >= checkTempInterval) {
    checkTempMillis = currentMillis;
    temperature = getTemperature();
  }
}

void checkSafetyTemp() {
  if (digitalRead(RELAY) && temperature >= 90) {
    if (checkSafetyTempHasRun == false) { 
      Serial.println("Safety temperature limit reached!");
      Serial.println("Turning heat OFF");
      digitalWrite(RELAY, LOW);
      checkSafetyTempHasRun = true;
    }
  } 
  if (digitalRead(RELAY) && checkSafetyTempHasRun) {
    checkSafetyTempHasRun = false;
  }
}

void checkSafetyTimeout() {
  if (getRelayOnTimeHasRun == false) {   
    if (digitalRead(RELAY)) {   // Save millis time when relay is turned on. Do this one time only.
      relayOnMillis = currentMillis;
      getRelayOnTimeHasRun = true;
    }  
  }

  if (!digitalRead(RELAY)) {   // If relay was turned off anytime before timeout is met, toggle getRelayOnTimeHasRun to reset the counter
    getRelayOnTimeHasRun = false;
  }
  
  if (getRelayOnTimeHasRun && currentMillis - relayOnMillis >= checkRelayInterval) {
    Serial.println("Safety time limit reached!");
    Serial.println("Turning heat OFF");
    digitalWrite(RELAY, LOW);
    getRelayOnTimeHasRun = false;
  }
}

void loop() {
  while (wifiMulti.run() != WL_CONNECTED) {  
    digitalWrite(RELAY, LOW);   // Turn heat off if wifi has disconnected
    Serial.println("WiFi disconnected!");
    digitalWrite(LED, 0);   // Blink LED fast to indicate disconnected state
    delay(150);
    digitalWrite(LED, 1);
    delay(150);
  }
  
  server.handleClient();
  currentMillis = millis();
  checkTemperatureOnInterval();
  checkSafetyTimeout();
  checkSafetyTemp();
}

const char PAGE_ROOT[] PROGMEM = R"=====(
<!DOCTYPE html>
<html>
   <head>
      <title>Wifi Car Heater</title>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
      <link href='https://fonts.googleapis.com/css?family=Advent+Pro' rel="stylesheet" type="text/css">
      <style>
         html {height: 100%;}
         h2 {font-size: 90px;font-weight: 400;margin: 0;display: inline-block;}
         h4 {color: white;text-align: center;padding: 10px;}
         body {height: 100%;overflow: hidden;}
         .content {color: #fff;font-family: 'Advent Pro';font-weight: 400;left: 50%;position: absolute;text-align: center;top: 43%;transform: translateX(-50%) translateY(-50%);width: 250px;}
         .warning {margin: 0 auto;margin-top: 60px;background-color: red;width: 320px;border-radius: 10px;visibility: hidden;}
         .cold {background: linear-gradient(to bottom, #cee0ff, #0665e0 );}
         .medium {background: linear-gradient(to bottom, #cee0ff, #ffb97c);}
         .hot {background: linear-gradient(to bottom, #fcdb88, #d32106);}
         .button {background-color: grey;border: 2px solid white;outline: none;color: white;min-width: 130px;min-height: 50px;text-align: center;display: block;font-size: 16px;border-radius: 12px;position: relative;top: 25px;left:60px;}
      </style>
      </style>
   </head>
   <body class="">
      <div class="warning" id="warning">
         <h4>Temperature safety limit exceeded</h4>
      </div>
      <div class="content">
         <h1>Cabin Temperature</h1>
         <h2 id="data">--.-</h2>
         <h2>&nbsp;<small>&deg;F</small></h2>
         <button class="button" id="button" onclick="buttonToggle()">Heat OFF</button>
      </div>
      <script>  
          loadData("data.txt", updateData);
          loadData("heatState", heatStateCallback);
          
          setInterval(function () {
             loadData("data.txt", updateData);
          }, 5000);
          setInterval(function () {
             loadData("heatState", heatStateCallback);
          }, 1000);

          function loadData(url, callback) {
             var request = new XMLHttpRequest();
             request.onreadystatechange = function () {
                if (this.readyState == 4 && this.status == 200) {
                   callback.apply(request);
                }
             };
             request.open("GET", url, true);
             request.send();
          }

          function heatStateCallback() {
             var button = document.getElementById("button");
             if (this.response == 1) {
                button.innerHTML = "Heat ON";
                button.style.background = "red";
                button.style.border = "2px solid white";
             } else {
                button.innerHTML = "Heat OFF";
                button.style.background = "grey";
                button.style.border = "2px solid white";
             }
          }

          function updateData() {
             document.getElementById("data").innerHTML = this.responseText;
             changeBackgroundColor(this.response);
             tempLimitWarning(this.response);
          }

          function tempLimitWarning(temperature) {
            var warning = document.getElementById("warning");
            var button = document.getElementById("button");
            if (temperature >= 90) {
              warning.style.visibility = "visible";
              button.disabled = true;
            } else {
              warning.style.visibility = "hidden";
              button.disabled = false;
            }
          }
          
          function changeBackgroundColor(temperature) {
             if (temperature < 35) {
                document.body.className = "cold";
             } else if (temperature > 65) {
                document.body.className = "hot";
             } else document.body.className = "medium";
          }

          function buttonToggle() {
             var button = document.getElementById("button");
             if (button.innerHTML === "Heat OFF") {
                button.style.border = "2px solid purple";
                loadData("heatOn", heatOnCallback);
                function heatOnCallback() {}
             } else {
                button.style.border = "2px solid purple";
                loadData("heatOff", heatOffCallback);
                function heatOffCallback() {}
             }
          }
      </script>
   </body>
</html>
)=====";

Credits

Brian Harrah

1 project • 2 followers

A Cooler Way to Warm Up Your Car

Things used in this project

Hardware components

Software apps and online services

Story

Preface:

The Build:

The Code:

Schematics

Wiring

Code

wifi_car_heater.ino

root.h

Credits

Brian Harrah

Comments

Embed the widget on your own site

A Cooler Way to Warm Up Your Car

A Cooler Way to Warm Up Your Car

Things used in this project

Hardware components

Software apps and online services

Story

Preface:

The Build:

The Code:

Schematics

Wiring

Code

wifi_car_heater.ino

root.h

Credits

Brian Harrah

Comments

Related channels and tags