Web Sockets

From VibHub Wiki
Jump to navigation Jump to search

If you want to control the level directly from an app by sending many update requests every second, you can use the websocket API. In this code we'll use the device id "JasTestBullet", replace that with your own.

Install socket.io

Add the socket.io client to your website in your preferred fashion (such as NPM or websockets). After the page loads, connect to the socket:

let socket = io('https://vibhub.io');
socket.on('connect', () => {
    // CODE GOES HERE
});

This sets up a connection and an event listener for connection established. Let's set up a channel so we can push messages to the device. Replace the // CODE GOES HERE bit with:

console.log("Socket connection established, setting up a channel");
socket.emit('app', "JasTestApp", (success) => {
    if( !success )
        return;
    socket.emit('hookup', 'JasTestBullet', (response) => {
        let devices = response;
        if( !devices.length )
            return;
        let hex = 
            '00'+
            'FF'+
            'AA'+
            '10'+
            '00'
        ;
        socket.emit('p', hex);
    });
});

Explanation:

socket.emit('app', "JasTestApp", (success) => { This sets our connected socket to an app with the name JasTestApp. The name is generally only needed for debugging and in custom events. You can skip that step and directly hookup if you don't want to customize your VibHub device behavior.

socket.emit('hookup', 'JasTestBullet', (response) => {})

  • 'hookup' is a task meaning we'll want to set up a channel to start pushing data. The opposite is hookdown if you want to remove a device. This needs to be sent if you get disconnected and reconnect as well, since all channels are cleared on disconnect.
  • 'JasTestBullet' is the ID of our device. Replace it with the user's device ID.
  • (response) => {} Sets up a callback function
let devices = response;
if( !devices.length )
    return;

The response contains an array of connected devices. So if you hook up device A 'JasTestBullet' and device B 'JasTestRing', the response will most likely be ['JasTestBullet', 'JasTestRing']. You should generally save this array somewhere.

The second part makes sure that at least one device is connected. In our case, devices will be ['JasTestBullet']. Keep in mind here that JasTestBullet resides on index 0 of the array. This index is what we use to send the task that sets the power of the device:

let hex = 
    '00'+
    'FF'+
    'AA'+
    '10'+
    '00'
;

This sets up a hex value to send to the server in order:

  • '00' = Target device index 0 ("JasTestBullet")
  • 'FF' = Set port 0 to max (255)
  • 'AA' = Set port 1 to AA (170)
  • '10' = Set port 2
  • '00' = Turn off port 3

socket.emit('p', buffer);

This sends the command to the server. 'p' is always the task used for socket send, so you can just leave it as 'p'.

Better practices

Store devices as an array somewhere, and whenever you want to send a new intensity value to the device, check for the device ID in the devices array. For an instance:

let index = devices.indexOf('JasTestBullet');

For a full list of tasks and their documentation, see Tasks.

Or just our JavaScript Library

See VibHub-Browser for documentation!