miniinfo-panel.js

var mainCharacter;AFRAME.registerComponent("info-panel",{init:function(){var e=document.querySelectorAll(".menu-button"),t=this.fadeBackgroundEl=document.querySelector("#fadeBackground");this.characterNameEl=document.querySelector("#characterName"),this.characterDescriptionEl=document.querySelector("#characterDescription"),this.characterInfo={charlesBorromeoButton:{name:charlesBorromeo.name,imgEl:document.querySelector("#charlesBorromeoCharacterImage"),description:charlesBorromeo.description,image:"cb.png"},heinrichKramerButton:{name:heinrichKramer.name,imgEl:document.querySelector("#heinrichKramerCharacterImage"),description:heinrichKramer.description,image:"hk.png"},jacobSprengerButton:{name:jacobSprenger.name,imgEl:document.querySelector("#jacobSprengerCharacterImage"),description:jacobSprenger.description,image:"js.png"},matthewHopkinsButton:{name:matthewHopkins.name,imgEl:document.querySelector("#matthewHopkinsCharacterImage"),description:matthewHopkins.description,image:"mh.png"},samuelParrisButton:{name:samuelParris.name,imgEl:document.querySelector("#samuelParrisCharacterImage"),description:samuelParris.description,image:"sp.png"}},this.onMenuButtonClick=this.onMenuButtonClick.bind(this),this.onBackgroundClick=this.onBackgroundClick.bind(this),this.backgroundEl=document.querySelector("#background");for(var r=0;r<e.length;++r)e[r].addEventListener("click",this.onMenuButtonClick);this.backgroundEl.addEventListener("click",this.onBackgroundClick),this.el.object3D.renderOrder=9999999,this.el.object3D.depthTest=!1,t.object3D.renderOrder=9,t.getObject3D("mesh").material.depthTest=!1},onMenuButtonClick:function(e){var t=e.currentTarget.id,r=this.characterInfo[t];r&&(this.backgroundEl.object3D.scale.set(1,1,1),this.el.object3D.scale.set(1,1,1),AFRAME.utils.device.isMobile()&&this.el.object3D.scale.set(1.4,1.4,1.4),this.el.object3D.visible=!0,this.fadeBackgroundEl.object3D.visible=!0,this.movieImageEl&&(this.movieImageEl.object3D.visible=!1),this.movieImageEl=r.imgEl,this.movieImageEl&&(this.movieImageEl.object3D.visible=!0),sA(this.characterNameEl,[["text","value: "+r.name]]),sA(this.characterDescriptionEl,[["text","value: "+r.description]]))},onBackgroundClick:function(e){this.backgroundEl.object3D.scale.set(.001,.001,.001),this.el.object3D.scale.set(.001,.001,.001),this.el.object3D.visible=!1,this.fadeBackgroundEl.object3D.visible=!1},chooseCharacter:function(e){const t=e.detail?e.detail.characterName:e.currentTarget.id.replace("Button","");localStorage.setItem("chosenCharacter",t),this.showCharacterInfo(t)},showCharacterInfo:function(e){this.characterInfo[e+"Button"]}}),AFRAME.registerComponent("main-character-chooser",{init:function(){this.chooseCharacter=this.chooseCharacter.bind(this),this.el.addEventListener("click",this.chooseCharacter)},chooseCharacter:function(e){const t=this.el.getAttribute("data-character");localStorage.setItem("chosenCharacter",t),mainCharacter=this.el;const r=document.querySelector("#mainCharacters");r.parentNode.removeChild(r);document.querySelector("#cat").setAttribute("visible","true"),this.showCharacterInfo(t)},showCharacterInfo:function(e){const t=document.querySelector("#infoPanel");t.setAttribute("visible","true"),t.setAttribute("scale","1 1 1"),document.querySelector("#characterName").setAttribute("text","value",e),document.querySelectorAll('[id$="CharacterImage"]').forEach((e=>e.setAttribute("visible","false")));const r=document.querySelector(`#${e.replace(" ","")}CharacterImage`);r&&r.setAttribute("visible","true")}}),window.addEventListener("load",(()=>{const e=localStorage.getItem("chosenCharacter");if(e){document.querySelector("[main-character-chooser]").components["main-character-chooser"].chooseCharacter({detail:{characterName:e}})}}));