added actions in receiver html on tuio objects update

receiver/frontend/index.html

@@ -24,6 +24,15 @@
 			top: 0;
 			width: 8px;
 		}
+		.tuioObj {
+			background: #f00;
+			height: 15px;
+			left: 0;
+			position: absolute;
+			top: 0;
+			width: 8px;
+			rotate: 0deg;
+		}
 	</style>
 
 	<script>
@@ -42,6 +51,7 @@
 						screenH = $(document).height()
 
 						cursors = {},
+						objects = {},
 
 						onConnect = function() {
 							if (debug) {
@@ -71,18 +81,32 @@
 						},
 
 						onAddTuioObject = function(addObject) {
+							var $addObject = $('<div class="tuioObj"></div>');
+							$('body').append($addObject);
+							objects[addObject.symbolID] = $addObject;
+							onUpdateTuioObject(addObject);
 							if (debug) {
 								console.log('addTuioObject', addObject);
+								console.log(objects);
 							}
 						},
 
 						onUpdateTuioObject = function(updateObject) {
+							var $updateObject = objects[updateObject.symbolID];
+							$updateObject.css({
+								left: updateObject.getScreenX(screenW),
+								top: updateObject.getScreenY(screenH),
+								rotate : updateObject.getAngleDegrees()
+							});
 							if (debug) {
 								console.log('updateTuioObject', updateObject);
 							}
 						},
 
 						onRemoveTuioObject = function(removeObject) {
+							var $removeObject = objects[removeObject.symbolID];
+							$removeObject.remove();
+							delete[removeObject.symbolID];
 							if (debug) {
 								console.log('removeTuioObject', removeObject);
 							}