/*
                       _ _ _____                      _   _
                      | | |  __ \                    | | (_)
    ___  ___ _ __ ___ | | | |__) |_____   _____  __ _| |  _ ___
   / __|/ __| '__/ _ \| | |  _  // _ \ \ / / _ \/ _` | | | / __|
   \__ \ (__| | | (_) | | | | \ \  __/\ v /  __/ (_| | |_| \__ \
   |___/\___|_|  \___/|_|_|_|  \_\___| \_/ \___|\__,_|_(_) |___/ v.0.1.3
                                                        _/ |
                                                       |__/

    "declarative on-scroll reveal animations."

/*=============================================================================

    scrollreveal.js was inspired by cbpscroller.js (c) 2014 codrops.

    licensed under the mit license.
    http://www.opensource.org/licenses/mit-license.php

=============================================================================*/

/*! scrollreveal.js v0.1.3 (c) 2014 julian lloyd | mit license */

/*===========================================================================*/


window.scrollreveal = (function (window) {

  'use strict';

  // generator (increments) for the next scroll-reveal-id
  var nextid = 1;

  /**
   * requestanimationframe polyfill
   * @function
   * @private
   */
  var requestanimframe = (function () {
    return window.requestanimationframe ||
      window.webkitrequestanimationframe ||
      window.mozrequestanimationframe ||
      function (callback) {
        window.settimeout(callback, 1000 / 60);
    };
  }());

  function scrollreveal(options) {

      this.docelem = window.document.documentelement;
      this.options = this.extend(this.defaults, options);
      this.stylebank = {};

      if (this.options.init == true) this.init();
  }

  scrollreveal.prototype = {

    defaults: {
      after:   '0s',
      enter:   'bottom',
      move:    '24px',
      over:    '0.66s',
      easing:  'ease-in-out',
      opacity: 0,

  //  if 0, the element is considered in the viewport as soon as it enters
  //  if 1, the element is considered in the viewport when it's fully visible
      viewportfactor: 0.33,

  // if false, animations occur only once
  // if true, animations occur each time an element enters the viewport
      reset: false,

  // if true, scrollreveal.init() is automaticaly called upon instantiation
      init: true
    },

    /*=============================================================================*/

    init: function () {

      this.scrolled = false;

      var self = this;

  //  check dom for the data-scrollreveal attribute
  //  and initialize all found elements.
      this.elems = array.prototype.slice.call(this.docelem.queryselectorall('[data-scroll-reveal]'));
      this.elems.foreach(function (el, i) {

    //  capture original style attribute
        var id = el.getattribute("data-scroll-reveal-id");
        if (!id) {
            id = nextid++;
            el.setattribute("data-scroll-reveal-id", id);
        }
        if (!self.stylebank[id]) {
          self.stylebank[id] = el.getattribute('style');
        }

        self.update(el);
      });

      var scrollhandler = function (e) {
        // no changing, exit
        if (!self.scrolled) {
          self.scrolled = true;
          requestanimframe(function () {
            self._scrollpage();
          });
        }
      };

      var resizehandler = function () {

    //  if we’re still waiting for settimeout, reset the timer.
        if (self.resizetimeout) {
          cleartimeout(self.resizetimeout);
        }
        function delayed() {
          self._scrollpage();
          self.resizetimeout = null;
        }
        self.resizetimeout = settimeout(delayed, 200);
      };

      // capturescroll
      window.addeventlistener('scroll', scrollhandler, false);
      window.addeventlistener('resize', resizehandler, false);
    },

    /*=============================================================================*/

    _scrollpage: function () {
        var self = this;

        this.elems.foreach(function (el, i) {
          self.update(el);
        });
        this.scrolled = false;
    },

    /*=============================================================================*/

    parselanguage: function (el) {

  //  splits on a sequence of one or more commas or spaces.
      var words = el.getattribute('data-scroll-reveal').split(/[, ]+/),
          parsed = {};

      function filter (words) {
        var ret = [],

            blacklist = [
              "from",
              "the",
              "and",
              "then",
              "but",
              "with"
            ];

        words.foreach(function (word, i) {
          if (blacklist.indexof(word) > -1) {
            return;
          }
          ret.push(word);
        });

        return ret;
      }

      words = filter(words);

      words.foreach(function (word, i) {

        switch (word) {
          case "enter":
            parsed.enter = words[i + 1];
            return;

          case "after":
            parsed.after = words[i + 1];
            return;

          case "wait":
            parsed.after = words[i + 1];
            return;

          case "move":
            parsed.move = words[i + 1];
            return;

          case "ease":
            parsed.move = words[i + 1];
            parsed.ease = "ease";
            return;

          case "ease-in":
            parsed.move = words[i + 1];
            parsed.easing = "ease-in";
            return;

          case "ease-in-out":
            parsed.move = words[i + 1];
            parsed.easing = "ease-in-out";
            return;

          case "ease-out":
            parsed.move = words[i + 1];
            parsed.easing = "ease-out";
            return;

          case "over":
            parsed.over = words[i + 1];
            return;

          default:
            return;
        }
      });

      return parsed;
    },


    /*=============================================================================*/

    update: function (el) {

      var css   = this.gencss(el);
      var style = this.stylebank[el.getattribute("data-scroll-reveal-id")];

      if (style != null) style += ";"; else style = "";

      if (!el.getattribute('data-scroll-reveal-initialized')) {
        el.setattribute('style', style + css.initial);
        el.setattribute('data-scroll-reveal-initialized', true);
      }

      if (!this.iselementinviewport(el, this.options.viewportfactor)) {
        if (this.options.reset) {
          el.setattribute('style', style + css.initial + css.reset);
        }
        return;
      }

      if (el.getattribute('data-scroll-reveal-complete')) return;

      if (this.iselementinviewport(el, this.options.viewportfactor)) {
        el.setattribute('style', style + css.target + css.transition);
    //  without reset enabled, we can safely remove the style tag
    //  to prevent css specificy wars with authored css.
        if (!this.options.reset) {
          settimeout(function () {
            if (style != "") {
              el.setattribute('style', style);
            } else {
              el.removeattribute('style');
            }
            el.setattribute('data-scroll-reveal-complete',true);
          }, css.totalduration);
        }
      return;
      }
    },

    /*=============================================================================*/

    gencss: function (el) {
      var parsed = this.parselanguage(el),
          enter,
          axis;

      if (parsed.enter) {

        if (parsed.enter == "top" || parsed.enter == "bottom") {
          enter = parsed.enter;
          axis = "y";
        }

        if (parsed.enter == "left" || parsed.enter == "right") {
          enter = parsed.enter;
          axis = "x";
        }

      } else {

        if (this.options.enter == "top" || this.options.enter == "bottom") {
          enter = this.options.enter
          axis = "y";
        }

        if (this.options.enter == "left" || this.options.enter == "right") {
          enter = this.options.enter
          axis = "x";
        }
      }

  //  after all values are parsed, let’s make sure our our
  //  pixel distance is negative for top and left entrances.
  //
  //  ie. "move 25px from top" starts at 'top: -25px' in css.

      if (enter == "top" || enter == "left") {
        if (parsed.move) {
          parsed.move = "-" + parsed.move;
        }
        else {
          parsed.move = "-" + this.options.move;
        }
      }

      var dist    = parsed.move    || this.options.move,
          dur     = parsed.over    || this.options.over,
          delay   = parsed.after   || this.options.after,
          easing  = parsed.easing  || this.options.easing,
          opacity = parsed.opacity || this.options.opacity;

      var transition = "-webkit-transition: -webkit-transform " + dur + " " + easing + " " + delay + ",  opacity " + dur + " " + easing + " " + delay + ";" +
                               "transition: transform " + dur + " " + easing + " " + delay + ", opacity " + dur + " " + easing + " " + delay + ";" +
                      "-webkit-perspective: 1000;" +
              "-webkit-backface-visibility: hidden;";

  //  the same as transition, but removing the delay for elements fading out.
      var reset = "-webkit-transition: -webkit-transform " + dur + " " + easing + " 0s,  opacity " + dur + " " + easing + " " + delay + ";" +
                          "transition: transform " + dur + " " + easing + " 0s,  opacity " + dur + " " + easing + " " + delay + ";" +
                 "-webkit-perspective: 1000;" +
         "-webkit-backface-visibility: hidden;";

      var initial = "-webkit-transform: translate" + axis + "(" + dist + ");" +
                            "transform: translate" + axis + "(" + dist + ");" +
                              "opacity: " + opacity + ";";

      var target = "-webkit-transform: translate" + axis + "(0);" +
                           "transform: translate" + axis + "(0);" +
                             "opacity: 1;";
      return {
        transition: transition,
        initial: initial,
        target: target,
        reset: reset,
        totalduration: ((parsefloat(dur) + parsefloat(delay)) * 1000)
      };
    },

    getviewporth : function () {
      var client = this.docelem['clientheight'],
        inner = window['innerheight'];

      return (client < inner) ? inner : client;
    },

    getoffset : function(el) {
      var offsettop = 0,
          offsetleft = 0;

      do {
        if (!isnan(el.offsettop)) {
          offsettop += el.offsettop;
        }
        if (!isnan(el.offsetleft)) {
          offsetleft += el.offsetleft;
        }
      } while (el = el.offsetparent)

      return {
        top: offsettop,
        left: offsetleft
      }
    },

    iselementinviewport : function(el, h) {
      var scrolled = window.pageyoffset,
          viewed = scrolled + this.getviewporth(),
          elh = el.offsetheight,
          eltop = this.getoffset(el).top,
          elbottom = eltop + elh,
          h = h || 0;

      return (eltop + elh * h) <= viewed
          && (elbottom) >= scrolled
          || (el.currentstyle? el.currentstyle : window.getcomputedstyle(el, null)).position == 'fixed';
    },

    extend: function (a, b){
      for (var key in b) {
        if (b.hasownproperty(key)) {
          a[key] = b[key];
        }
      }
      return a;
    }
  }; // end scrollreveal.prototype

  return scrollreveal;
})(window);