Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

Search the Community

Showing results for tags 'synch'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager
  • Supercharge

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Personal Website


Twitter


CodePen


Company Website


Location


Interests

Found 1 result

  1. This isn't so much a question as it is a warning. If I had hair I would've pulled it all out by now. I was working on a way to use TimelineMax to trigger separate videos to play in sequence as well as follow a scrub bar. Needed to start and/or stop video clips at any point in the video and then trigger the next one to simulate someone doing a video edit - where they might drag in the edges only exposing certain parts of the video's timeline. So, I just set up a simple array of objects with properties that I could store and retrieve at any point like this: vidArr = [ vid1 = {el: document.getElementById('vid1'), duration: null, startAt: null, endAt: null, delay: null, active: false, loaded: false}, vid2 = {el: document.getElementById('vid2'), duration: null, startAt: null, endAt: null, delay: null, active: false, loaded: false}, vid3 = {el: document.getElementById('vid3'), duration: null, startAt: null, endAt: null, delay: null, active: false, loaded: false} ]; If you look closely you'll see I named one of the properties delay which was as dumb as it gets. Rather than doing much in the way of tweening, I'm just using TimelineMax to trigger opacity, start and end times on the video objects. There is a quick opacity tween at one point but mainly just to keep the first video from flashing on replay. Here's what it looked like: for( let vid of vidArr ) { var tl = new TimelineMax({onStart:startVideo, onStartParams:[vid.el]}); tl.set(vid.el, {currentTime:vid.startAt, immediateRender:false}, 0) .set(vid, {active:true, delay:masterTL.duration(), immediateRender:false}, 0) .to(vid.el, 0.2, {opacity:1, immediateRender:false}, 0) .set(vid.el, {opacity:0, immediateRender:false}, vid.endAt) .set(vid, {active:false, immediateRender:false}, vid.endAt); vid.delay = masterTL.duration(); masterTL.add(tl,vid.delay); } There are 3 videos and each one is 10 seconds or under. The first 2 added up to 17.2 seconds. Everything was good until it got to the last time through the loop and right after this... .set(vid, {active:true, delay:masterTL.duration(), immediateRender:false}, 0) ...where it was ending up being like 34 seconds long instead of 22 or so. Even though I was telling it to set a value on the delay property for vid it was setting it as a delay property for the timeline itself. Sometimes I surprise myself at how long I can stare at something and not see it. Anyway, don't use reserved properties for your custom objects! I renamed the property to wait and all started working. I do have one quick question though. Should it be necessary for me to add immediateRender: false in all those places? I tried to figure out a way to set that once in that glob of set's and to's but it would always break. Anyway, if anyone is looking for a way to accomplish this, it's working in the codepen.
×