Raspberry Tank With Web Interface and Video Streaming

3,082

41

4

Introduction: Raspberry Tank With Web Interface and Video Streaming

We are going to see how I’ve realized a little WiFi Tank, capable of remote Web Control and Video Streaming.

This is intended to be tutorial that require basic knowledge of electronic and software programming. For this reason I’ve chosen a Tank chassis Kit (instead of printing it using 3D printer, may be a later upgrade) and a total of 6 components including batteries. On software side you can follow step by step the installation process and programming is kept at minimum, a basic knowledge of Raspberry things can help.

I’ve estimated 12 h of work from 0 to ready to run tank. Total cost of 70€ for all components.

Step 1: BOM

1 - DIY RC Robot Chassis Tank - 32 (€)

https://www.banggood.com/DIY-RC-Robot-Chassis-Tan...

1 - Dual Channel L298N DC Motor Driver Board - 1,39 (€)

https://www.banggood.com/Dual-Channel-L298N-DC-Mo...

1 - Raspberry Pi Zero W Starter Kit - 26 (€)

http://amzn.eu/1ugAaMP

1 - 16 GB SD Card - 5,50(€)

https://www.gearbest.com/memory-cards/pp_337819.h...

1 - Raspberry Pi 5MP Camera Module Webcam for Model Zero - 8 (€)

https://www.gearbest.com/raspberry-pi/pp_612249.h...

1 - Power Bank 5V

1 - 9v battery

Mixed Breadboard Cable Dupont Connector

Mouse, keyboard, Monitor or TV for Raspberry setup (optional, just to make first setup easyer)

Step 2: Main Components Specs

Motor

JGA25-370 DC gearmotor

This motor features a D-shaped output shaft.

Specifications

· Operating voltage: between 6 V and 18 V

· Nominal voltage: 12 V

· Free-run speed at 12 V: 399 RPM

· Free-run current at 12 V: 50 mA

· Stall current at 12V: 1200 mA

· Stall torque at 12V: 2.2 kg.cm

· Gear ratio: 1:21

· Reductor size: 19 mm

· Weight: 84 g

Dual Channel L298N DC Motor Driver Board

Dual H-bridge motor driver, can drive two DC motors or a 4-wire two-phase stepper motors. Built-in TSD, to protect from motor stall.

Specifications

· Module supply voltage: DC 2V-10V

· Signal input voltage: DC 1.8-7V

· Single working current: 1.5A

· Peak current up to 2.5A

· Low standby current (less than 0.1uA)

· Built-in common conduction circuit, the input terminal vacant, the motor does not malfunction

· Size: 24.7 x 21 x 7mm

Step 3: WIRING

This will be the final wiring, but WAIT, before we need to install some

software and it’s a good idea to test it with simplier wiring, when ready that come back here.

We need two different power source, one for the motor and one for the Raspberry.

The motor driver Dual Channel L298N DC Motor Driver Board (max input voltage DC 2V-10V) is powered by using the 9V battery and Raspberry Pi uses the standards 5V USB accumulator.

The GND pin of the motor driver will be connected to the battery minus and Raspberry Pi (GND). The GPIO pins of Raspberry Pi are connected to the motor driver as table.

Step 4: PREPARING RASPBERRY O.S.

This is a standard installation for Raspbian operative system, you can find

a lot of detailed tutorial searching the web, basically the steps are:

1. Download iso RASPBIAN STRETCH WITH DESKTOP from https://www.raspberrypi.org/downloads/raspbian/

2. Format a 16 GB SD Card, I’ve used SD Formatter https://www.sdcard.org/downloads/formatter_4/

3. Burn .IMG file, I’ve used Win32DiskImager https://sourceforge.net/projects/win32diskimager/

Now your raspberry is ready to boot, connect it to an USB power source (5V, 2A) and prepare for first boot setup. You can do it in two ways, using external devices like mouse, keyboard and monitor or using your PC and a remote connection to Raspberry. There are a lot of tutorial about this, one is: https://core-electronics.com.au/tutorials/raspberry-pi-zerow-headless-wifi-setup.html

Step 5: HOW TO CONTROL OUR WIFI TANK WITH NODE.JS AND WEBSOCKET.IO

Now we have a fresh installation of our Raspberry micro PC ready to run our job, so … what do we use to issue commands to the tank?

Python is a very easy to use language that is commonly used to run Rapsberry project sand can be easly used also to interact with Rapsberry input and output pins (GPIO) https://www.raspberrypi.org/documentation/usage/p...

But, my goal was to connect my tank wi-fi from any device (PC, mobile phone, tablet…) using a common web browser and also stream video from it. So, forget Python for now, and lets move on NODE.JS and SOCKET.IO.


NODE.js

Node.js (https://github.com/nodejs/node/wiki) is an open source server frame work based on js language. Since I’m using Raspberry Pi Zero (ARMv6 CPU) we can’t use the automatic installation process (intended for ARMv7 CPU) and we need to do it manually:

Download Nodejs locally, (I’ve used 7.7.2 version for ARMv6, check other versions here https://nodejs.org/dist/ )

pi@raspberry:~ $ wget

https://nodejs.org/dist/v7.7.2/node-v7.7.2-linux-...

Once done, extract the compressed file:

pi@raspberry:~ $ tar -xzf node-v7.7.2-linux-armv6l.tar.gz

Copy and Install the files into /user/local

pi@raspberry:~ $ sudo cp -R node-v7.7.2-linux-armv6l/* /usr/local/

Add the location where we install nodejs to path, edit “.profile” file:

pi@raspberry:~ $ nano ~/.profile

Add the following line at the end of the file, save and exit

 PATH=$PATH:/usr/local/bin

Remove the downloaded file:.

pi@raspberry:~ $ rm ~/node-v7.7.2-linux-armv6l.tar.gz
pi@raspberry:~ $ rm -r ~/node-v7.7.2-linux-armv6l

Type the following commands to check nodejs installation:

pi@raspberry:~ $ node -v
pi@raspberry:~ $ npm -v

You should read v7.7.2 and v4.1.2 as response.

If everything went well, create a new folder to host your nodejs files:

pi@raspberry:~ $ mkdir nodehome

Move inside new folder:

pi@raspberry:~ $ cd nodehome

Install additional module required to manage GPIO in most basic way, ON and OFF:

pi@raspberry:~ $ npm install onoff

Now is time to test our first project “Blink.js”, the result will be … a blinking LED

pi@raspberry:~ $ nano blink.js

Paste following code, save and exit:

var Gpio = require('onoff').Gpio; //include onoff

var LED = new Gpio(3, 'out'); //use GPIO 3

var blinkInterval = setInterval(blinkLED, 250); //blink LED every 250ms

function blinkLED() { //function to start blinking

if (LED.readSync() === 0) { //check the pin state, if the state is 0 (or off)

LED.writeSync(1); //set pin state to 1 (turn LED on)

} else {

LED.writeSync(0); //set pin state to 0 (turn LED off)

}

}

function endBlink() { //function to stop blinking

clearInterval(blinkInterval); // Stop blink intervals

LED.writeSync(0); // Turn LED off

LED.unexport(); // Unexport GPIO to free resources

}

setTimeout(endBlink, 5000); //stop blinking after 5 seconds

Wire a LED, a Resistor (200ohms) as shown in the schema and run the project:

 pi@raspberry:~ $ node blink.js

Node is ready.

SOCKET.IO

WebSocket is a computer communications protocol, based on TCP connection, it provide a programmer to create a server and client. The client connects to the server and emits and receives messages to and from the server. WebSocket implementation for Node.js is called Socket.io (https://socket.io/ ).

Install socket.io:

pi@raspberry:~ $ npm install socket.io --save

Move inside nodejs home, created previusly:

 pi@raspberry:~ $ cd nodehome

And create a new folder “public”:

pi@raspberry:~ $ mkdir public

Create new sample web server, call it “webserver.js”

pi@raspberry:~ $ nano webserver.js

Paste following code, save and exit:

var http = require('http').createServer(handler); //require http server,
and create server with function handler()

var fs = require('fs'); //require filesystem module

http.listen(8080); //listen to port 8080

function handler (req, res) { //create server

fs.readFile(__dirname + '/public/index.html', function(err, data) { //read file index.html in public folder

if (err) {

res.writeHead(404, {'Content-Type': 'text/html'}); //display 404 on error

return res.end("404 Not Found");

}

res.writeHead(200, {'Content-Type': 'text/html'}); //write HTML

res.write(data); //write data from index.html

return res.end();

});

}

This webserver will listen your Raspberry port 8080 and provide file sto any web client connecting it. Now we need to create something to host and provide to our clients: Move inside “public” folder: pi@raspberry:~ $ cd public

Create new html file “index.html”:

pi@raspberry:~ $ nano index.html

Paste code from attached "HelloWorld.txt", save and exit.

Move inside nodejs folder "nodehome”:

pi@raspberry:~ $ cd nodehome

Start HTTP web server:

pi@raspberry:~ $ node webserver.js

Open the website in a browser using http://Raspberry_IP:8080/ (replace Raspberry_IP with your IP)

Step 6: ADDING VIDEO STREAMING CAPABILITY

There are different way to implement video streaming on a Raspberry, easiest

way I’ve found till now, that as great performance and can be integrated in a web interface is base on the project from Miguel Mota:

https://miguelmota.com/blog/raspberry-pi-camera-bo...

Thanks Miguel! From his blog these are the steps:

Install components libjpeg8 and cmake:

 pi@raspberry:~ $ sudo apt-get install libjpeg8
 pi@raspberry:~ $ sudo apt-get install libjpeg8-dev
 pi@raspberry:~ $ sudo apt-get install cmake

Download mjpg-streamer with raspicam plugin:

pi@raspberry:~ $ git clone
  <a href="https://github.com/jacksonliam/mjpg-streamer.git"> https://github.com/jacksonliam/mjpg-streamer.git </a> ~/mjpg-streamer

Change directory:

pi@raspberry:~ $ cd ~/mjpg-streamer/mjpg-streamer-experimental

Compile:

pi@raspberry:~ $ make clean all

Replace old mjpg-streamer:

 pi@raspberry:~ $ sudo rm -rf /opt/mjpg-streamer
pi@raspberry:~ $ sudo mv ~/mjpg-streamer/mjpg-streamer-experimental
  /opt/mjpg-streamer
 pi@raspberry:~ $ sudo rm -rf ~/mjpg-streamer

Create a new “start_stream.sh” file, copy and paste from attached "start_stream.txt" file.

Make it executable (create shell scripts):

 pi@raspberry:~ $ chmod +x start_stream.sh

Start Streaming server:

 pi@raspberry:~ $ ./start_stream.sh

Open the website in a browser using http://Raspberry_IP:9000 (replace Raspberry_IP with your IP)

Step 7: TANK PROGRAM

Everything is ready, now we have to create our web page to control the tank (index.html) and our web server to listen our commands (webserver.js). So, just replace the files seen till now (just examples to test the system) with the attached webserver.txt and index.txt.

Step 8: START CONTROL INTERFACE AND STREAMING SERVER

To start the services open two terminal windows and run these commands:

node nodehome/webserver.js
./nodehome/start_stream.sh

Open the website in a browser using http://Raspberry_IP:8080 (replace Raspberry_IP with your IP)

Share

    Recommendations

    • Tiny Home Contest

      Tiny Home Contest
    • Audio Contest 2018

      Audio Contest 2018
    • Metalworking Contest

      Metalworking Contest

    4 Discussions

    That looks great! I am working on a very similar robot. The main challenge I found was getting a (near) real-time video stream. I wound up using UV4L with a very low latency, but I would prefer an alternative since UV4L has a web-based config page I can't seem to kill. How is the latency for your method?

    3 replies

    Also, you could have a look at the 'gamepad' lib. for HTML5. It works nicely with node.js and it is really a lot of fun controlling your robot using a joystick (most joysticks will work, but support for the xbox 360 controller seems to be the best at this moment)

    look very nice! I was wondering to improve the web control interface, this could be a very good choice! Thank you

    Hi, sorry i'm not sure of exact latency measure, but it seems almoust realtime to me