/*!
 * jQuery Cre-animate - Scrolling Animations - v1.1
 * Copyright (c) 2014 CreativelyCoded
 * support@creativelycoded.com
 *
 * http://www.creativelycoded.com/
 */

(function($) { "use strict";

var disablePoint = 1024;

if ($(window).width() < disablePoint) {
// Do nothing //
}
else {

  var dataanimation = {
    fadein: 'fade-in',
    fadeout: 'fade-out',
    slidedownfromtop: 'slide-down-from-top',
    slideinfromright: 'slide-in-from-right',
    slideupfrombottom: 'slide-up-from-bottom',
    slideinfromleft: 'slide-in-from-left',
    scaleup: 'scale-up',
    scaledown: 'scale-down',
    rotate: 'rotate',
    flipyaxis: 'flip-y-axis',
    flipxaxis: 'flip-x-axis'
  };

  var cssEase = {
    'ease': 'ease',
    'in': 'ease-in',
    'out': 'ease-out',
    'in-out': 'ease-in-out',
    'snap': 'cubic-bezier(0,1,.5,1)',
    // Penner equations
    'easeOutCubic': 'cubic-bezier(.215,.61,.355,1)',
    'easeInOutCubic': 'cubic-bezier(.645,.045,.355,1)',
    'easeInCirc': 'cubic-bezier(.6,.04,.98,.335)',
    'easeOutCirc': 'cubic-bezier(.075,.82,.165,1)',
    'easeInOutCirc': 'cubic-bezier(.785,.135,.15,.86)',
    'easeInExpo': 'cubic-bezier(.95,.05,.795,.035)',
    'easeOutExpo': 'cubic-bezier(.19,1,.22,1)',
    'easeInOutExpo': 'cubic-bezier(1,0,0,1)',
    'easeInQuad': 'cubic-bezier(.55,.085,.68,.53)',
    'easeOutQuad': 'cubic-bezier(.25,.46,.45,.94)',
    'easeInOutQuad': 'cubic-bezier(.455,.03,.515,.955)',
    'easeInQuart': 'cubic-bezier(.895,.03,.685,.22)',
    'easeOutQuart': 'cubic-bezier(.165,.84,.44,1)',
    'easeInOutQuart': 'cubic-bezier(.77,0,.175,1)',
    'easeInQuint': 'cubic-bezier(.755,.05,.855,.06)',
    'easeOutQuint': 'cubic-bezier(.23,1,.32,1)',
    'easeInOutQuint': 'cubic-bezier(.86,0,.07,1)',
    'easeInSine': 'cubic-bezier(.47,0,.745,.715)',
    'easeOutSine': 'cubic-bezier(.39,.575,.565,1)',
    'easeInOutSine': 'cubic-bezier(.445,.05,.55,.95)',
    'easeInBack': 'cubic-bezier(.6,-.28,.735,.045)',
    'easeOutBack': 'cubic-bezier(.175, .885,.32,1.275)',
    'easeInOutBack': 'cubic-bezier(.68,-.55,.265,1.55)'
  };

//GLOBAL TRANSITION VARIABLES
  var opacityZero = {
    'opacity': '0',
    '-ms-opacity': '0',
    '-webkit-opacity': '0',
    '-moz-opacity': '0',
    '-o-opacity': '0',
  };
  var opacityFull = {
    'opacity': '1',
    '-ms-opacity': '1',
    '-webkit-opacity': '1',
    '-moz-opacity': '1',
    '-o-opacity': '1',
  };

// DEFAULT ATTRIBUTES FOR ELEMENTS BASED ON ANIMATION TYPE
  $(document).ready(function() {
    $('html, body').css('overflow-x', 'hidden');
	$('html').css('height', '100%');
	$('.cre-animate').css({'position': 'relative'});
    $('.cre-animate').each(function() {
      var dataanimationUser = $(this).data('animation');

      if (dataanimationUser == dataanimation.fadein) {
        $(this).css(opacityZero);
      }

      if (dataanimationUser == dataanimation.fadeout) {
        $(this).css(opacityFull);
      }

      if (dataanimationUser == dataanimation.slideinfromright) {
        $(this).css({'right': '-400px'}).css(opacityZero);
      }

      if (dataanimationUser == dataanimation.slideinfromleft) {
        $(this).css({'left': '-400px'}).css(opacityZero);
      }

      if (dataanimationUser == dataanimation.slideupfrombottom) {
        $(this).css({'bottom': '-200px'}).css(opacityZero);
      }

      if (dataanimationUser == dataanimation.slidedownfromtop) {
        $(this).css({'top': '-200px'}).css(opacityZero);
      }

      if (dataanimationUser == dataanimation.rotate) {
        $(this).css(opacityZero);
      }

      if (dataanimationUser == dataanimation.scaleup) {
        var datastartscale = 0;
        var startScale = {
          'transform': 'scale(' + datastartscale + ')',
          '-ms-transform': 'scale(' + datastartscale + ')',
          '-webkit-transform': 'scale(' + datastartscale + ')',
          '-moz-transform': 'scale(' + datastartscale + ')',
          '-o-transform': 'scale(' + datastartscale + ')'
        };
        $(this).css(startScale).css(opacityZero);
      }

      if (dataanimationUser == dataanimation.scaledown) {
        var datastartscale2 = 2;
        var startScale2 = {
          'transform': 'scale(' + datastartscale2 + ')',
          '-ms-transform': 'scale(' + datastartscale2 + ')',
          '-webkit-transform': 'scale(' + datastartscale2 + ')',
          '-moz-transform': 'scale(' + datastartscale2 + ')',
          '-o-transform': 'scale(' + datastartscale2 + ')'
        };
        $(this).css(startScale2).css(opacityZero);
      }

      if (dataanimationUser == dataanimation.flipyaxis) {
        var flipY = {
          'transform': 'rotateY(180deg)',
          '-ms-transform': 'rotateY(180deg)',
          '-webkit-transform': 'rotateY(180deg)',
          '-moz-transform': 'rotateY(180deg)',
          '-o-transform': 'rotateY(180deg)'
        };
        $(this).css(flipY).css(opacityZero);
      }

      if (dataanimationUser == dataanimation.flipxaxis) {
        var flipX = {
          'transform': 'rotateX(180deg)',
          '-ms-transform': 'rotateX(180deg)',
          '-webkit-transform': 'rotateX(180deg)',
          '-moz-transform': 'rotateX(180deg)',
          '-o-transform': 'rotateX(180deg)'
        };
        $(this).css(flipX).css(opacityZero);
      }
    });
  });

  // ONSCROLL ANIMATION OF ELEMENTS
  $(window).on('scroll load', function() {
    $('.cre-animate').each(function() {
      // GET ANIMATION TYPE FROM ELEMENT
      var dataanimationUser = $(this).data('animation');

      // CALCULATES THE TRIGGER POINT USING THE OFFSET
      var dataoffset = $(this).data('offset');
      var parsePercent = parseFloat(dataoffset);
      var decimal = parsePercent / 100;
      var triggerpoint = $(window).height() * decimal + $(window).scrollTop(); // Call point in Viewport: viewport height * decimal(%) + pixels to top of window
      var element = $(this).offset().top;

      if (dataanimationUser == dataanimation.slidedownfromtop) {
        element = element + 200;
      }

      if (dataanimationUser == dataanimation.slideupfrombottom) {
        element = element - 200;
      }

      if (dataanimationUser == dataanimation.scaleup) {
        element = element - $(this).height() / 2;
      }

      if (dataanimationUser == dataanimation.scaledown) {
        element = element + $(this).height() / 2;
      }

      // ASSIGNS VALUES FOR THE EASING TYPES
      var dataeasing = $(this).data('easing');
      if (cssEase[dataeasing]) {
        dataeasing = cssEase[dataeasing];
      }

      // TRANSITION OPTIONS ARE CREATED
      var datadelay = $(this).data('delay');
      var dataspeed = $(this).data('speed');
      var transitionOptions = {
        'transition-duration': dataspeed + 'ms',
        '-ms-transition-duration': dataspeed + 'ms',
        '-webkit-transition-duration': dataspeed + 'ms',
        '-moz-transition-duration': dataspeed + 'ms',
        '-o-transition-duration': dataspeed + 'ms',
        'transition-timing-function': dataeasing,
        '-ms-transition-timing-function': dataeasing,
        '-webkit-transition-timing-function': dataeasing,
        '-moz-transition-timing-function': dataeasing,
        '-o-transition-timing-function': dataeasing,
        'transition-delay': datadelay + 'ms',
        '-ms-transition-delay': datadelay + 'ms',
        '-webkit-transition-delay': datadelay + 'ms',
        '-moz-transition-delay': datadelay + 'ms',
        '-o-transition-delay': datadelay + 'ms'
      };

      // TRIGGERS THE ANIMATIONS
      if (element < triggerpoint) {
        // FADE IN
        if (dataanimationUser == dataanimation.fadein) {
          $(this).css(opacityFull).css(transitionOptions);
        }

        // FADE OUT
        if (dataanimationUser == dataanimation.fadeout) {
          $(this).css(opacityZero).css(transitionOptions);
        }

        // SLIDE DOWN FROM TOP
        if (dataanimationUser == dataanimation.slidedownfromtop) {
          $(this).css({'top': '0'}).css(opacityFull).css(transitionOptions);
        }

        // SLIDE UP FROM BOTTOM
        if (dataanimationUser == dataanimation.slideupfrombottom) {
          $(this).css({'bottom': '0'}).css(opacityFull).css(transitionOptions);
        }

        // SLIDE IN FROM RIGHT
        if (dataanimationUser == dataanimation.slideinfromright) {
          $(this).css({'right': '0'}).css(opacityFull).css(transitionOptions);
        }

        // SLIDE IN FROM LEFT
        if (dataanimationUser == dataanimation.slideinfromleft) {
          $(this).css({'left': '0'}).css(opacityFull).css(transitionOptions);
        }

        // SCALE UP
        if (dataanimationUser == dataanimation.scaleup) {
          var dataendscale = 1;
          var endScale = {
            'transform': 'scale(' + dataendscale + ')',
            '-ms-transform': 'scale(' + dataendscale + ')',
            '-webkit-transform': 'scale(' + dataendscale + ')',
            '-moz-transform': 'scale(' + dataendscale + ')',
            '-o-transform': 'scale(' + dataendscale + ')'
          };
          $(this).css(endScale).css(opacityFull).css(transitionOptions);
        }

        // SCALE DOWN
        if (dataanimationUser == dataanimation.scaledown) {
          var dataendscale2 = 1;
          var endScale2 = {
            'transform': 'scale(' + dataendscale2 + ')',
            '-ms-transform': 'scale(' + dataendscale2 + ')',
            '-webkit-transform': 'scale(' + dataendscale2 + ')',
            '-moz-transform': 'scale(' + dataendscale2 + ')',
            '-o-transform': 'scale(' + dataendscale2 + ')'
          };
          $(this).css(endScale2).css(opacityFull).css(transitionOptions);
        }

        // ROTATE
        if (dataanimationUser == dataanimation.rotate) {
          var degrees = 360;
          var rotation = {
            'transform': 'rotate(' + degrees + 'deg)',
            '-ms-transform': 'rotate(' + degrees + 'deg)',
            '-webkit-transform': 'rotate(' + degrees + 'deg)',
            '-moz-transform': 'rotate(' + degrees + 'deg)',
            '-o-transform': 'rotate(' + degrees + 'deg)'
          };
          $(this).css(rotation).css(opacityFull).css(transitionOptions);
        }

        // FLIP Y AXIS
        if (dataanimationUser == dataanimation.flipyaxis) {
          var flipY = {
            'transform': 'rotateY(360deg)',
            '-ms-transform': 'rotateY(360deg)',
            '-webkit-transform': 'rotateY(360deg)',
            '-moz-transform': 'rotateY(360deg)',
            '-o-transform': 'rotateY(360deg)'
          };
          $(this).css(flipY).css(opacityFull).css(transitionOptions);
        }

        // FLIP X AXIS
        if (dataanimationUser == dataanimation.flipxaxis) {
          var flipX = {
            'transform': 'rotateX(360deg)',
            '-ms-transform': 'rotateX(360deg)',
            '-webkit-transform': 'rotateX(360deg)',
            '-moz-transform': 'rotateX(360deg)',
            '-o-transform': 'rotateX(360deg)'
          };
          $(this).css(flipX).css(opacityFull).css(transitionOptions);
        }
      }
    });
  });
}
}(jQuery));