console.clear();

var introTL, secondSectionTL;

function init() {
  // first section
  var mainTitles = new SplitText(".main-content h1", {
    type: "lines",
    linesClass: "line line++"
  });
  
  introTL = gsap.timeline({paused: true});
  
  introTL.from(mainTitles.lines, {
    duration: 2, 
    yPercent: 100,
    ease: "power4",
    delay: 1,
    stagger: 0.25
  });
  
  
  // second section
  var phototitle = new SplitText(".photobio-title h1", {
    type: "lines",
    linesClass: "line line++"
  });
  
  secondSectionTL = gsap.timeline({paused: true});
  
  secondSectionTL.from(phototitle.lines, {
    duration: 2, 
    yPercent: 100,
    ease: "power4",
    delay: 1,
    stagger: 0.25
  });
  
  var secondSectionSplitText = new SplitText(".photobio-title p", { type: "lines,words" }),
      chars = secondSectionSplitText.lines; //an array of all the divs that wrap each character
  
  secondSectionTL.from(chars, {
    opacity: 0,
    duration: 1.5,
    y: 100,
    ease: "power4",
    stagger: 0.15
  });
}

function update() {
  //main
  if ($(".main").hasClass("fp-completely")) {
    secondSectionTL.reverse();
    introTL.play();
  }
  //red-bg
  else if ($(".red-bg").hasClass("fp-completely")) {
    introTL.reverse();
    secondSectionTL.play();
  }
}

$(document).ready(function() {
  init();
  
  $("#fullPage").fullpage({
    scrollOverflow: true,
    autoScrolling: true,
    navigation: true,
    scrollingSpeed: 500,
    afterLoad: function(origin, destination, direction) {
      setTimeout(function() {
        update();
      }, 50);
    }
  });
});