
console.clear();

class pageTransition {
  constructor(el, transitionEl) {
    this.el = el;
    this.transitionEl = transitionEl;
    this.init();
  }

  init() {
    this.el.addEventListener('click', this.handleTransition.bind(this));
  }

  handleTransition(e) {
    e.preventDefault();
    const target = e.currentTarget.href;
    this.transitionEl.classList.add('page-transition-element_in');
    //Let the animation kick in and change page
    //setTimeout(() => window.location.href = target,1000);
    //Fake new page load
    setTimeout(() => this.transitionEl.classList.remove('page-transition-element_in'), 1500);
  }}


const anchors = document.querySelectorAll('a');
const transitionEl = document.querySelector('.page-transition-element');
anchors.forEach(el => new pageTransition(el, transitionEl));

window.addEventListener('load', () => transitionEl.classList.add('page-transition-element_out'));
//# sourceURL=pen.js
    