(function() {;
  'use strict';

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

  window.utils.tooltip = function(tt) {
    var handle = tt.querySelector('.tooltip__handle');
    var content = tt.querySelector('.tooltip__content');

    var left = false;

    // initially set content to hidden
    content.classList.add('hidden');

    handle.addEventListener('mouseenter', function() {
      left = false;
      content.classList.toggle('to-left', handle.getBoundingClientRect().left + 300 > window.innerWidth);
      content.classList.remove('hidden');
    });

    handle.addEventListener('mouseleave', function() {
      left = true;
      window.setTimeout(function() {
        if (left) {
          content.classList.add('hidden');
        }
      }, 250);
    });
  };

  window.utils.tooltipFromAttribute = function(el) {
    var tt = document.createElement('div');
    var handle = document.createElement('div');
    var content = document.createElement('div');

    tt.classList.add('js-tooltip');
    handle.classList.add('tooltip__handle');
    content.classList.add('tooltip__content', 'hidden');

    handle.innerText = '?';
    content.innerHTML = el.getAttribute('data-tooltip');

    tt.appendChild(handle);
    tt.appendChild(content);

    if (el.nextSiblingElement) {
      el.parentElement.insertBefore(tt, el.nextSiblingElement);
    } else {
      el.parentElement.appendChild(tt);
    }
  };

})();

document.addEventListener('setup', function(e) {
  // JS-TOOLTIPS NOT USED CURRENTLY.

  // initialize tooltips set via `data-tooltip`
  // Array.from(e.detail.scope.querySelectorAll('[data-tooltip]')).forEach(function(el) {
  //   window.utils.tooltipFromAttribute(el)
  // });

  // initialize tooltips
  // Array.from(e.detail.scope.querySelectorAll('.js-tooltip')).forEach(function(tt) {
  //   window.utils.tooltip(tt);
  // });
});
