Example12

Controlling DC motor with buttons

For this example we start from the example 09. The hardware schematics is shown in the next figure. Here we use h-bridge TB6612FNG.

The breadboard view is shown in the next figure:

We then initialize the board:

var board = new firmata.Board("/dev/ttyACM0", function() { // ACM Abstract Control Model for serial communication with Arduino (could be USB)

    console.log("Arduino connect");

    board.pinMode(2, board.MODES.OUTPUT); // direction of DC motor

    board.pinMode(3, board.MODES.PWM); // PWM of motor i.e. speed of rotation

    board.pinMode(4, board.MODES.OUTPUT); // direction DC motor

    board.digitalWrite(2,1); // initialization of digital pin 2 to rotate Left on start

    board.digitalWrite(4,0); // initialization of digital pin 2 to rotate Left on start

});

Then we define new functions within the socket:

wss.on('connection', function (ws, req) { // start of wss code

    messageJSON = {"type": "message", "content": "Srv connected, board OK"};

    ws.send(JSON.stringify(messageJSON));

    ws.on("message", function (msgString) { // message comes as string -> msgString

        var msg = JSON.parse(msgString); // string from ws which comes as a string is put to JSON

        switch(msg.type) {

            case "sendPWM":

                board.analogWrite(3,msg.pwm);

                console.log("pwm");

                messageJSON = {"type": "message", "content": "PWM set to: " + msg.pwm};

                ws.send(JSON.stringify(messageJSON));

            break;

            case "left":

                board.digitalWrite(2,msg.AIN1);

                board.digitalWrite(4,msg.AIN2);

                console.log("left");

                messageJSON = {"type": "message", "content": "Direction: left"};

                ws.send(JSON.stringify(messageJSON));

            break;

            case "right":

                board.digitalWrite(2,msg.AIN1);

                board.digitalWrite(4,msg.AIN2);

                console.log("right");

                messageJSON = {"type": "message", "content": "Direction: right"};

                ws.send(JSON.stringify(messageJSON));

            break;

            case "stop":

                board.analogWrite(3,msg.pwm);

                console.log("Stop");

                messageJSON = {"type": "message", "content": "Stop"};

                ws.send(JSON.stringify(messageJSON));

            break;

    }); // end of wss.on code

}); // end of wss on connection

On the client side (html file) we create a few buttons:

<body>

PWM: <input id="pwm" value=100 />

<button id="buttonSendPWM" onClick="sendPWM()">Send PWM</button>

<button id="buttonLeft" onClick="left()">Left</button>

<button id="buttonRight" onClick="right()">Right</button>

<button id="buttonStop" onClick="stop()">Stop</button>

Then we declare functions that are connected that are triggered by the buttons:

function sendPWM () {

    valuePWM = document.getElementById("pwm").value;

    messageJSON = {"type": "sendPWM", "pwm": valuePWM}; // JSON structure of the message

    ws.send(JSON.stringify(messageJSON)); // we have to stringify JSON to send it over websocket

};

function left() {

    messageJSON = {"type": "left", "AIN1": 0, "AIN2": 1};

    ws.send(JSON.stringify(messageJSON)); // we have to stringify JSON to send it over websocket

};

function right() {

    messageJSON = {"type": "right", "AIN1": 1, "AIN2": 0};

    ws.send(JSON.stringify(messageJSON)); // we have to stringify JSON to send it over websocket

};

function stop() {

    messageJSON = {"type": "stop", "pwm": 0};

    ws.send(JSON.stringify(messageJSON)); // we have to stringify JSON to send it over websocket

};

The outlook of the GUI in Chrome is shown in the next figure:

example12.js

var http = require("http").createServer(handler); // on req - hand

var fs = require("fs"); // variable for file system for providing html

var firmata = require("firmata");

const WebSocket = require('ws'); // for permanent connection between server and client

const wss = new WebSocket.Server({port: 8888}); // websocket port is 8888

var messageJSON;

console.log("Starting the code");

var board = new firmata.Board("/dev/ttyACM0", function() { // ACM Abstract Control Model for serial communication with Arduino (could be USB)

    console.log("Arduino connect");

    board.pinMode(2, board.MODES.OUTPUT); // direction of DC motor

    board.pinMode(3, board.MODES.PWM); // PWM of motor i.e. speed of rotation

    board.pinMode(4, board.MODES.OUTPUT); // direction DC motor

    board.digitalWrite(2,1); // initialization of digital pin 2 to rotate Left on start

    board.digitalWrite(4,0); // initialization of digital pin 2 to rotate Left on start

});

function handler(req, res) {

    fs.readFile(__dirname + "/example12.html",

    function (err, data) {

        if (err) {

            res.writeHead(500, {"Content-Type": "text/plain"});

            return res.end("Error loading html page.");

    res.writeHead(200);

    res.end(data);

})

http.listen(8080); // server will listen on port 8080

board.on("ready", function() {

wss.on('connection', function (ws, req) { // start of wss code

    messageJSON = {"type": "message", "content": "Srv connected, board OK"};

    ws.send(JSON.stringify(messageJSON));

    ws.on("message", function (msgString) { // message comes as string -> msgString

        var msg = JSON.parse(msgString); // string from ws which comes as a string is put to JSON

        switch(msg.type) {

            case "sendPWM":

                board.analogWrite(3,msg.pwm);

                console.log("pwm");

                messageJSON = {"type": "message", "content": "PWM set to: " + msg.pwm};

                ws.send(JSON.stringify(messageJSON));

            break;

            case "left":

                board.digitalWrite(2,msg.AIN1);

                board.digitalWrite(4,msg.AIN2);

                console.log("left");

                messageJSON = {"type": "message", "content": "Direction: left"};

                ws.send(JSON.stringify(messageJSON));

            break;

            case "right":

                board.digitalWrite(2,msg.AIN1);

                board.digitalWrite(4,msg.AIN2);

                console.log("right");

                messageJSON = {"type": "message", "content": "Direction: right"};

                ws.send(JSON.stringify(messageJSON));

            break;

            case "stop":

                board.analogWrite(3,msg.pwm);

                console.log("Stop");

                messageJSON = {"type": "message", "content": "Stop"};

                ws.send(JSON.stringify(messageJSON));

            break;

    }); // end of wss.on code

}); // end of wss on connection

}); // end of board.on ready

example12.html

<!DOCTYPE html>

<meta charset = utf8>

<html>

<head>

    <title>Example with DC motor and buttons</title>

</head>

<body>

PWM: <input id="pwm" value=100 />

<button id="buttonSendPWM" onClick="sendPWM()">Send PWM</button>

<button id="buttonLeft" onClick="left()">Left</button>

<button id="buttonRight" onClick="right()">Right</button>

<button id="buttonStop" onClick="stop()">Stop</button>

<div id="divForPrint"></div>

<br>

<script type="text/javascript">

var divForPrint = document.getElementById("divForPrint");

// var for printing messages

var numberOfLinesInLog = 20; // variable for the number of lines in log div

var counterOfLogs = 0; // variable for counting the logs

function log(msg) { // function to print messages to div with implemented scroll

    var node=document.createElement("tr"); // we create variable node as tr (table row)

    var textnode=document.createTextNode(counterOfLogs + " | " + msg); // create elem. with text

    node.appendChild(textnode); // add to "node", i.e. table row

    divForPrint.insertBefore(node, divForPrint.childNodes[0]); // insert into variable divForPrint -> document.getElementById("divForPrint");

    if (counterOfLogs > numberOfLinesInLog-1) { // if there are more numbers as e.g. 10

        divForPrint.removeChild(divForPrint.childNodes[numberOfLinesInLog]); // remove the oldest printout

    counterOfLogs = counterOfLogs + 1; // increase the counter of logs

let ws = new WebSocket("ws://192.168.254.149:8888"); // create socket - connect to it

var messageJSON;

ws.onmessage = function(event) {

    var msg = JSON.parse(event.data); // string from ws is put to JSON

    switch(msg.type) {

        case "message":

            log(msg.content); // add msg to div

        break;

};

ws.onclose = function(event) {

  log("WebSocket is closed now.");

};

function sendPWM () {

    valuePWM = document.getElementById("pwm").value;

    messageJSON = {"type": "sendPWM", "pwm": valuePWM}; // JSON structure of the message

    ws.send(JSON.stringify(messageJSON)); // we have to stringify JSON to send it over websocket

};

function left() {

    messageJSON = {"type": "left", "AIN1": 0, "AIN2": 1};

    ws.send(JSON.stringify(messageJSON)); // we have to stringify JSON to send it over websocket

};

function right() {

    messageJSON = {"type": "right", "AIN1": 1, "AIN2": 0};

    ws.send(JSON.stringify(messageJSON)); // we have to stringify JSON to send it over websocket

};

function stop() {

    messageJSON = {"type": "stop", "pwm": 0};

    ws.send(JSON.stringify(messageJSON)); // we have to stringify JSON to send it over websocket

};

</script>

</body>

</html>

Page updated

Google Sites

Report abuse