import Component from '@ember/component';
import $ from 'jquery';
export function initialize(/* appInstance */) {
  $(function() {
    $.fn.tooltip.Constructor.DEFAULTS.template = 
      '<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><pre class="tooltip-inner"></pre></div>';
  });

  Component.reopen({
    didInsertElement() {
      let me = this;
      me._super(...arguments);
      me.initTooltip();
    },
    didUpdate() {
      const me = this;
      me._super(...arguments);
      me.initTooltip();
    },
    initTooltip() {
      const me = this;
      if (!('ontouchstart' in document.documentElement)) {
          if ('tooltip' === me.get('data-rel') 
              && me.get('title')) {
              $(me.element).tooltip();
          }
          // may cause error
          try {
            $('[data-rel=tooltip]', me.element).tooltip();
          }
          catch(e) {
            console.warn('Init tooltip error caused', e);
          }
      }
    }
  });
}

export default {
  name: 'tooltip',
  initialize
};