MediaWiki:Common.js: Difference between revisions

/* Any JavaScript here will be loaded for all users on every page load. */
/* Google Translate widget for Chameleon skin (selected languages only) */

(function () {
  var LANGS = 'ko,ja,es,de,zh-CN,zh-TW,fr,ar,hi,pt,ru'; // note: no 'en' (it's pageLanguage)
  var CONTAINER_ID = 'google_translate_element';

  // Ensure container exists before init
  function ensureContainer() {
    if (!document.getElementById(CONTAINER_ID)) {
      var host = document.querySelector('.navbar-collapse') || document.body;
      var el = document.createElement('div');
      el.id = CONTAINER_ID;
      el.style.marginLeft = '15px';
      host.appendChild(el);
    }
  }

  // NEW callback name to bust any stale init
  window.koreapediaGTEInit = function () {
    ensureContainer();
    new google.translate.TranslateElement({
      pageLanguage: 'en',
      includedLanguages: LANGS,
      layout: google.translate.TranslateElement.InlineLayout.SIMPLE
    }, CONTAINER_ID);
  };

  // Load script only if needed; otherwise call init directly
  function loadOrInit() {
    // If library is already there, just init with our options
    if (window.google && google.translate && google.translate.TranslateElement) {
      window.koreapediaGTEInit();
      return;
    }
    // Avoid adding duplicate script tags
    if (!document.querySelector('script[src*="translate_a/element.js"]')) {
      var s = document.createElement('script');
      s.src = '//translate.google.com/translate_a/element.js?cb=koreapediaGTEInit';
      document.head.appendChild(s);
    }
  }

  mw.loader.using('mediawiki.util', function () {
    $(function () {
      ensureContainer();
      loadOrInit();
    });
  });
})();

(function () {
  function cropGTE() {
    var f = document.getElementById('goog-te-menu-frame');
    if (!f) return;
    f.style.setProperty('width', '500px', 'important');
    f.style.setProperty('maxWidth', '500px', 'important');
    f.style.setProperty('borderRadius', '8px', 'important');
    f.style.setProperty('clip-path', 'inset(0 140px 0 0)', 'important');
    f.style.setProperty('-webkit-clip-path', 'inset(0 140px 0 0)', 'important');
  }

  document.addEventListener('click', function (e) {
    if (e.target.closest('#google_translate_element')) {
      setTimeout(cropGTE, 120);
      setTimeout(cropGTE, 400);
    }
  });

  window.addEventListener('resize', function () {
    setTimeout(cropGTE, 150);
  });
})();