// Component to play bird chirp sound on click
AFRAME.registerComponent('bird-chirp-on-click', {
    init: function () {
        var chirpSound = document.querySelector('#bird-chirp');
        this.el.addEventListener('click', function () {
            if (chirpSound && chirpSound.components.sound) {
                chirpSound.components.sound.stopSound();
                chirpSound.components.sound.playSound();
            }
        });
    }
});

 //initialization function to be called on <body> load
      function init() {
        //set reference for scene using DOM
        let scene = document.querySelector("a-scene");
        console.log("scene = " + scene);
        //hide raycaster initially so it doesn't look odd in desktop or mobile mode
        document.getElementById("controller").setAttribute("raycaster", "showLine: false;");
        //hide cursor and show controller if entering VR mode
        scene.addEventListener('enter-vr', function () {
            console.log("Entering VR Mode!");
            document.querySelector("a-cursor").setAttribute("visible", "false");
            document.getElementById("controller").setAttribute("raycaster", "showLine: true; far: 40; lineColor: blue; lineOpacity: 0.5");
        });

        //make cursor visible and hide controller in desktop/laptop mode
        scene.addEventListener('exit-vr', function () {
            console.log("Exiting VR Mode!");
            document.querySelector("a-cursor").setAttribute("visible", "true");
            document.getElementById("controller").setAttribute("raycaster", "showLine: false;");
        });

      }

AFRAME.registerComponent('welcome-sign-hover', {
            init: function () {
                var el = this.el; // <a-entity id="welcomeSign">
                var textEl = el.querySelector('a-text');
                var sparkleSound = document.querySelector('#sparkle');
                el.addEventListener('mouseenter', function () {
                    if (textEl) {
                        textEl.removeAttribute('animation'); 
                        textEl.setAttribute('animation', {
                            property: 'scale',
                            from: '1 1 1',
                            to: '1.3 1.3 1.3',
                            dur: 200,
                            dir: 'alternate',
                            loop: 2
                        });
                    }
                    if (sparkleSound && sparkleSound.components.sound) {
                        sparkleSound.components.sound.stopSound(); 
                        sparkleSound.components.sound.playSound();
                    }
                });
            }
        });

// Component to play meow sound on click
AFRAME.registerComponent('cat-meow-on-click', {
    init: function () {
        var meowSound = document.querySelector('#meow');
        this.el.addEventListener('click', function () {
            if (meowSound && meowSound.components.sound) {
                meowSound.components.sound.stopSound();
                meowSound.components.sound.playSound();
            }
        });
    }
});

//TELEPORT COMPONENT

AFRAME.registerComponent("teleport", {
  schema: {
      type: 'string'
  },
  init: function () {
      //get referene to element with component added to it
      let el = this.el;
      //get reference for camera rig entity
      let rig = document.getElementById("camera-rig");
      //get teleport coordinates from the data (attribute value) of component
      let newPosition = this.data;
      //event handler
            el.addEventListener("click", () => {
                    console.log("Teleporting to: " + newPosition)
                    // Play woosh sound
                    var wooshSound = document.querySelector('#woosh');
                    if (wooshSound && wooshSound.components.sound) {
                        wooshSound.components.sound.stopSound();
                        wooshSound.components.sound.playSound();
                    }
                    //update the position properties of the camera rig (effectively moving the end user)
                    rig.setAttribute("position", newPosition);
            });
  }
});



      