benptc/index-distance-to-tools.html

## index-distance-to-tools.html
<!-- Measure the distance between tools -->

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="objectDefaultFiles/object.js"></script>
    <script src="objectDefaultFiles/pep.min.js"></script>
    <meta charset="UTF-8">
    <title>contextDependent</title>
    <style>
        #container {
            width: 290px;
            height: 290px;
            border: 5px solid black;
            border-radius: 50%;
        }
        #details {
            color: white;
            font-size: 30px;
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
            width: 300px;
            height: 300px;
            text-align: center;
            line-height: 300px;
        }
    </style>
</head>

<body style="width: 300px; height: 300px">
<div id="container">
    <div id="details"></div>
</div>

<script>
    let realityInterface = new RealityInterface();
    let container = document.getElementById('container');
    let thisToolPosition = { x: 0, y: 0, z: 0 };
    let distances = {};

    function setColor(hue) {
        container.style.backgroundColor = 'hsl(' + hue + ', 90%, 70%)';
    }

    realityInterface.subscribeToMatrix();

    setInterval(function() {
        thisToolPosition = {
            x: realityInterface.getPositionX(),
            y: realityInterface.getPositionY(),
            z: realityInterface.getPositionZ()
        };
        let messageToSend = {
            messageType: 'contextDependentDemo',
            senderId: realityObject.frame,
            position: thisToolPosition
        };
        realityInterface.sendGlobalMessage(JSON.stringify(messageToSend));
    }, 100);

    realityInterface.addGlobalMessageListener(function(messageString) {
        try {
            let message = JSON.parse(messageString);
            if (typeof message.messageType !== 'undefined' &&
                message.messageType === 'contextDependentDemo') {
                receivedToolPosition(message.position, message.senderId);
            }
        } catch(err) {
            console.warn('error parsing global message', err);
        }
    });

    function receivedToolPosition(otherToolPosition, senderId) {
        let diff = {
            x: otherToolPosition.x - thisToolPosition.x,
            y: otherToolPosition.y - thisToolPosition.y,
            z: otherToolPosition.z - thisToolPosition.z,
        };

        distances[senderId] = Math.sqrt(diff.x * diff.x + diff.y * diff.y + diff.z * diff.z);
        let averageDistance = average(Object.values(distances));

        document.getElementById('details').innerText = Math.round(averageDistance);
    }

    function average(numbers) {
        let sum = 0;
        for (let i = 0; i < numbers.length; i++) {
            sum += numbers[i];
        }
        return sum / numbers.length;
    }
</script>
</body>
</html>
	<!-- Measure the distance between tools -->

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<script src="objectDefaultFiles/object.js"></script>
	<script src="objectDefaultFiles/pep.min.js"></script>
	<meta charset="UTF-8">
	<title>contextDependent</title>
	<style>
	#container {
	width: 290px;
	height: 290px;
	border: 5px solid black;
	border-radius: 50%;
	}
	#details {
	color: white;
	font-size: 30px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	width: 300px;
	height: 300px;
	text-align: center;
	line-height: 300px;
	}
	</style>
	</head>

	<body style="width: 300px; height: 300px">
	<div id="container">
	<div id="details"></div>
	</div>

	<script>
	let realityInterface = new RealityInterface();
	let container = document.getElementById('container');
	let thisToolPosition = { x: 0, y: 0, z: 0 };
	let distances = {};

	function setColor(hue) {
	container.style.backgroundColor = 'hsl(' + hue + ', 90%, 70%)';
	}

	realityInterface.subscribeToMatrix();

	setInterval(function() {
	thisToolPosition = {
	x: realityInterface.getPositionX(),
	y: realityInterface.getPositionY(),
	z: realityInterface.getPositionZ()
	};
	let messageToSend = {
	messageType: 'contextDependentDemo',
	senderId: realityObject.frame,
	position: thisToolPosition
	};
	realityInterface.sendGlobalMessage(JSON.stringify(messageToSend));
	}, 100);

	realityInterface.addGlobalMessageListener(function(messageString) {
	try {
	let message = JSON.parse(messageString);
	if (typeof message.messageType !== 'undefined' &&
	message.messageType === 'contextDependentDemo') {
	receivedToolPosition(message.position, message.senderId);
	}
	} catch(err) {
	console.warn('error parsing global message', err);
	}
	});

	function receivedToolPosition(otherToolPosition, senderId) {
	let diff = {
	x: otherToolPosition.x - thisToolPosition.x,
	y: otherToolPosition.y - thisToolPosition.y,
	z: otherToolPosition.z - thisToolPosition.z,
	};

	distances[senderId] = Math.sqrt(diff.x * diff.x + diff.y * diff.y + diff.z * diff.z);
	let averageDistance = average(Object.values(distances));

	document.getElementById('details').innerText = Math.round(averageDistance);
	}

	function average(numbers) {
	let sum = 0;
	for (let i = 0; i < numbers.length; i++) {
	sum += numbers[i];
	}
	return sum / numbers.length;
	}
	</script>
	</body>
	</html>