Multiuser Mouse Pointers

This example uses ReactorGUI, Union's user-interface component set, to create a visual space within which users can see each other's mouse pointers.

The above example demonstrates how to use the following ReactorGUI features:

  • The PointerPositionBroadcaster class, which broadcasts mouse pointer positions to interested clients
  • The AvatarPane class, a visual container for displaying user avatars

The Code

The code for the multiuser mouse example follows. Code for the underlying classes in the example is available as part of ReactorGUI.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
package {
  import flash.display.Sprite;

  import net.user1.reactor.Reactor;
  import net.user1.reactor.ReactorEvent;
  import net.user1.reactor.Room;
  import net.user1.reactor.motion.PointerPositionBroadcaster;
  import net.user1.reactor.motion.PositionBroadcaster;
  import net.user1.reactor.ui.AvatarPane;
  import net.user1.reactor.ui.PointerIcon;
   
  /**
   * A multiuser mouse pointer application that displays the mouse pointer
   * position of all users in a specified room.
   */

  public class UnionMultiMouse extends Sprite {
// =============================================================================
// VARIABLES
// =============================================================================
    protected var reactor:Reactor;
    protected var pointerPositionBroadcaster:PointerPositionBroadcaster;
    protected var mousePointerPane:AvatarPane;
    protected var room:Room;
   
// =============================================================================
// CONSTRUCTOR
// =============================================================================
    public function UnionMultiMouse ()  {
      // Create the application's Reactor object
      reactor = new Reactor();
     
      // Create the PointerPositionBroadcaster, which sends the current
      // client's mouse pointer position to all interested clients.
      pointerPositionBroadcaster = new PointerPositionBroadcaster(reactor,
                                 stage,
                                 PointerPositionBroadcaster.DEFAULT_SAMPLE_RATE,
                                 PositionBroadcaster.DEFAULT_SEND_RATE,
                                 "MultiMouseRoom");
     
      // Create an AvatarPane to hold the mouse pointers. The AvatarPane
      // receives pointer positions from the PointerPositionBroadcaster, and
      // automatically animates pointers to those positions.
      mousePointerPane = new AvatarPane(PointerIcon);
      addChild(mousePointerPane);
     
      // To hide the current user's mouse pointer, uncomment the following line
      // mousePointerPane.hideSelf();

      // Connect to Union
      reactor.addEventListener(ReactorEvent.READY, readyListener);
      reactor.connect("tryunion.com", 80);
    }
   
    /**
     * Listener triggered when the connection to Union Server is established.
     */

    protected function readyListener (e:ReactorEvent):void {
      // Create the application room
      room = reactor.getRoomManager().createRoom("MultiMouseRoom")
      // Tell the AvatarPane to use the application room for client updates
      mousePointerPane.setRoom(room);
      // Join the application room
      room.join();
    }
  }
}