Search the Community
Showing results for tags 'slots'.
this is my first attempt using GSAP (it seemed to be the best animation library I could find). I'm trying to create a simple slot machine. Here is a codepen with the minimal amount of code. http://codepen.io/dax006/pen/LGoNrE It does 3 things. After creating a random symbol, it 1) creates a 'constantly spinning' tween and saves it 2) creates a 'slowing' tween and saves it 3) resets the progress of each tween/symbol to be 1/4th down the screen. Bug/problem #1 - Tweens are playing yet NOWHERE do I play() the tween. The tweens are PAUSED by default. Even if they are not paused, I IMMEDIATELY pause() them in resetslot(). Problem #2 - Progress() does not seem to be setting all symbols accurately (you can immediately see that the top symbol is askew) Problem #3 - Setting a tweens progress() to zero triggers its onComplete (watch the console) Problem #4 - Setting a tweens progress to 1 triggers its onComplete even though I have SuppressEvents:true (watch the console) I'm very frustrated with GSAP at the moment . Any help is appreciated -John Edit:problem 5 can't pause the codepen demo so can't read console
First of all let me say it's a pleasure finding out about GreenSock and I am looking forward integrating your products (Blitmask and TweenMax) to my projects. THE SITUATION IS AS FOLLOWS: I am making a video slot machine games. 4 rows x 5 columns. Each column represents a Blipmask object. I have 5 BIG elements strips (about 42 elements on the strip) and I use Blitmask(blitmask has dimensions width of element x (4 x height of element) and TweenMax to scroll them. 1st column stops after it traveled the distance of 12 elements, 2nd column stops after it traveled the distance of 17 elements and each column after that, 5 elements added. The last column stop after it travelled 32 elements MY PROBLEM: 1) I want as soon as SPIN button is pressed, the 5 blitmasks to start spinning at the same speed 2) At the end of each tween I want a bouce effect that uses only a few frames for it (regardless of the duration of the tween). I am using frames in my tween as duration parameter. So for example the 1st column runs for 100 frames, I want the bounce effect to be the last 10 frames. For the last column that runs let's say X frames I still want the bounce effect to be 10 frames. So easing out to be irrelevant of duration. 3) I want the bouncing/easeOut to be sudden and not smooth. I prefer minimal deacelleration in the end (Imagine a real world slot machine - it stops very sudden) 4) Finally, I want the sliding speed to be the same for all columns. I adjust the duration accordingly to make sure that the stopping of columns will happen at regular intervals. I tried many easing out techniques but nothing seems to work and satisfy ALL the above requirements. If anyone has some suggestions please feel free to help. Thank you for reading this and trying to help
Hello First i would like to thank you for sharing the amazing and useful Greensock. I am trying to create an animated slot machine, and i tried to use a carousel slider shared on a forum topic (the following link http://codepen.io/bassta/pen/LckBh) since Blitmask is only avaliable for AS. It doesn't seem to be the best solution. I would like to know if i can achieve the slot machine effect with TweenMax, with a Blitmask's similar effect.