The Websocket DAT

General TouchDesigner Discussion
1

Hey Guys,

I was wondering a little bit about the websocket dat as I’ve definitely got a connection working with my node server using socket.io and I can broadcast from the server to clients but I’m not getting any data into touchdesigner besides the odd empty message. Does anybody have a working example and does the data need to be in a specific format?

I’ve tried a few different methods of sending with no success, the server log shows they’re sending though.

Cheers,
Richard

2

We are still developing the WebSocket DAT, so it’s only been tested with a few cases so far. If you have a case/server you can share with us this will help us iron out all the issues.

3

I’m just using Node.JS with socket.io with the sample code in socket.io’s documentation so I wouldn’t really call it a comprehensive test.

[code]var app = require(‘http’).createServer(handler)
, io = require(‘socket.io’).listen(app)
, fs = require(‘fs’)

app.listen(80);

function handler (req, res) {
fs.readFile(__dirname + ‘/index.html’,
function (err, data) {
if (err) {
res.writeHead(500);
return res.end(‘Error loading index.html’);
}

res.writeHead(200);
res.end(data);

});
}

io.sockets.on(‘connection’, function (socket) {
io.sockets.emit(‘this’, { will: ‘be received by everyone’});
});[/code]

I get a message through on index.html connecting but it’s empty, the server log recieves the full message however. this is the first time I’ve used websockets so I might be getting it a bit wrong. I’ve used send, emit, broadcast…pretty much every way of sending a message in that last little section.

Heres index.html:

<script src="js/socket.io.min.js"></script>
<script>
  var socket = io.connect('http://localhost:80');
  $(document).ready(function() {
socket.broadcast.emit('sent from client');
io.sockets.emit('message', { message: "sockets emit from client" });
  });
</script>
4

Hi Ennui,

I have not digged yet personally into such setup but one can find on github an example of how to use node.js and sockets.io to send OSC messages to Touch or other OSC clients:
github.com/automata/osc-web

Perhaps it may help to figure out how it works.

5

Yeah I’ve got an OSC setup currently but it’s slow and only sends messages due to using PHP as the handler on a WAMP server, it works by jquery sending to my php script which includes the PHPtoOSC class and then that fires across to touch, I wasn’t aware that it was possible to send and recieve osc via websockets without PHP so thanks for that link, receiving data from touch probably makes it the best solution for now.

Just goes to show how people saying somethings impossible on stackoverflow really can cause more harm than good. It’s all still just a big hack though…websocket DAT to the rescue I’m sure :stuck_out_tongue:

6

We can confirm that it’s not fully working right now. The next build should be working correctly.

7

Thanks Malcolm, I’ll try again in the next build and then post the example code in here if alls working correctly.

8

New build posted to try out.

9

Cheers Ben, I’ll try this today.

10

Well, I’ve tried but with no luck. Here is what I get:

It seems that the first message is correctly sent by node server, but is not received by Touch. And then, on the browser side, it doesn’t seem to be able to send a message back (as per the javascript error into chrome console).

Edit: I tried with different ports too (it’s why there is a 8000 port on the second image), but I don’t really know what is going wrong with the error.

11 
socket.broadcast.emit('send_message',{message: 'hello world'});

the above sends to touch from the server fine. I’ve tested it. I’m currently building up a bigger example.

12

Ok I’ve found another problem with the Websocket DAT. Basically if you start the server after creating the websocket DAT then it won’t connect as the websocket DAT is seen as a client and until the client refreshes its connection it won’t register messages, deleting and recreating the websocket DAT will fix this. A connect to server pulse parameter or something could help fix this for situations where touch is starting up the node server via system commands.

Heres the example code I tested with which works perfectly well if the websocket DAT is created after the server has started running. The websocket DAT needs to be on port 8000 and must have socket.io formatting turned on.

index.html:

<html>
<head>

<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/socket.io.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    var socket = io.connect('http://localhost:8000');

    $('#sender').click(function() {
            var user_message = $('#message_box').val()
            socket.emit('send_message',{message: user_message});
    });

    socket.on('get_message', function(data) {
        $('#data').append(data.message);
        });
    });
</script>
</head>
<body>
<div id='data'></div>
<input type='text' id='message_box' placeholder='send message'>
<button id='sender'>Send Message</button>
</body>
</html>

server.js:

var app = require('http').createServer(handler)
  , io = require('socket.io').listen(app)
  , fs = require('fs')

app.listen(8000);

function handler (req, res) {
  fs.readFile(__dirname + '/index.html',
  function (err, data) {
    if (err) {
      res.writeHead(500);
      return res.end('Error loading index.html');
    }

    res.writeHead(200);
    res.end(data);
  });
}

io.sockets.on('connection', function(socket) {
    socket.on('send_message', function(data) {
    data.message = data.message + '<br/>';
    socket.broadcast.emit('get_message',data);
    io.sockets.emit('get_message', data);
    });
});

The two methods of sending are:

socket.broadcast.emit('get_message',data);

This sends to all clients except the one sending (in our case index.html)

io.sockets.emit('get_message', data);

This sends back to the client which sent the message, and in this example appends the message in a list so you can see what text messages you have sent.

13

Thanks Ennui for the code.

I got some trouble with the script pathes in the header, but I finally got it working with different ones.

Is your js folder at the root of your app like this ? And is socket.io.min.js an actual library or a pointer to a node_module path ?


node-modules
js
js\jquery.min.js
js\socket.io.min.js
server.js
index.html
package.json

As per some other remarks to Derivative team:

-One point is that the websocket DAT only receives messages when touch power is on. It would be nice if it could receive messages while touch power is off, like controllers CHOPs (mouse, joystick, etc), and OSCin CHOP, reducing the need of processing power, so one could possibly activate touch power on via a websocket message.

-As websocket is bidirectional, is it possible to send messages from touch to node server or to the browser, with the websocket DAT, and how ? I don’t see clearly how it can be done actually.

Thanks for this promising operator by the way.

14

Yeah I’ve attached a zip of the full structure. Yeah my headers rubbish as I just pasted without context… :unamused:

Yes a sending data example/feature implementation? would be lovely.
socketout.zip (3.69 MB)

15

Thanks for clarifying the structure of the project.

I see that the final websocket DAT could allow us to define one’s UI in HTML/CSS/JS while communicating back and forth with Touch Designer for doing all the stuff it is good at.

16

Just a quick heads up, we’ve actively been testing / fixing / expanding these features so we’ll have some updates to share soon.
Thanks,
Rob

17

Hi again.
The latest posted build includes a redesigned WebSocket DAT, that allows for full two-way script control.

For a brief description see:
derivative.ca/wiki088/index. … Socket_DAT

In particular, check out the section on scripting:
derivative.ca/wiki088/index. … Socket_DAT

Cheers,
Rob.

18

What version of Socket.IO does this DAT support/require?

Socket.IO is up to 0.9. I’'ve been using libraries that still use 0.6 (django-socketio).

19

Hi guys, have any of you been having odd timeout issues? I’ve got a situation where after a while when sending from a webpage to touch using socket.io format it just stops working. I can see it registering on the server so I assume the server is passing that on but touch wont pick it up. If I uncheck socket.io then check it back on again it will re-connect and fix the issue. Anybody got any tips for stopping timeouts or will I have to just send a redundant message as a heartbeat?

20

Can I ask what stacks people are using with the Websocket DAT? Having no luck setting this up with this one Flask-SocketIO/gevent-socketio.

Malcolm, can you please confirm what versions of Socket.IO are supported?