Actions

MediaWiki

MediaWiki:Common.js

From Dune Awakening DB

Revision as of 00:50, 7 April 2025 by Operator (talk | contribs) (Created page with "Any JavaScript here will be loaded for all users on every page load.: // Add this to your MediaWiki:Common.js file $(document).ready(function() { // Remove the "From Dune Awakening DB" tagline $('#tagline').remove(); // Reduce spacing above the title $('.mw-page-title-main').parent().css('margin-top', '0'); $('.mw-page-title-main').parent().css('padding-top', '5px'); // Add breadcrumb navigation var pageTitle = $('.mw-page-title-main').text();...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

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.
/* Any JavaScript here will be loaded for all users on every page load. */
// Add this to your MediaWiki:Common.js file
$(document).ready(function() {
  // Remove the "From Dune Awakening DB" tagline
  $('#tagline').remove();
  
  // Reduce spacing above the title
  $('.mw-page-title-main').parent().css('margin-top', '0');
  $('.mw-page-title-main').parent().css('padding-top', '5px');
  
  // Add breadcrumb navigation
  var pageTitle = $('.mw-page-title-main').text();
  
  // Generate breadcrumb HTML
  var breadcrumbHTML = `
    <div class="dune-breadcrumb-nav">
      <div class="dune-logo-container">
        <img src="https://dunedb.com/favicon.ico" alt="DuneDB Logo" class="dune-logo">
        <div class="dune-radial-menu">
          <a href="/wiki/Buildings" class="dune-radial-item">
            <i class="fa fa-building"></i>
            <span class="dune-radial-tooltip">Buildings</span>
          </a>
          <a href="/wiki/Items" class="dune-radial-item">
            <i class="fa fa-cube"></i>
            <span class="dune-radial-tooltip">Items</span>
          </a>
          <a href="/wiki/Crafting" class="dune-radial-item">
            <i class="fa fa-hammer"></i>
            <span class="dune-radial-tooltip">Crafting</span>
          </a>
          <a href="/wiki/Research" class="dune-radial-item">
            <i class="fa fa-flask"></i>
            <span class="dune-radial-tooltip">Research</span>
          </a>
          <a href="/wiki/Journeys" class="dune-radial-item">
            <i class="fa fa-map-marked-alt"></i>
            <span class="dune-radial-tooltip">Journeys</span>
          </a>
          <a href="/wiki/Vehicles" class="dune-radial-item">
            <i class="fa fa-truck-monster"></i>
            <span class="dune-radial-tooltip">Vehicles</span>
          </a>
          <a href="/wiki/Resources" class="dune-radial-item">
            <i class="fa fa-box"></i>
            <span class="dune-radial-tooltip">Resources</span>
          </a>
          <a href="/wiki/Main_Page" class="dune-radial-item">
            <i class="fa fa-home"></i>
            <span class="dune-radial-tooltip">Home</span>
          </a>
        </div>
      </div>
      <a href="/Main_Page">Home</a>
      <span class="dune-breadcrumb-separator">/</span>
      <a href="/Buildings">Buildings</a>
      <span class="dune-breadcrumb-separator">/</span>
      <a href="/Buildings/Refiners">Refiners</a>
      <span class="dune-breadcrumb-separator">/</span>
      <span>${pageTitle}</span>
    </div>
    <div class="dune-radial-overlay"></div>
  `;
  
  // Insert breadcrumb after page title
  $('.mw-page-title-main').parent().after(breadcrumbHTML);
  
  // Toggle radial menu on logo click
  $('.dune-logo').on('click', function(e) {
    e.preventDefault();
    $(this).parent('.dune-logo-container').toggleClass('active');
  });

  // Close the radial menu when clicking the overlay
  $('.dune-radial-overlay').on('click', function() {
    $('.dune-logo-container').removeClass('active');
  });
  
  // Add Font Awesome if not already present
  if ($('link[href*="font-awesome"]').length === 0) {
    $('head').append('<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">');
  }
});