//***********
//setting up rAF, code from HTML5rocks
//***********
var rAF = requestAnimationFrame || mozRequestAnimationFrame || webkitRequestAnimationFrame || msRequestAnimationFrame;

//debouncing animation from trigger event and triggering only when scroll happens
var latestKnownScrollY = 0,
  ticking = false;

function onScroll() {
  latestKnownScrollY = window.scrollY;
  requestTick();
}

function requestTick() {
  if (!ticking) {
    rAF(update);
  }
  ticking = true;
}

function update() {
  // reset the tick so we can
  // capture the next onScroll
  ticking = false;
  var currentScrollY = latestKnownScrollY;

  //read window inner height property to determine appear location
  var windowHeight = window.innerHeight;
  var scrollAppearLocation = (windowHeight * 6 / 9) + currentScrollY;

  // read offset of DOM elements
  // and compare to the currentScrollY value
  // then apply some CSS classes // to the visible items

  if ($(".awesomeSauce").length) {
    addAnimationClass("awesomeSauce");
  }

  function addAnimationClass(targetName) {
    var targetObject = document.getElementsByClassName(targetName)[0];
    var targetObjectOffsetTop = targetObject.offsetTop;

    //debug positioning
    console.log('scrollAppearLocation = ' + scrollAppearLocation);
    console.log('targetObjectOffsetTop = ' + targetObjectOffsetTop);

    var tween = new TweenMax('.' + targetName, '3', {
      opacity: 0,
    });
    //mimic tween from behavior
     tween.pause();

    if (scrollAppearLocation > targetObjectOffsetTop) {
      //allow element to appear
      tween.reverse();
      tween.resume();
    } else {
      //hide element
      tween.restart();
      // tween.reverse();
      // tween.pause;
    }
  }

}

window.addEventListener('scroll', onScroll, false);