brilliantsole 0.0.27 → 0.0.29

package/examples/webxr-2/components/init-shell-material.js

@@ -0,0 +1,215 @@
+AFRAME.registerSystem("init-shell-material", {
+  waitForPhysics: async function () {
+    return new Promise((resolve) => {
+      let interval = setInterval(() => {
+        const sceneEl = this.el.sceneEl;
+        const system = sceneEl.systems.physics;
+        if (system) {
+          clearInterval(interval);
+          resolve();
+        }
+      }, 100);
+    });
+  },
+  init: async function () {
+    await this.waitForPhysics();
+    const sceneEl = this.el.sceneEl;
+    const system = sceneEl.systems.physics;
+
+    if (system && system.driver && system.driver.addMaterial) {
+      // system.driver.world.defaultContactMaterial.contactEquationStiffness = 1e9;
+      // system.driver.world.defaultContactMaterial.contactEquationRelaxation = 4;
+
+      system.driver.world.addMaterial(system.driver.materials.defaultMaterial);
+      system.driver.world.addMaterial(system.driver.materials.staticMaterial);
+
+      // Add a frictionless material if not defined already
+      const shellMaterial = new CANNON.Material("shell");
+      shellMaterial.friction = 0.0;
+      shellMaterial.restitution = 1; // adjust bounce if needed
+      system.driver.materials["shell"] = shellMaterial;
+      system.driver.world.addMaterial(shellMaterial);
+
+      const goombaMaterial = new CANNON.Material("goomba");
+      goombaMaterial.friction = -1;
+      goombaMaterial.restitution = 0.5;
+      system.driver.materials["goomba"] = goombaMaterial;
+      system.driver.world.addMaterial(goombaMaterial);
+
+      const soccerBallMaterial = new CANNON.Material("soccerBall");
+      soccerBallMaterial.friction = 0.2;
+      soccerBallMaterial.restitution = 0.6;
+      system.driver.materials["soccerBall"] = soccerBallMaterial;
+      system.driver.world.addMaterial(soccerBallMaterial);
+
+      const bounceWallMaterial = new CANNON.Material("bounceWall");
+      bounceWallMaterial.friction = 0.0;
+      bounceWallMaterial.restitution = 1; // adjust bounce if needed
+      system.driver.materials["bounceWall"] = bounceWallMaterial;
+      system.driver.world.addMaterial(bounceWallMaterial);
+
+      this.addContactMaterial();
+
+      sceneEl.addEventListener("world-meshes", this.onWorldMeshes.bind(this));
+
+      const testFloor = document.getElementById("testFloor");
+      if (testFloor) {
+        return;
+        testFloor.components["static-body"].body.material = bounceWallMaterial;
+        testFloor.addEventListener("body-loaded", (event) => {
+          const { body } = event.detail;
+          console.log(body);
+          body.material = bounceWallMaterial;
+        });
+      }
+    }
+  },
+  onWorldMeshes: function (event) {
+    const { planeMeshes, worldMeshes } = event.detail;
+    console.log("onWorldMeshes", event.detail);
+
+    const sceneEl = this.el.sceneEl;
+    const system = sceneEl.systems.physics;
+    const materials = system.driver.materials;
+
+    planeMeshes.forEach((planeMesh) => {
+      let material = planeMesh.components["static-body"].body.material;
+      switch (planeMesh.dataset.worldMesh) {
+        case "wall":
+          material = materials["bounceWall"];
+          break;
+        default:
+          break;
+      }
+      planeMesh.components["static-body"].body.material = material;
+    });
+    worldMeshes.forEach((worldMesh) => {
+      let material = worldMesh.components["static-body"].body.material;
+      switch (worldMesh.dataset.worldMesh) {
+        case "table":
+          material = materials["bounceWall"];
+          break;
+        default:
+          break;
+      }
+      worldMesh.components["static-body"].body.material = material;
+    });
+  },
+  addContactMaterial: function () {
+    const sceneEl = this.el.sceneEl;
+    const system = sceneEl.systems.physics;
+
+    if (system && system.driver && system.driver.addMaterial) {
+      const shellMaterial = system.driver.materials["shell"];
+      const defaultMaterial = system.driver.materials["defaultMaterial"];
+      const staticMaterial = system.driver.materials["staticMaterial"];
+
+      const defaultContactMaterial = {
+        friction: 0.01,
+        restitution: 0.3,
+        contactEquationStiffness: 1e8,
+        contactEquationRelaxation: 3,
+        frictionEquationStiffness: 1e8,
+        frictionEquationRegularization: 3,
+      };
+
+      // console.log("shellMaterial", shellMaterial);
+
+      const shellDefaultContact = new CANNON.ContactMaterial(
+        shellMaterial,
+        defaultMaterial,
+        { friction: 0, restitution: 0 }
+      );
+      system.driver.world.addContactMaterial(shellDefaultContact);
+      // console.log("added shellDefaultContact", shellDefaultContact);
+
+      const shellStaticContact = new CANNON.ContactMaterial(
+        shellMaterial,
+        staticMaterial,
+        { friction: 0, restitution: 0 }
+      );
+      system.driver.world.addContactMaterial(shellStaticContact);
+      // console.log("added shellStaticContact", shellStaticContact);
+
+      const bounceWallMaterial = system.driver.materials["bounceWall"];
+      const bounceWallContact = new CANNON.ContactMaterial(
+        shellMaterial,
+        bounceWallMaterial,
+        {
+          friction: 0,
+          restitution: 1,
+          contactEquationStiffness: 1e9,
+          contactEquationRelaxation: 4,
+        }
+      );
+      system.driver.world.addContactMaterial(bounceWallContact);
+      // console.log("added bounceWallContact", bounceWallContact);
+
+      const defaultBounceWallContact = new CANNON.ContactMaterial(
+        defaultMaterial,
+        bounceWallMaterial,
+        { ...defaultContactMaterial }
+      );
+      system.driver.world.addContactMaterial(defaultBounceWallContact);
+      // console.log("added defaultBounceWallContact", defaultBounceWallContact);
+
+      const goombaMaterial = system.driver.materials["goomba"];
+      const goombaDefaultContactMaterial = {
+        ...defaultContactMaterial,
+        restitution: goombaMaterial.restitution,
+      };
+      const goombaBounceWallContact = new CANNON.ContactMaterial(
+        goombaMaterial,
+        bounceWallMaterial,
+        { ...goombaDefaultContactMaterial }
+      );
+      system.driver.world.addContactMaterial(goombaBounceWallContact);
+      // console.log("added goombaBounceWallContact", goombaBounceWallContact);
+
+      const goombaStaticContact = new CANNON.ContactMaterial(
+        goombaMaterial,
+        system.driver.materials.staticMaterial,
+        { ...goombaDefaultContactMaterial }
+      );
+      system.driver.world.addContactMaterial(goombaStaticContact);
+      // console.log("added goombaStaticContact", goombaStaticContact);
+
+      const goombaDefaultContact = new CANNON.ContactMaterial(
+        goombaMaterial,
+        system.driver.materials.defaultMaterial,
+        { ...goombaDefaultContactMaterial }
+      );
+      system.driver.world.addContactMaterial(goombaDefaultContact);
+      // console.log("added goombaDefaultContact", goombaDefaultContact);
+
+      const soccerBallMaterial = system.driver.materials["soccerBall"];
+      const soccerBallDefaultContactMaterial = {
+        ...defaultContactMaterial,
+        restitution: soccerBallMaterial.restitution,
+      };
+      const soccerBallBounceWallContact = new CANNON.ContactMaterial(
+        soccerBallMaterial,
+        bounceWallMaterial,
+        { ...soccerBallDefaultContactMaterial, friction: 0, restitution: 1 }
+      );
+      system.driver.world.addContactMaterial(soccerBallBounceWallContact);
+      // console.log("added soccerBallBounceWallContact", soccerBallBounceWallContact);
+
+      const soccerBallStaticContact = new CANNON.ContactMaterial(
+        soccerBallMaterial,
+        system.driver.materials.staticMaterial,
+        { ...soccerBallDefaultContactMaterial }
+      );
+      system.driver.world.addContactMaterial(soccerBallStaticContact);
+      // console.log("added soccerBallStaticContact", soccerBallStaticContact);
+
+      const soccerBallDefaultContact = new CANNON.ContactMaterial(
+        soccerBallMaterial,
+        system.driver.materials.defaultMaterial,
+        { ...soccerBallDefaultContactMaterial }
+      );
+      system.driver.world.addContactMaterial(soccerBallDefaultContact);
+      // console.log("added soccerBallDefaultContact", soccerBallDefaultContact);
+    }
+  },
+});

package/examples/webxr-2/components/platter.js

@@ -0,0 +1,172 @@
+AFRAME.registerComponent("platter", {
+  schema: {
+    fadeInSoundSelector: { default: "#platterFadeInAudio" },
+    fadeOutSoundSelector: { default: "#platterFadeOutAudio" },
+    fadeInSoundVolume: { default: 0.2 },
+    fadeOutSoundVolume: { default: 0.2 },
+  },
+
+  init: function () {
+    this.auxMatrix = new THREE.Matrix4();
+    this.goombaTransform = {
+      position: new THREE.Vector3(),
+      quaternion: new THREE.Quaternion(),
+      scale: new THREE.Vector3(1, 1, 1),
+    };
+    this.addGoomba();
+
+    this.isOpen = false;
+
+    this.el.setAttribute("grow-shrink", "");
+    this.hand = this.el.closest("[hand-tracking-controls]");
+
+    this.hand.setAttribute("palm-up-detector", "");
+    this.hand.addEventListener("palmupon", () => {
+      this.hand.components["hand-tracking-grab-controls"].setDisabled(true);
+      this.setGrabEnabled(false);
+      this.isGrabbed = false;
+      this.isOpen = true;
+      this.playFadeInSound();
+      if (this.goomba) {
+        this.goomba.setAttribute("visible", "true");
+      }
+      setTimeout(() => {
+        if (!this.isOpen) {
+          return;
+        }
+        this.addGoomba();
+        if (this.goomba && !this.isGrabbed) {
+          this.goomba.setAttribute("grabbable", "");
+          this.goomba.play();
+        }
+      }, 200);
+      this.el.emit("grow");
+      this.hand.setAttribute("occlude-hand-tracking-controls", {
+        enabled: false,
+      });
+    });
+    this.hand.addEventListener("palmupoff", () => {
+      this.hand.components["hand-tracking-grab-controls"].setDisabled(false);
+      this.setGrabEnabled(true);
+      this.isOpen = false;
+      this.playFadeOutSound();
+      if (this.goomba && !this.isGrabbed) {
+        this.goomba.removeAttribute("grabbable");
+        this.goomba.pause();
+      }
+      this.el.emit("shrink");
+      this.hand.setAttribute("occlude-hand-tracking-controls", {
+        enabled: true,
+      });
+      this.isGrabbed = false;
+    });
+
+    this.fadeInSound = document.createElement("a-entity");
+    this.fadeInSound.setAttribute(
+      "sound",
+      `src: ${this.data.fadeInSoundSelector}; volume: ${this.data.fadeInSoundVolume}`
+    );
+    this.el.sceneEl.appendChild(this.fadeInSound);
+
+    this.fadeOutSound = document.createElement("a-entity");
+    this.fadeOutSound.setAttribute(
+      "sound",
+      `src: ${this.data.fadeOutSoundSelector};  volume: ${this.data.fadeOutSoundVolume}`
+    );
+    this.el.sceneEl.appendChild(this.fadeOutSound);
+  },
+
+  setGrabEnabled: function (enabled) {
+    if (!this.originalObbColliderAttribute) {
+      this.originalObbColliderAttribute = Object.assign(
+        {},
+        this.hand.getAttribute("obb-collider")
+      );
+    }
+    if (enabled) {
+      this.hand.setAttribute("obb-collider", this.originalObbColliderAttribute);
+    } else {
+      this.hand.removeAttribute("obb-collider");
+    }
+  },
+
+  playFadeInSound: function () {
+    this.stopFadeOutSound();
+    this.el.object3D.getWorldPosition(this.fadeInSound.object3D.position);
+    this.fadeInSound.components.sound.playSound();
+  },
+  stopFadeInSound: function () {
+    this.fadeInSound.components.sound.stopSound();
+  },
+  playFadeOutSound: function () {
+    this.stopFadeInSound();
+    this.el.object3D.getWorldPosition(this.fadeOutSound.object3D.position);
+    this.fadeOutSound.components.sound.playSound();
+  },
+  stopFadeOutSound: function () {
+    this.fadeOutSound.components.sound.stopSound();
+  },
+
+  addGoomba: function () {
+    if (!this.goomba) {
+      this.goomba = document.createElement("a-entity");
+      const goomba = this.goomba;
+      goomba.addEventListener(
+        "die",
+        () => {
+          if (this.goomba == goomba) {
+            this.goomba = undefined;
+            this.addGoomba();
+          }
+        },
+        { once: true }
+      );
+      this.goomba.platter = this;
+      // console.log("adding goomba", this.goomba);
+      this.goomba.addEventListener("loaded", () => {
+        this.setOwner(this.el.object3D);
+        setTimeout(() => {
+          this.goomba.setAttribute("position", "0 0.1 0");
+          this.goomba.setAttribute("scale", "1 1 1");
+          this.goomba.setAttribute("rotation", "0 180 0");
+          this.goomba.pause();
+        }, 1);
+      });
+      this.goomba.setAttribute("goomba", "physics: true;");
+      this.goomba.addEventListener(
+        "grabstarted",
+        (event) => {
+          this.isGrabbed = true;
+          //console.log("grabstarted goomba");
+          event.detail.grab.originalParent = this.el.sceneEl.object3D;
+        },
+        { once: true }
+      );
+      this.goomba.addEventListener(
+        "grabended",
+        () => {
+          this.isGrabbed = false;
+          //console.log("grabended goomba");
+          this.goomba.play();
+          this.goomba.setAttribute("grabbable", "");
+          this.goomba.components["goomba"].punchable = true;
+          this.goomba.platter = undefined;
+          this.goomba = undefined;
+          this.addGoomba();
+          this.goomba.setAttribute("visible", "false");
+        },
+        { once: true }
+      );
+      this.el.sceneEl.appendChild(this.goomba);
+    }
+  },
+
+  setOwner: function (newParent) {
+    var child = this.goomba.object3D;
+    var parent = child.parent;
+    child.applyMatrix4(parent.matrixWorld);
+    child.applyMatrix4(this.auxMatrix.copy(newParent.matrixWorld).invert());
+    parent.remove(child);
+    newParent.add(child);
+  },
+});