(function () {

  'use strict';

  var ImageGalleryProto = function () {
    var _config = {};
    var _buffer = null;
    var _el = null;

    var _createElementByTag = function (tag) {
      return function () {
        return document.createElement(tag);
      };
    };

    var _createDivElement = _createElementByTag('div');

    var _createDivElementWithClass = function (className) {
      var div = _createDivElement();
      div.className = className;
      return div;
    }

    var _getPlaceHoldersByCount = function (count) {
      var placeholders = [];
      for (var i = 0; i < count; i++) {
        placeholders.push(_createDivElement);
      }

      return placeholders;
    };

    return {
      init: function (options) {
        _buffer = options.buffer;
        _config = options.config;
      },

      render: function () {
        var wrapper = _createDivElementWithClass(_config.wrapperClass);
        var mask = _createDivElementWithClass(_config.maskClass);
        var placeholders = _getPlaceHoldersByCount(3);

        placeholders.forEach(function (placeholder) {
          mask.appendChild(placeholder);
        });

        if (_config.showArrows) {
          var leftArrow = _createDivElementWithClass(_config.leftArrowClass);
          var rightArrow = _createDivElementWithClass(_config.rightArrowClass);
          wrapper.appendChild(leftArrow);
          wrapper.appendChild(rightArrow);
        }

        wrapper.appendChild(mask);

        _el = wrapper;

        return _el;
      }
    };
  };

  components.ImageGallery = function ImageGallery () {
    // return $.extend(true, components.Component, Object.create(ImageGalleryProto));
    return $.extend(true, {}, Object.create(ImageGalleryProto()));
  };

})();