IoT-Enabled LCD Display

Want data at a quick glance? This project helps you set up internet connected display, which you can control over the Internet.

iot_lcd

Things used in this project

Hardware components

  • Bolt IoT Bolt WiFi Module
  • Arduino UNO & Genuino UNO
  • I2C/SPI character lcd

Software apps and online services

  • Arduino IDE
  • Bolt IoT Bolt Cloud

Story

The LCD along with the Bolt unit draws quite a bit of current from the system. Use of DC adapter is recommended.

Software setup:

  • Step 1) If you have not already done so create a Bolt Cloud account here.
  • Step 2) Download the Bolt app (for Android and Iphone), and follow the steps in the app to connect your Bolt WiFi module to your WiFi. (Skip if already done)
  • Step 3) Download the Arduino code from here. Flash it into the Arduino Uno(Do remember to disconnect the Bolt unit while doing so. The serial programming sometimes gets messed up due to it's presence.)

Now click on the API Tab and under the section for Generate Key, click on Enable.

enable_api

Next click on the copy button to copy your API key. Your API key will may look something like this: f1f918e9-d9c2-4e5b-aed0-b7cb743f74cf

  • Step 5) Save the following code as lcd_control.html, and open in in a browser. Once you enter the required data into the form, the form will run the command and also show you what the command looks like so that you can use it in your custom monitoring code.

lcd_control_html

Disclaimer: I am an Electronics engineer, and as such very new to javascript. But I have tried to put in all interlocks required to ensure that you can have the api call generated in a proper manner. If you face any issues do drop me a message, I will do my best to help you out.

Got-Ya's

There is a possibility that the display ends up showing your message in the following manner (see image below). This bug was detected in the Bolt Wifi module Firmware version 1.0.4 and fixed in the Bolt Wifi firmware version 1.0.5. If you see this error just follow the instructions, just use fing (Android and Iphone), to find the ip address of the Bolt Unit, and run the following command with it in a browser. The problem should go Away.

ip.addr.of.Bolt/update

 

Full Disclosure: I am an Embedded systems developer of the Bolt IoT Platform. So I will praise it quite frequently during this blog, not only because I have to sell it but also because I sincerely believe that one of the best IoT platform ever. I have used many other IoT Platforms in the past and Bolt makes IoT development seamless like none other.

 

Schematics

Bolt To Arduino To I2C LCD

This is a Fritzing schematic required for connecting the Bolt to the Arduino alongs with an I2C LCD

schematics1

Schematic in Fritzing

Checkout the image for an easy way to do all the connections.
connection

Code

API String generator

This code helps the user to generate an API call string, which sends text data out via the uart of the Bolt Wifi unit.
<!DOCTYPE html>
<html>
    <head>
        <title>Lcd Display Interface</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
    </head>
    <body>
        <div >Only enter numerical part of the bolt id. For example if you want to send data device with id BOLT452317, then enter 452317</div><br>
        <div>Bolt ID:<input type="Text" id="boltid" placeholder="xxxx"></div><br>
        <div>API key:<input type="Text" id="apikey" placeholder="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"></div><br>
        <div >Enter the message you want to display below</div><br>
        <input id="command" type="text" size="40"><br>
        <button onclick="SendCommand()">Send</button><br>
        <div id="display"></div><br>
        <div id="commandstatus"></div><br>
        <div id="commandvalue"></div><br>
        <script>
            link="";
            function SendCommand(){
                var apikey=document.getElementById('apikey').value;
                var devicename=document.getElementById("boltid").value;
                var command=document.getElementById('command').value;
                link="https://cloud.boltiot.com/remote/"+apikey+"/serialWrite?data="+command+"&till=10&baud=9600&deviceName=BOLT"+devicename;
                if(apikey==""){
                    document.getElementById('commandstatus').innerHTML="Please enter an api key"
                    return;
                }
                if(devicename==""){
                    document.getElementById('commandstatus').innerHTML="Please enter a device name"
                    return;
                }
                if(command==""){
                    document.getElementById('commandstatus').innerHTML="Please enter some data"
                    return;
                }
                $.get(link,function(success,value){
                    if(value=="success"){
                        if(success['success']==1){
                            document.getElementById('commandstatus').innerHTML="The link was successful";
                            document.getElementById('display').innerHTML="This is the link <a href=\""+link+"\">"+link+"</a>";
                        }else{
                            document.getElementById('commandstatus').innerHTML=success['value'];
                        }
                    }else{
                        document.getElementById('commandstatus').innerHTML="Please check the api key entered"
                    }
                });
            }
        </script>
    </body>
</html>

Arduino Code

https://github.com/Inventrom/bolt-lcd-display

 

 

IoT Bolt IoT