(function() {
  'use strict';

  window.utils = window.utils || {};

  window.utils.aside = function(el) {
    var asideEl = el;
    var collapsed = false;
    var collClass = 'main__aside--collapsed';
    var animClass = 'main__aside--transitioning';

    init();
    function init() {
      var collLS = window.localStorage.getItem('asidenavCollapsed') === 'true';
      if (document.body.getBoundingClientRect().width < 999 || collLS) {
        asideEl.classList.add(collClass);
        collapsed = true;
      }
    }

    function check() {
      if (collapsed && !hasClass() || !collapsed && hasClass()) {
        asideEl.classList.add(animClass);
        asideEl.classList.toggle(collClass, collapsed);
        window.localStorage.setItem('asidenavCollapsed', collapsed);
      }
    }

    function hasClass() {
      return asideEl.classList.contains(collClass);
    }

    asideEl.addEventListener('click', function(event) {
      if (event.target === asideEl) {
        collapsed = !collapsed;
        check();
      }
    });
    asideEl.addEventListener('transitionend', function(event) {
      if (event.propertyName === 'opacity') {
        asideEl.classList.remove(animClass);
      }
    });
    window.addEventListener('resize', function() {
      collapsed = document.body.getBoundingClientRect().width < 999;
      check();
    });
  };
})();

document.addEventListener('DOMContentLoaded', function() {

  utils.aside(document.querySelector('.main__aside'));

});