MediaWiki:Gadget-CustomButtons.js
Jump to navigation
Jump to search
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.
$(document).ready(function() {
/* Quote Template Buttons */
$('.quote-buttons').each(function() {
var $quoteBox = $(this).closest('.quoteBox');
$(this).find('#showAllButton').click(function() {
$quoteBox.find('.nihongo-english').css('display', 'inline');
$quoteBox.find('.nihongo-japanese').css('display', 'inline');
$quoteBox.find('.nihongo-bracket').css('display', 'inline');
$quoteBox.find('.nihongo-romaji').remove(); // Remove any appended romaji spans
});
$(this).find('#showEnglishButton').click(function() {
$quoteBox.find('.nihongo-english').css('display', 'inline');
$quoteBox.find('.nihongo-japanese').css('display', 'none');
$quoteBox.find('.nihongo-romaji').css('display', 'none');
$quoteBox.find('.nihongo-bracket').css('display', 'none');
});
$(this).find('#showJapaneseButton').click(function() {
$quoteBox.find('.nihongo-english').css('display', 'none');
$quoteBox.find('.nihongo-japanese').css('display', 'inline');
$quoteBox.find('.nihongo-romaji').css('display', 'none');
$quoteBox.find('.nihongo-bracket').css('display', 'none');
});
$(this).find('#showRomajiButton').click(function() {
$quoteBox.find('.nihongo-english').css('display', 'none');
$quoteBox.find('.nihongo-bracket').css('display', 'none');
$quoteBox.find('.nihongo-japanese').each(function() {
var $japaneseElement = $(this);
var romaji = $japaneseElement.data('content');
if (romaji) {
if ($japaneseElement.next('.nihongo-romaji').length === 0) {
$japaneseElement.after('<span class="nihongo-romaji" style="display:inline; font-family:Meiryo">' + romaji + '</span>');
} else {
$japaneseElement.next('.nihongo-romaji').css('display', 'inline');
}
$japaneseElement.css('display', 'none');
} else {
$japaneseElement.closest('.popup-wrapper').find('.nihongo-english').css('display', 'inline');
$japaneseElement.css('display', 'none');
}
});
$quoteBox.find('.popup-box').css('display', 'none');
});
});
/* VolDiffs Template Buttons */
// Function to toggle images within a specific container
function toggleImages(container, showImage1) {
if (showImage1) {
container.find('.volDiffImage1').css('display', 'block');
container.find('.volDiffImage2').css('display', 'none');
} else {
container.find('.volDiffImage1').css('display', 'none');
container.find('.volDiffImage2').css('display', 'block');
}
}
// Function to toggle the part class for buttons
function toggleButtonPartClass(container, tab1Selected) {
var part = container.find('.volDiffButtons').data('part');
if (tab1Selected) {
container.find('.volDiffTab1').addClass(part);
container.find('.volDiffTab2').removeClass(part);
} else {
container.find('.volDiffTab1').removeClass(part);
container.find('.volDiffTab2').addClass(part);
}
}
// Event listener for individual tab buttons
$(document).on('click', '.volDiffTab1', function() {
var container = $(this).closest('.volDiffBox');
toggleImages(container, true);
toggleButtonPartClass(container, true);
});
$(document).on('click', '.volDiffTab2', function() {
var container = $(this).closest('.volDiffBox');
toggleImages(container, false);
toggleButtonPartClass(container, false);
});
// Event listener for global buttons
$('.volDiffBtn1').click(function() {
$('.volDiffBox').each(function() {
toggleImages($(this), true);
toggleButtonPartClass($(this), true);
});
});
$('.volDiffBtn2').click(function() {
$('.volDiffBox').each(function() {
toggleImages($(this), false);
toggleButtonPartClass($(this), false);
});
});
// Function to toggle expand/collapse (default behavior)
function toggleExpandCollapseDefault() {
var $containerBody = $(this).closest('.volDiffContainer').find('.volDiffContainerBody');
var isExpanded = $containerBody.css('max-height') === 'none';
if (isExpanded) {
$containerBody.css('max-height', '385px');
$(this).text('Expand');
} else {
$containerBody.css('max-height', 'none');
$(this).text('Collapse');
}
}
// Function to toggle expand/collapse (special case for List_of_Volume_Differences)
function toggleExpandCollapseVolumeDifferences() {
var $containerContent = $(this).closest('.volDiffContainer').find('.volDiffContainerContent');
var isExpanded = $containerContent.css('display') === 'none';
if (isExpanded) {
$containerContent.css('display', '');
$(this).text('Collapse');
} else {
$containerContent.css('display', 'none');
$(this).text('Expand');
}
}
// Function to check if the content is overflowing
function checkOverflow() {
$('.volDiffContainer').each(function() {
var $containerBody = $(this).find('.volDiffContainerBody');
var $expandBtn = $(this).find('.volDiffExpandBtn');
// Check if content is overflowing or if the page is "List_of_Volume_Differences"
if ($containerBody[0].scrollHeight > $containerBody[0].clientHeight || mw.config.get('wgPageName') === 'List_of_Volume_Differences') {
$expandBtn.show();
} else {
$expandBtn.hide();
}
});
}
// Function to initialize expand/collapse state for "List_of_Volume_Differences" page
function initializeForVolumeDifferencesPage() {
$('.volDiffContainer').each(function() {
var $containerContent = $(this).find('.volDiffContainerContent');
var $expandBtn = $(this).find('.volDiffExpandBtn');
// Set display to none (collapsed) and show the expand button
$containerContent.css('display', 'none');
$expandBtn.text('Expand').show();
});
}
// Attach click event to the expand/collapse button
if (mw.config.get('wgPageName') === 'List_of_Volume_Differences') {
$('.volDiffExpandBtn').click(toggleExpandCollapseVolumeDifferences);
initializeForVolumeDifferencesPage();
} else {
$('.volDiffExpandBtn').click(toggleExpandCollapseDefault);
}
// Always check for overflow and attach events
checkOverflow();
$(window).resize(function() {
checkOverflow();
});
});