HTML 5 client broadcast


This tutorial is an extension of a previous tutorial: HTML 5 client. It shows how you can broadcast the same image to several connected peers. This can be useful, for example, to support kind of collaborative or spectator workflow in a multi-user environment.

Code modifications to support broadcasting.

To support broadcasting, we must first allow several peers to connect at the same time to the same application. This is achieved by slightly modifying the peer starting code:

// Start the peer.
if( ipeer->Start( RED::Object::GetIDFromString( "HTML5BroadcastServer" ),
                  "" ) != RED_OK )
  printf( "Error: REDnet failed to start the peer.\n" );
  return RED_FAIL;

In our case, we omit the fourth parameter to the RNET::IPeer::Start method and lets it to its default value 0. 0 means that the peer accepts any number of incoming connections as long as the underlying system can handle them. Hence, anyone can connect to that peer once launched.

The last modification to do to the HTML 5 client tutorial source code is in the main application loop.

The simplest way of broadcasting to several peers is to write:

// Get the list of connections IDs:
RED::Vector< int > conn_ids;
RNET::IPeer* ipeer = peer->As< RNET::IPeer >();
RC_TEST( (RED_RC)ipeer->GetConnectionsIDList( conn_ids ) );

// Send the image over the connections.
if( conn_ids.size() )
  unsigned int sent;
  float img_qual = quality / conn_ids.size();
  ipeer->SendImage( sent, img_qual, conn_ids, red_render_image, 0 );

We now use another RNET::IPeer::SendImage call which takes a list of connection IDs instead of a single one. The encoding of the image will be processed only once. Only the network transmission of the compressed data will occur as many times as there are connections in the list.


Please, note that sending several times the same image consumes more bandwidth than sending it only once. That's why, in the code above, we dynamically adjust the image quality depending on the number of connected peers. The more peers, the less image quality.