我有一个使用 8thwall 创建的 webapp,并为动画实现了一个新按钮。我为这个按钮添加了与其他按钮相同的逻辑(之前的按钮工作正常),但由于某种原因,这个按钮没有功能。
不起作用的按钮是 shareButtonComponent。有人可以指导我吗?
const replayButtonComponent = () => ({
init() {
const model = document.getElementById('model')
const replayButton = document.getElementById('replaybutton')
const shopButton = document.getElementById('shopbutton')
const entity = document.querySelector('[sound]')
model.addEventListener('animation-finished', () => {
model.setAttribute('animation-mixer', {
clip: 'rabitidle',
loop: 'once',
timeScale: 0,
})
replayButton.classList.remove('inactive')
shopButton.classList.remove('inactive')
})
replayButton.style.display = 'block'
const replayAnimation = () => {
replayButton.classList.add('inactive')
shopButton.classList.add('inactive')
model.setAttribute('animation-mixer', {
clip: 'rabitanim',
loop: 'once',
timeScale: 1,
})
entity.components.sound.playSound()
}
replayButton.onclick = replayAnimation
},
})
export {replayButtonComponent}
const shareButtonComponent = () => ({
init() {
const shareToggle = document.getElementById('sharebutton')
shareToggle.style.display = 'block'
const holder = document.getElementById('hyperlink-holder')
shareToggle.addEventListener('click', () => {
holder.classList.toggle('holder-active')
})
},
})
export {shareButtonComponent}
const shopButtonComponent = () => ({
init() {
const shopButton = document.getElementById('shopbutton')
shopButton.style.display = 'block'
const shop = () => {
window.open(
'https://www.amazon.com/Goodnight-Bubbala-Sheryl-Haft/dp/0525554777/ref=sr_1_1?crid=1EDVMUS03H9C5&keywords=Sheryl+haft&qid=1640032526&sprefix=sheryl+haft%2Caps%2C120&sr=8-1'
)
}
shopButton.onclick = shop
},
})
export {shopButtonComponent}
const animationComponent = () => ({
init() {
const entity = document.querySelector('[sound]')
const model = document.getElementById('model')
this.el.sceneEl.addEventListener('realityready', () => {
model.setAttribute('animation-mixer', {
clip: 'rabitanim',
loop: 'once',
})
entity.components.sound.playSound()
model.setAttribute('scale', {x: 1, y: 1, z: 1})
})
},
})
export {animationComponent}