Jump to content


  • Posts

  • Joined

  • Last visited

GRoliins's Achievements



  1. I think your second suggestion is what I am looking for. A few questions about it: 1) If I call master.restart() or master.resume(0), it will play through all of the sub-timelines, correct? 2) If I want the master timeline to play different TLs depending on my variable, do I have to set autoRemoveChildren to "true" and then-re-add the sub-timelines each time? Thanks for your help!
  2. Hello, I'm afraid I can't give a CodePen example of my code, as I'm working on an JavaScript application under NDA. All of the animations are happening in an HTML canvas, so all of my images and movies are JS objects. I can share a slightly obfuscated version of one of my functioning timelines: function TimeLine4() { var self = this; this.duration = 4.3; var duration = this.duration; this.pausetime = duration / 2; this.visible = false; this.isVisible = false; //****** Adding in the "Movies" that will play in this timeline ******// // rightIdle already added elsewhere var fourthBubbleAnim = new BubbleR4TP(); // avalanche has already been added elsewhere this.TL = new TimelineMax( { useFrames: false, ease: Linear.easeNone, paused: true, align: "sequence", callbackScope: self, onComplete: function() { this.visible = false; animationFinished = true; this.TL.pause(0); } }); this.TL.add(rightIdle.start, 0); this.TL.add(fourthBubbleAnim.start, 0); this.TL.add(avalanche.start, 2); this.start = function() { if ( this.visible == false ) { this.TL.restart(true, false); animationFinished = false; this.visible = true; } } Object.defineProperty( this, 'visible', { set: function( value ) { this.isVisible = value; }, get: function() { return this.isVisible; } }); this.draw = function( context ) { var clearContext = context || ctx; // left idle already drawn fourthBubbleAnim.draw( clearContext ); avalanche.draw( clearContext ); } } // Elsewhere in my code I have: var TL4 = new TimeLine4(); The above timeline plays properly when I call TL4.start(). I am trying to create a conditional timeline of timelines that adds in (and plays) TL1-4 based on a returned variable.
  3. Hello, I have been using GreenSock tools for a few months now, but I am hitting a bit of a wall with timelines that I don't know how to overcome. I have successfully created 4 animated timelines that individually run when I call a start() function, e.g. TL1.start(), TL2.start(), etc. I now want to create a conditional timeline that plays one to four of the other timelines depending on an argument in the super-timeline's function, e.g. : function superTimeline() { this.superTL = new TimeLineMax(); // code code code this.start( number) { var number = number this.superTL.add(TL1.start, 0); if ( number > 1 ) { this.superTL.add(TL2.start, 2); } if ( number > 2 ) { this.superTL.add(TL3.start, 4); } etc... this.superTL.restart(true, false); } } My problem is that the super timeline is not even calling the first, non-conditional timeline function (TL1.start). Can someone please tell me what I'm doing wrong? Cheers, GR