I successfully implemented a native slider from Framer to control the timeline, instead of using jQuery and the jQuery UI slider library.
My main problem emerged when I realized that the timeline events [onComplete, onProgress...] were not trigger at all.
Here is the prototype.
Sadly, I don't know how to isolate the bug or recreate this outside of Framer, but essentially my code goes as follows.
init = new TimelineMax({onComplete:updateSlider})
# hSection is an Framer layer
init.from(hSection, .5, {opacity: 0, y:"+=200", ease:Power3.easeInOut}, 0)
# footer.children is an Framer layer with elements within
init.staggerFrom(footer.children, .5, {opacity: 0, y:"+=25", ease:Power3.easeInOut}, -.15)
# Here is the slider component
slider = new SliderComponent
width: Screen.width / 2
height: 20
# Here is the slider event that I used to drag and affect the timeline progress. This works like a charm.
slider.on "change:value", (event, ui)->
init.progress(ui.value ).pause()
return
# Here is the function that needs to be triggered the moment that timeline is completed. Nothing happens.
updateSlider = () ->
print init.progress()
Can you help me out?
CoffeeScript code