example with lifepoints

index.html

@@ -2985,11 +2985,22 @@ AFRAME.registerComponent('collision-check', {
   dependencies: ['raycaster'],
 
   init: function () {
+    let lifePoints = 10
     this.el.addEventListener('raycaster-intersection', function (e) {
 	color = e.detail.els[0].getAttribute("color")
 	let rig = document.getElementById("rig").getAttribute("position") 
-	if (color == "red")
+	if (color == "red"){
-		rig.z += .5
+		rig.z += .5 // very naive, could instead take the opposite direction, lerping away
+		setFeedbackHUD("wall hit" + " " + --lifePoints + "<3")
+		if (lifePoints < 1) {
+			lifePoints = 10
+			setFeedbackHUD("dead, respawing")
+			rig.set(0,0,0) // really origin?
+		}
+	}
+	if (color == "green"){
+		setFeedbackHUD("bonus" + " " + lifePoints++ + "<3")
+	}
     });
   }
 });
@@ -3034,7 +3045,7 @@ AFRAME.registerComponent('startfunctions', {
 		<a-sound id="snapping-sound" src="url(../content/magnets_snap.mp3)"></a-sound>
 		<a-entity id="player" networked="template:#avatar-template;attachTemplateToLocal:false;" 
 			hud camera look-controls wasd-controls waistattach="target: .movebypinch" position="0 1.6 0">
-			<a-entity position="0 -1.6 0" rotation="-25 0 0" collision-check raycaster="far:.2; interval: 100; objects: .cubes; showLine:true;" ></a-entity>
+			<a-entity position="0 -1.2 0" rotation="-25 0 0" collision-check raycaster="far:.2; interval: 100; objects: .cubes; showLine:true;" ></a-entity>
 		</a-entity>
 		<a-entity id="rightHand" pinchprimary hand-tracking-controls="hand: right;"></a-entity>
 		<a-entity id="leftHand" pinchsecondary wristattachsecondary="target: #box" hand-tracking-controls="hand: left;"></a-entity>