0

I want to create a page using node.js and socket.io.

There are two buttons inside the page, when I click one of them, it will change a variable which defines the animation-duration(I omit the CSS animation codes here).

When I open the same page on another web-browser and click one of the buttons, I hope to see the change in both of the webpages. I don't know how to write the code inside the socket.on('chat', function(data){???}); to make two pages communicate with each other.

Client side:

//socket.io codes--

<script type="text/javascript" charset="utf-8">

    var socket = io.connect('http://localhost:3000');

    socket.on('chat', function  (data)
    {
         function change_position(data)
          {
           document.getElementById("animation1").style.WebkitAnimationDuration=data;
          }
    });

 </script>

.....

//action--

<body>
<button id="1b" type="button" style="position:absolute; left:377px; top:220px;" value="2s"; onclick="change_position(value)"> - 1 - </button>

<button id="2b" type="button" style="position:absolute; left:477px; top:220px;" value="15s"; onclick="change_position(value)"> - 2 - </button>
</body>

server side:

var io = require('socket.io'),
  connect = require('connect');

var app = connect().use(connect.static('public')).listen(3000);
var chat_room = io.listen(app);

chat_room.sockets.on('connection', function (socket) {

  socket.on('chat', function  (data) {
    chat_room.sockets.emit('chat', data);
  });
});
Sam
  • 1,222
  • 1
  • 14
  • 45
Eli Dai
  • 51
  • 2
  • 6

2 Answers2

2

If your want a message to propagate to all clients/sockets, in your server you should have something like:

chat_room.sockets.on('connection', function (socket) {

  socket.on('chat', function  (data) {
    socket.broadcast.emit('chat', data);
    socket.emit('chat',data);
  });

});

The line socket.emit('chat',data); allows you to send the message back also to the sender of it, because broadcast will send it all other sockets.

Of course, you could ommit that line and handle the message sending logic in the client; i.e. adding some JavaScript code that makes the changes you want just after sending the message to the server.

Sam
  • 1,222
  • 1
  • 14
  • 45
  • can you tell where I was doing wrong? I meaning the logical conflict of my code in terms of socket.io part – Eli Dai Jan 04 '13 at 10:47
  • The line `chat_room.sockets.emit('chat', data);` doesn't seem to me to be good, since you don't want to emit a message from the server to every socket (that's what that line says, but I'm not really sure if that even works). With the code I suggested, `socket.broadcast.emit('chat', data);`you are saying: "The socket named `socket` will broadcast a message triggering the `chat` action in all other sockets, sending `data` as parameter" – Sam Jan 05 '13 at 05:08
0

You can emit on your client using socket.emit('message', data). Then on the server get it with chat_room.socket.on('message', data). Emit it to the clients using chat_room.sockets.emit('message', data).

Klaasvaak
  • 5,634
  • 15
  • 45
  • 68