MouseSpeak

Let your mouse do the talking by transmitting your movements and text messages from multiple devices in realtime with PubNub!

Collaboration

Author:

PubNub

Github Zip Tutorial

Mouse Events

Through simple tracking of the mouse position, we can get the coordinates and broadcast the location over PubNub to any other viewers. We can also listen for keystrokes to broadcast the text changes along with the mouse position coordinates.

mouseCoords

Send Coordinates

With PubNub, it's simple to send arbitrary data in realtime, including screen coordinates. In this example, we can send JSON objects containing the x- and y- coordinates of a mouse position within a publish() call.

Don't forget to use your own publish and subscribe keys when initializing PubNub! If you don’t have one yet, sign up now to get your own unique keys!

pubnub.publish({ 
  channel : 'mouseMoves', 
  message : {
    x: 400,
    y: 200
  } 
});

Display Occupancy

You can also display the number of users online with our Presence Detection APIpresence() receives user events including Join/Leave status changes. To use this optional API, you need to enable the feature on your Admin Dashboard and add the lines to your subscribe() call.

pubnub.subscribe({channels: [channel]});
pubnub.addListener({
  presence: function(m){
    document.getElementById('occupancy').textContent = m.occupancy;
  }
});

Blog Posts

Features Used

Feedback & Support

Need help? Contact PubNub Support.

More Demos for you

CoDoodler

CoDoodler

Doodle with strangers on InterWeb! This is a very simple multi-user...

Learn more
WebRTC Video Chat Signaling

WebRTC Video Chat Signaling

Let PubNub be your signal protocol service, and combine it with a hosted...

Learn more
Support Chat

Support Chat

Support Chat lets you build effective support chat to increase customer...

Learn more

Talk to an expert

Contact Sales