The map below shows the position of nine users (targets) in real-time. One target ("Me") is the android application, the others are simulated targets, which are connected to the Aloqa TraX server. The position data is added via the Aloqa TraX Javascript API. This API lets you poll the position of a target or register for certain location-based events like a target entering an area or two persons approaching each other.

Instructions

The markers represent the current location of each target. If you click on a marker, the full name of the mobile terminal is shown. The position of the target "Me" is reported from the TraX library running inside the Android application. The positions are not periodically send or polled but pushed from the mobile client to the web browser, when the target moves more than the defined distance of 20 meters.

Implementation

This web site was developed according to the following three steps:

1. Adding a monitor job

To actually receive results, we need to invoke actions on the TraX Server first. After including the javascript we add a monitor job on a certain mobile "Me@androidnew". androidnew is the key of this application. The target named "Me" is simulated by the Android emulator running our demo application. This application includes a software library, which connects to our server and reports position data as requested by the following JavaScript call.

<html>
<head>
<script type="text/javascript" src="http://ajax.aloqa.com:8080/TraX/Proxy/js/trax.js"></script>
<script type="text/javascript">
<!--
var job = new TraX.DistanceJob();
job.distance = 50;
TraX.LLPM.addMonitorJob('Me@androidnew', 'my_job_id', job);
-->
</script>
</head>
<body>
</body>
</html>

As soon the position changes we'll see an alert box popping up, informing us about the received position update. This is the default behaviour which is informative, but is of not much use to end-users. Of course, we'd like to override this default behaviour to match your needs.

2. Overriding default handler functions

In response to adding monitor jobs on mobiles, a callback function is invoked when results are received from the TraX Server. In case of the LLPM, this callback function can be found at TraX.LLPM.onPositionUpdated(String mobileTerminal, String jobId, TraX.PositionUpdate positionUpdate). By default, this function pops up a message box, informing us about the received position update. To override this behaviour, specify a callback function like this:

TraX.attach({
	onPositionUpdated: function(mt, jobId, update) {
		draw(mt, update);
	}
});

Now, instead of the default callback, our custom callback will be invoked on result retrieval, which adds/moves the marker to the reported position.

3. Adding map and drawing marker

Finally, we add a map (Google Maps) to the web site and implement the function draw(), which adds or moves the marker on the map.
Now, we're done!

More information about the Aloqa TraX Javascript API and other APIs can be found here.