MediaWiki:Common.js
From Hidden Mickey Wiki
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.
/* Any JavaScript here will be loaded for all users on every page load. */
// JavaScript code to save checkbox state and restore it when the page loads
$(document).ready(function() {
// Function to save the state of checkboxes to localStorage
function saveCheckboxState() {
$('input[type="checkbox"]').each(function() {
localStorage.setItem($(this).attr('id'), $(this).prop('checked'));
});
}
// Function to load the state of checkboxes from localStorage
function loadCheckboxState() {
$('input[type="checkbox"]').each(function() {
const savedState = localStorage.getItem($(this).attr('id'));
if (savedState !== null) {
$(this).prop('checked', savedState === 'true');
}
});
}
// Load the saved checkbox state when the page is loaded
loadCheckboxState();
// Save the checkbox state whenever a checkbox is changed
$('input[type="checkbox"]').change(function() {
saveCheckboxState();
});
});
// Adjust the search box width
$(document).ready(function () {
$('#searchInput').css('width', '600px'); // Adjust width as needed
});
// Right side dropdown
mw.loader.using('mediawiki.util', function () {
// Create the dropdown container
var navbarRight = document.getElementById('mw-navbar-right');
if (!navbarRight) return;
var dropdown = document.createElement('div');
dropdown.className = 'custom-dropdown'; // adjust for your CSS
dropdown.style.position = 'relative';
dropdown.style.display = 'inline-block';
dropdown.style.marginLeft = '10px';
// Dropdown button
var button = document.createElement('button');
button.textContent = 'Settings';
button.className = 'custom-dropdown-button';
button.style.cursor = 'pointer';
dropdown.appendChild(button);
// Dropdown menu
var menu = document.createElement('div');
menu.className = 'custom-dropdown-menu';
menu.style.display = 'none';
menu.style.position = 'absolute';
menu.style.backgroundColor = '#fff';
menu.style.minWidth = '160px';
menu.style.boxShadow = '0px 8px 16px rgba(0,0,0,0.2)';
menu.style.zIndex = 1000;
dropdown.appendChild(menu);
// Populate dropdown items
var pageName = mw.config.get('wgPageName'); // current page
var menuItems = [
{ text: 'Edit Source', href: mw.util.getUrl(pageName, { action: 'edit' }) },
{ text: 'Another Item', href: '/' } // optional extra item
];
menuItems.forEach(function(item) {
var a = document.createElement('a');
a.textContent = item.text;
a.href = item.href;
a.className = 'custom-dropdown-item';
a.style.display = 'block';
a.style.padding = '8px 12px';
a.style.textDecoration = 'none';
a.style.color = '#000';
a.addEventListener('mouseover', function() { a.style.backgroundColor = '#eee'; });
a.addEventListener('mouseout', function() { a.style.backgroundColor = '#fff'; });
menu.appendChild(a);
});
// Toggle menu visibility
button.addEventListener('click', function() {
menu.style.display = menu.style.display === 'none' ? 'block' : 'none';
});
// Close menu if clicked outside
document.addEventListener('click', function(e) {
if (!dropdown.contains(e.target)) {
menu.style.display = 'none';
}
});
// Add dropdown to navbar
navbarRight.appendChild(dropdown);
});
/* "Where To" dropdown
$(function () {
// Prevent duplicate
if ($('#mw-settings-dropdown').length) return;
// Create container
var $container = $('<div id="mw-settings-dropdown"></div>');
var $button = $('<button>Where To? ▾</button>');
var $list = $('<ul></ul>');
// Define menu items
var menuItems = [
// Example: existing items
{ title: 'Home', href: 'Disneyland' }
];
menuItems.push({
title: 'Edit Source',
href: mw.util.getUrl(mw.config.get('wgPageName'), { action: 'edit' })
});
// Populate dropdown
menuItems.forEach(function(item) {
var $li = $('<li></li>');
var $a = $('<a></a>').attr('href', mw.util.getUrl(item.page)).text(item.title);
$li.append($a);
$list.append($li);
});
$container.append($button).append($list);
// Insert into navbar-right if exists
var $navbar = $('#mw-navbar-right');
if ($navbar.length) {
// Prepend = place at far left of navbar-right
$navbar.prepend($container);
} else {
// fallback: absolute top-right
$container.css({ position: 'absolute', top: '10px', right: '10px' });
$('body').append($container);
}
// Toggle dropdown
$button.on('click', function(e) {
$list.toggle();
e.stopPropagation();
});
// Close dropdown when clicking outside
$(document).on('click', function() {
$list.hide();
});
$container.on('click', function(e) {
e.stopPropagation();
});
}); */
/* Add Edit Source to user dropdown
mw.loader.using('mediawiki.util', function () {
// Add a new entry into the user dropdown
mw.util.addPortletLink(
'p-personal', // user menu ID
mw.util.getUrl( mw.config.get('wgPageName'), { action: 'edit' } ),
'Edit Source',
'pt-editsource'
);
}); */
/* Drop down on the left
$(function() {
// Find the site title container
var $siteTitle = $('#p-logo');
if ($siteTitle.length) {
// Wrap the site title and dropdown in a flex container
var $wrapper = $('<div>', { class: 'custom-title-wrapper' }).css({
display: 'inline-flex',
alignItems: 'center',
gap: '10px' // spacing between title and menu
});
// Move the site title inside the wrapper
$siteTitle.before($wrapper);
$wrapper.append($siteTitle);
// Create dropdown container
var $leftDropdown = $('<div>', { class: 'custom-left-dropdown' }).css({
position: 'relative'
});
// Create the button
var $leftButton = $('<button>', {
text: 'Menu ▼',
class: 'custom-left-dropdown-btn'
}).css({
background: '#fff',
border: '1px solid #ccc',
padding: '3px 6px',
cursor: 'pointer'
});
// Create the dropdown items
var $leftMenu = $('<ul>', { class: 'custom-left-dropdown-menu' }).css({
display: 'none',
position: 'absolute',
top: '100%',
left: 0,
background: '#fff',
border: '1px solid #ccc',
padding: 0,
margin: 0,
listStyle: 'none',
zIndex: 1000,
minWidth: '120px'
});
// Add items
var leftItems = [
{ text: 'Home', href: '/' },
{ text: 'Recent changes', href: '/wiki/Special:RecentChanges' },
{ text: 'Random page', href: '/wiki/Special:Random' }
];
leftItems.forEach(function(item) {
var $li = $('<li>').css({ padding: '5px 10px' });
var $a = $('<a>', { text: item.text, href: item.href }).css({ textDecoration: 'none', color: '#000' });
$li.append($a);
$leftMenu.append($li);
});
// Toggle menu on click
$leftButton.on('click', function() {
$leftMenu.toggle();
});
// Close if clicked outside
$(document).on('click', function(e) {
if (!$(e.target).closest($leftDropdown).length) {
$leftMenu.hide();
}
});
// Assemble dropdown and add to wrapper
$leftDropdown.append($leftButton).append($leftMenu);
$wrapper.append($leftDropdown);
}
}); */
