MediaWiki:Login.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)
Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
Opera: Press Ctrl-F5.

mw.loader.using('mediawiki.util', function () {
  $(function () {
    // Prevent double-injection
    if ($('#drg-navbar').length) return;

    // 1) Grab the built-in Vector logo icon
    const logoSrc = $('.mw-logo-icon').attr('src')
      || '/images/3/3f/Myriad_logo_icon_transparent.png';

    // 2) Build a simple Login button
    const userArea = `<a class="drg-button" href="${mw.util.getUrl('Special:UserLogin')}">Login</a>`;

    // 3) Inject the navbar
    $('body').prepend(`
      <div id="drg-navbar">
        <div class="drg-navbar-container">
          <a href="${mw.util.getUrl('Main_Page')}" class="drg-navbar-logo">
            <img src="${logoSrc}" alt="MYRIAD Logo">
          </a>
          <div class="drg-navbar-actions">
            ${userArea}
          </div>
        </div>
      </div>
    `);

    // 4) Reinsert your custom footer
    function insertFooter() {
      const icons = document.getElementById('footer-icons');
      if (!icons) return setTimeout(insertFooter, 100);
      icons.insertAdjacentHTML('beforebegin', `
        <div id="drg-footer">
          <div class="drg-columns">
            <div class="drg-column drg-column-left">
              <a href="/index.php/Disaster_Risk_Gateway">About</a>
              <a href="/index.php/Disaster_Risk_Gateway:Privacy_Notice">Privacy Notice</a>
              <a href="/index.php/Disaster_Risk_Gateway:Terms_of_Use">Terms of Use</a>
              <a href="mailto:DisasterRiskGateway@bgs.ac.uk"><strong>Contact Us</strong></a>
            </div>
            <div class="drg-divider"></div>
            <div class="drg-column drg-column-center">
              <div class="drg-eu-flag">
                <img src="/images/e/e3/Normal-reproduction-high-resolution_2.jpg" alt="EU logo">
              </div>
              <div class="drg-eu-text">
                MYRIAD-EU project has received funding from the European Union’s Horizon 2020 Research and Innovation Programme under Grant Agreement No. 101003276.
              </div>
            </div>
            <div class="drg-divider"></div>
            <div class="drg-column drg-column-right">
              <a href="https://www.myriadproject.eu" target="_blank" rel="noopener">MYRIAD-EU</a>
              <a href="https://be.linkedin.com/company/myriad-eu-project?trk=public_post_feed-actor-name" target="_blank" rel="noopener">LinkedIn</a>
              <a href="#" target="_blank" rel="noopener">MYRIAD-EU dashboard</a>
            </div>
          </div>
          <div class="drg-disclaimer">
            This site is hosted by the British Geological Survey but responsibility for the content of the site lies with the MYRIAD-EU project, not with the British Geological Survey. Questions, suggestions, or comments regarding the contents of this site should be directed to <a href="mailto:DisasterRiskGateway@bgs.ac.uk">DisasterRiskGateway@bgs.ac.uk</a>.
          </div>
        </div>
      `);
    }
    insertFooter();
  });
});