<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Orbiter Share User Data</title>
<!--CSS-->
<style type="text/css">
#outPane {
border: inset 2px;
height: 200px;
width: 500px;
overflow: auto;
padding: 5px;
margin-bottom: 5px
}
</style>
<!--Load the Orbiter JavaScript library (non-minified version). Use during development.-->
<script type="text/javascript" src="http://unionplatform.com/cdn/Orbiter_latest.js"></script>
<!--Load the Orbiter JavaScript library (minified version). Use for production.-->
<!--<script type="text/javascript" src="http://unionplatform.com/cdn/Orbiter_latest_min.js"></script>-->
<!--Application code-->
<script type="text/javascript">
//==============================================================================
// VARIABLES
//==============================================================================
var orbiter;
var appRoom;
var appRoomID = "examples.shareUserDataRoom";
var occupations = ["programmer", "designer", "manager"];
var occupationUpdateIntervalID;
//==============================================================================
// INITIALIZATION
//==============================================================================
function init () {
// Create the Orbiter instance, used to connect to and communicate with Union,
// then enable automatic reconnection (one attempt every 15 seconds)
orbiter = new net.user1.orbiter.Orbiter();
orbiter.getConnectionMonitor().setAutoReconnectFrequency(15000);
orbiter.getLog().setLevel(net.user1.logger.Logger.DEBUG);
// If required JavaScript capabilities are missing, abort
if (!orbiter.getSystem().isJavaScriptCompatible()) {
displayMessage("Your browser is not supported.");
return;
}
// Register for Orbiter's connection events
orbiter.addEventListener(net.user1.orbiter.OrbiterEvent.READY, readyListener, this);
orbiter.addEventListener(net.user1.orbiter.OrbiterEvent.CLOSE, closeListener, this);
// Share the current client's ping with other clients
orbiter.getConnectionMonitor().sharePing(true);
// Start broadcasting random data updates every 5 seconds
setInterval(updateOccupation, 5000);
displayMessage("Connecting to Union...");
// Connect to Union Server
orbiter.connect("tryunion.com", 80);
}
//==============================================================================
// BROADCAST DATA UPDATES
//==============================================================================
function updateOccupation () {
if (orbiter.isReady()) {
var randomOccupation = occupations[Math.floor(Math.random()*3)];
// Set an attribute named "occupation" on the current client. By default,
// attributes are shared automatically with all occpants of a room, so
// this assignment will trigger an update on all other clients in the room.
// The third argument specifies that the attribute should be shared with
// clients that are in (or observing) the application room only.
orbiter.self().setAttribute("occupation", randomOccupation, appRoomID);
}
}
//==============================================================================
// ORBITER EVENT LISTENERS
//==============================================================================
// Triggered when the connection is ready
function readyListener (e) {
displayMessage("Connected.");
displayMessage("You are User" + orbiter.self().getClientID());
displayMessage("Joining room...");
// Create the application room on the server. Configure the room to exist
// until the next time Union Server shuts down.
var settings = new net.user1.orbiter.RoomSettings();
settings.removeOnEmpty = false;
appRoom = orbiter.getRoomManager().createRoom(appRoomID, settings);
appRoom.addEventListener(net.user1.orbiter.RoomEvent.JOIN, joinRoomListener);
appRoom.addEventListener(net.user1.orbiter.RoomEvent.UPDATE_CLIENT_ATTRIBUTE, clientAttributeUpdateListener);
// Join the application room
appRoom.join();
}
// Triggered when the connection is closed
function closeListener (e) {
displayMessage("Orbiter connection closed.");
}
//==============================================================================
// ROOM EVENT LISTENERS
//==============================================================================
// Triggered when the room is joined
function joinRoomListener (e) {
displayMessage("Application room joined.");
// Display the shared user data for every user in the room except
// the current client (because by default the current client's ping doesn't
// become available until 10 seconds passes after connection ready.)
var occupants = appRoom.getOccupants();
if (occupants.length > 1) {
displayMessage("Listing ping times and occupations for all other clients in the room...");
for (var i = 0; i < occupants.length; i++) {
if (!occupants[i].isSelf()) {
displayMessage("User" + occupants[i].getClientID() + " ping: " + occupants[i].getPing());
displayMessage("User" + occupants[i].getClientID() + " occupation: "
+ occupants[i].getAttribute("occupation", appRoomID));
}
}
}
}
function clientAttributeUpdateListener (e) {
displayMessage("UPDATE! User" + e.getClient().getClientID() + " changed "
+ e.getChangedAttr().name + " to: " + e.getChangedAttr().value);
}
//==============================================================================
// UI
//==============================================================================
// Displays a single message on screen
function displayMessage (message) {
// Make the new message element
var msg = document.createElement("span");
msg.appendChild(document.createTextNode(message));
msg.appendChild(document.createElement("br"));
// Append the new message to the output pane
var outPane = document.getElementById("outPane");
outPane.appendChild(msg);
// Trim the chat to 500 messages
if (outPane.childNodes.length > 500) {
outPane.removeChild(outPane.firstChild);
}
outPane.scrollTop = outPane.scrollHeight;
}
</script>
</head>
<body onload="init()">
<!--Contains the output pane-->
<div id="outPane"></div>
</body>
</html>