0

i tried the example from this website: https://medium.com/sysf/introduction-to-iot-with-raspberry-pi-and-node-js-using-rgb-led-lights-77f4750a5ea9

it works well but at connection time all gpios are at status 1. if leds are motors,they will start to run at connection time. so i tried to modify this lines by replacing true by false, but it doesn't change anything.

main.js

// when connection is established 
connection.on( 'connect', () => {
  isConnectionActive = false;
} );

connection.on( 'disconnect', () => {
  isConnectionActive = true;
} );

main.js

// get button elements
var button_red = document.getElementById( 'button-red' );
var button_green = document.getElementById( 'button-green' );
var button_blue = document.getElementById( 'button-blue' );

// initial button states
var button_red_state = true;
var button_green_state = true;
var button_blue_state = true;

// check for active connection
var isConnectionActive = true;

// connect to the Web Socket server
var connection = io( 'http://0.0.0.0:9000' );

// when connection is established 
connection.on( 'connect', () => {
  isConnectionActive = true;
} );

connection.on( 'disconnect', () => {
  isConnectionActive = false;
} );

// WebSocket event emitter function
var emitEvent = function( event ) {
  if( ! isConnectionActive ) {
    return alert( 'Server connection is closed!' );
  }

  // change button state
  if( event.target.id === 'button-red') { button_red_state = ! button_red_state; }
  if( event.target.id === 'button-green') { button_green_state = ! button_green_state }
  if( event.target.id === 'button-blue') { button_blue_state = ! button_blue_state; }

  // emit `led-toggle` socket event
  connection.emit( 'led-toggle', {
    r: button_red_state,
    g: button_green_state,
    b: button_blue_state,
  } );
};

// add event listeners on button
button_red.addEventListener( 'click', emitEvent );
button_blue.addEventListener( 'click', emitEvent );
button_green.addEventListener( 'click', emitEvent );

server.js

const path = require( 'path' );
const express = require( 'express' );
const socketIO = require( 'socket.io' );

// import LED control API
const { toggle } = require( './led-control' );

// create an express app
const app = express();

// send `index.html` from the current directory
// when `http://<ip>:9000/` route is accessed using `GET` method
app.get( '/', ( request, response ) => {
  response.sendFile( path.resolve( __dirname, 'web-app/index.html' ), {
    headers: {
      'Content-Type': 'text/html',
    }
  } );
} );

// send asset files
app.use( '/assets/', express.static( path.resolve( __dirname, 'web-app' ) ) );
app.use( '/assets/', express.static( path.resolve( __dirname, 'node_modules/socket.io-client/dist' ) ) );

// server listens on `9000` port
const server = app.listen( 9000, () => console.log( 'Express server started!' ) );

// create a WebSocket server
const io = socketIO( server );

// listen for connection
io.on( 'connection', ( client ) => {
  console.log( 'SOCKET: ', 'A client connected', client.id );

  // listen to `led-toggle` event
  client.on( 'led-toggle', ( data ) => {
    console.log( 'Received led-toggle event.' );
    toggle( data.r, data.g, data.b ); // toggle LEDs
  } );

} );

led-control.js

// import `onoff` package
const { Gpio } = require( 'onoff' );

// configure LED pins
const pin_red = new Gpio( 18, 'out' );
const pin_green = new Gpio( 23, 'out' );
const pin_blue = new Gpio( 24, 'out' );

// toggle LED states
exports.toggle = ( r, g, b ) => {
  pin_red.writeSync( r ? 0 : 1 );
  pin_green.writeSync( g ? 0 : 1 );
  pin_blue.writeSync( b ? 0 :1 );
};
2
  • Please clarify 'at connection time', Do you mean you physically connect something to GPIO while the Pi is already powered on?
    – Dirk
    Nov 3, 2020 at 2:32
  • When i start the webserver, leds on the gpio go to 1
    – taing hong
    Nov 3, 2020 at 4:09

1 Answer 1

0

Revised Answer:

If you have followed the tutorial regarding wiring then the outputs need to be high to turn the LEDs on. The code in the example was correct:

// toggle LED states
exports.toggle = ( r, g, b ) => {
  pin_red.writeSync( r ? 1 : 0 );
  pin_green.writeSync( g ? 1 : 0 );
  pin_blue.writeSync( b ? 1 :0 );
};

Original answer (As this is still relevant information)

isConnectionActive is the state of the connection between the web browser and your server, you need to put these back to true/false as they are used by other code to check whether LED control messages can be sent to the server.

To turn all the LEDs off you need to add the line:

connection.emit( 'led-toggle', {
    r: button_red_state,
    g: button_green_state,
    b: button_blue_state,
  } );

to connection.on:

connection.on( 'connect', () => {
  isConnectionActive = true;
  connection.emit( 'led-toggle', {
      r: button_red_state,
      g: button_green_state,
      b: button_blue_state,
  } );
} );

This will send an update to the server when you connect. See the tutorial for more info on how to handle multiple connections at the same time.

3
  • yes i have these lines to turn off leds but they don't, if i make connection to the web server all leds are up.
    – taing hong
    Nov 3, 2020 at 16:40
  • I updated the question with all codes
    – taing hong
    Nov 3, 2020 at 16:44
  • @tainghong you appear to have misunderstood the polarity of the LEDs, please see my revised answer. Nov 4, 2020 at 8:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.