'use strict';

/**
 * Overlay
 *
 * Controls creating, showing, hiding and removing of overlays
 */
var Overlay = (function() {
  var $body = $('body');

  function Overlay() {
    this.assignClass = 'c-overlay';
    this.el = false;
    this.animate = {
      duration: 0.3,

      visible: {
        display: 'block',
        autoAlpha: 0.7,
        ease: Power3.easeInOut
      },

      hidden: {
        display: 'none',
        autoAlpha: 0,
        ease: Power3.easeInOut
      }
    };
  }

  /**
   * Check if the overlay has already been created
   */
  Overlay.prototype.isCreated = function() {
    return this.el === false || typeof this.el === 'undefined' ? false: true;
  };

  /**
   * Create the overlay
   */
  Overlay.prototype.create = function() {
    var self = this;

    this.el = $('<div/>', {
      'class': this.assignClass
    }).appendTo($body);

    $(this.el).on('click', function() {
        self.hide();
    });
  };

  /**
   * Show the overlay
   */
  Overlay.prototype.show = function() {
    $body.addClass('prevent-overflow');
    TweenLite.fromTo(this.el, this.animate.duration, this.animate.hidden, this.animate.visible);
  };

  /**
   * Hide the overlay
   */
  Overlay.prototype.hide = function() {
    $body.removeClass('prevent-overflow');
    TweenLite.fromTo(this.el, this.animate.duration, this.animate.visible, this.animate.hidden);
  };

  /**
   * Remove the overlay
   */
  Overlay.prototype.destroy = function() {
    $body.removeClass('prevent-overflow');
    $(this.el).remove();
    this.el = false;
  };

  return Overlay;
})();

var overlay = new Overlay(),
    $openOverlay = $('.js-open-overlay');

overlay.create();

$openOverlay.on('click', function() {
	overlay.show();
});