MediaWiki:Common.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* Staging TechWiki navigation and native search. */
(function () {
  'use strict';
  if (location.hostname !== 'wikiug.seloc.org' || mw.config.get('wgAction') !== 'view') return;
  $(function () {
    const content = document.querySelector('#content');
    if (!content || document.querySelector('.seloc-wiki-shell')) return;
    const home = '/a/SELOC_TechWiki';
    const shell = document.createElement('div');
    shell.className = 'seloc-wiki-shell';
    const brand = document.createElement('a');
    brand.className = 'seloc-wiki-brand';
    brand.href = home;
    const logo = document.querySelector('#p-logo a');
    if (logo) {
      const artwork = getComputedStyle(logo).backgroundImage;
      if (artwork && artwork !== 'none') {
        const mark = document.createElement('span');
        mark.className = 'seloc-wiki-mark';
        mark.style.backgroundImage = artwork;
        mark.setAttribute('aria-hidden', 'true');
        brand.append(mark);
      }
    }
    brand.append(document.createTextNode('LOTUS Enthusiasts Club'));
    const nav = document.createElement('nav');
    nav.className = 'seloc-wiki-primary';
    nav.setAttribute('aria-label', 'SELOC staging sites');
    for (const [name, href] of [
      ['Club Home', 'https://f.seloc.club/w691/'],
      ['Forums', 'https://forumsug.seloc.org/'],
      ['TechWiki', home],
      ['Gallery', 'https://forumsug.seloc.org/cp_gallery.php'],
      ['Classifieds', 'https://classifiedsug.seloc.org/'],
      ['Advertisers', 'https://f.seloc.club/w691/index.php/advertisers/'],
      ['Membership', 'https://f.seloc.club/w691/index.php/membership/']
    ]) {
      const link = document.createElement('a');
      link.href = href;
      link.textContent = name;
      if (name === 'TechWiki') link.setAttribute('aria-current', 'true');
      nav.append(link);
    }
    const form = document.createElement('form');
    form.action = mw.config.get('wgScript');
    form.method = 'get';
    form.setAttribute('role', 'search');
    form.setAttribute('aria-label', 'TechWiki articles');
    for (const [name, value] of [['title', 'Special:Search'], ['fulltext', '1']]) {
      const field = document.createElement('input');
      field.type = 'hidden'; field.name = name; field.value = value;
      form.append(field);
    }
    const query = document.createElement('input');
    query.type = 'search'; query.name = 'search'; query.required = true;
    query.placeholder = 'Search models, parts or jobs';
    query.setAttribute('aria-label', 'Search TechWiki articles');
    const submit = document.createElement('button');
    submit.type = 'submit'; submit.textContent = 'Search';
    const index = document.createElement('a');
    index.href = '/a/Special:AllPages'; index.textContent = 'A–Z articles';
    form.append(query, submit, index);
    const techForum = document.querySelector('#n-SELOC-Tech-Forum a');
    if (techForum) techForum.href = 'https://forumsug.seloc.org/forumdisplay.php?fid=35';
    const browse = document.createElement('nav');
    browse.className = 'seloc-wiki-secondary';
    browse.setAttribute('aria-label', 'Browse TechWiki');
    for (const [name, href] of [
      ['Models', home + '#Lotus_Cars'],
      ['Technical subjects', home + '#Technical_Pages'],
      ['Resources', home + '#Non_Technical_Pages'],
      ['A–Z articles', '/a/Special:AllPages']
    ]) {
      const link = document.createElement('a');
      link.href = href;
      link.textContent = name;
      browse.append(link);
    }
    const sidebar = document.querySelector('#p-navigation ul');
    if (sidebar) {
      for (const link of sidebar.querySelectorAll('li:not(#n-mainpage) > a')) {
        browse.append(link.cloneNode(true));
      }
    }
    const toolbox = document.querySelector('#p-tb ul');
    if (toolbox && toolbox.children.length) {
      const tools = document.createElement('details');
      tools.className = 'seloc-wiki-tools';
      const label = document.createElement('summary');
      label.textContent = 'Wiki tools';
      tools.append(label, toolbox.cloneNode(true));
      browse.append(tools);
    }
    if (sidebar) document.body.classList.add('seloc-wiki-compact-nav');
    index.remove();
    shell.append(brand, nav, browse);
    if (mw.config.get('wgCanonicalSpecialPageName') !== 'Search') shell.append(form);
    const responsiveNavigation = document.createElement('style');
    responsiveNavigation.textContent = "\n/* Keep the shared pills inside the reading column on phones and tablets. */\n@media screen and (max-width: 1024px) {\n  .seloc-wiki-compact-nav #content { margin-left: 0; min-width: 0; }\n  .seloc-wiki-shell { box-sizing: border-box; max-width: 100%; }\n  .seloc-wiki-shell nav.seloc-wiki-primary,\n  .seloc-wiki-shell nav.seloc-wiki-secondary {\n    display: flex;\n    flex-wrap: wrap;\n    box-sizing: border-box;\n    min-width: 0;\n  }\n  .seloc-wiki-shell nav > a { max-width: 100%; box-sizing: border-box; white-space: normal; overflow-wrap: anywhere; }\n}\n";
    responsiveNavigation.textContent += "\n/* Shared staging resource pills */\n.seloc-wiki-shell .seloc-wiki-primary{display:flex!important;flex-wrap:wrap!important;gap:6px 8px!important;}\n.seloc-wiki-shell .seloc-wiki-primary > a{box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;width:auto!important;height:auto!important;min-height:36px!important;padding:6px 14px!important;font:700 14px/1.35 Verdana,Arial,sans-serif!important;white-space:nowrap!important;letter-spacing:normal!important;}\n@media(max-width:600px){.seloc-wiki-shell .seloc-wiki-primary > a{min-height:38px!important;padding-inline:11px!important;font-size:13px!important;}}\n";
    shell.prepend(responsiveNavigation);
    content.prepend(shell);
    content.classList.add('seloc-wiki-enhanced');
    document.body.classList.add('seloc-wiki-themed');
    if (mw.config.get('wgNamespaceNumber') === 0 && !mw.config.get('wgIsMainPage')) {
      content.classList.add('seloc-wiki-article');
    }
  });
}());