Game slot machine

#1

how to proceed with spin button . I am not getting what to do in the code?

#2

@yash.jain what you have to do is implement a spin button, on spin.click call the updateAnimation with the speed value, set the counter inside the setinterval so that it will break after certain amount of rotations, then check the values if all 3 are same, display you win

#3

let value1=document.getElementById(‘value1’) let value2=document.getElementById(‘value2’) let value3=document.getElementById(‘value3’) let inpSpeed=document.getElementById(‘inpSpeed’) let spin=document.getElementById(‘spin’) let slot=document.getElementsByClassName(‘slot’) let values=[ ‘:watch:’,‘:hourglass:’,‘:phone:’,‘:open_umbrella:’,‘:slight_smile:’,‘:wheel_of_dharma:’,‘:radioactive:’,‘:heart:’ ] function getRandomValue(){ return values[Math.floor(Math.random()*8)] } let animationId; function updateAnimation(newSpeed){ if (animationId) clearInterval(animationId) animationId=setInterval(()=>{ value1.innerText=getRandomValue() value2.innerText=getRandomValue() value3.innerText=getRandomValue() },1000/newSpeed ) } spin.onclick=function(){ updateAnimation(ev.target.value) } inpSpeed.onchange=function(ev){ // console.log(‘value changed’,ev.target.value) //document.documentElement => this is “:root” of css document.documentElement.style.setProperty(’–speed’,ev.target.value) }

#4

This is my code. Is this what you are saying

#5

@yash.jain now you have to put a stop condition in setinterval and then compare the values

#6

I have tried doing it .But the animation is not getting stopped.

#7

var timesRun = 0; function updateAnimation(newSpeed){ if (animationId) clearInterval(animationId) animationId=setInterval(()=>{ value1.innerText=getRandomValue() value2.innerText=getRandomValue() value3.innerText=getRandomValue() timesRun += 1; if(timesRun === 10){ clearInterval(interval); } },1000/newSpeed ) } spin.onclick=function(){ updateAnimation(ev.target.value) }

#8

@yash.jain what is clearInterval(interval); there is no interval here, you have animationId use that
clearInterval(animationId), and it will work

#9

I hope I’ve cleared your doubt. I ask you to please rate your experience here
Your feedback is very important. It helps us improve our platform and hence provide you
the learning experience you deserve.

On the off chance, you still have some questions or not find the answers satisfactory, you may reopen
the doubt.