|
|
| (36 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| (function() { | | $(function() { |
| function resizeSlideshowContainer(mwSlideshow) {
| | fetch('/api.php?action=query&meta=siteinfo&siprop=statistics&format=json') |
| const slideshow = mwSlideshow.querySelector('.slideshow');
| | .then(res => res.json()) |
| if (slideshow) {
| | .then(data => { |
| // Get the current computed height of the slideshow (based on content)
| | const current = data.query.statistics.articles; |
| const computedHeight = slideshow.scrollHeight;
| | const goal = 500; |
| | | const left = goal - current; |
| // Apply that height directly to the parent container
| | const el = document.getElementById("article-countdown"); |
| mwSlideshow.style.height = computedHeight + 'px';
| | if (el) { |
| | | el.innerHTML = left > 0 |
| // Optional: If you want to also resize the parent on window resize
| | ? `🚧 Only <strong>${left}</strong> articles to go until 500!` |
| window.addEventListener('resize', () => {
| | : `🎯 We've reached 500 articles! Celebrate good times, c'mon!`; |
| mwSlideshow.style.height = slideshow.scrollHeight + 'px';
| | } |
| });
| | }); |
| }
| | }); |
| }
| | // MediaWiki:Common.js |
| | | mw.hook('rcfilters.ui.initialized').add(function () { |
| function cleanAndResizeSlideshows() { | | document.documentElement.classList.add('rcfilters-ready'); |
| document.querySelectorAll('.mw-jsslideshow').forEach(mwSlideshow => {
| | }); |
| const slideshow = mwSlideshow.querySelector('.slideshow');
| |
| | |
| if (slideshow) {
| |
| // Remove inline styles from slideshow and slides
| |
| slideshow.style.width = '';
| |
| slideshow.style.height = '';
| |
| slideshow.querySelectorAll('div').forEach(slide => {
| |
| slide.style.width = '';
| |
| slide.style.height = '';
| |
| });
| |
| | |
| // Immediately resize the parent to match slideshow height
| |
| resizeSlideshowContainer(mwSlideshow);
| |
| | |
| // Observe changes to keep it dynamic (slides changing, etc.)
| |
| const observer = new MutationObserver(() => {
| |
| resizeSlideshowContainer(mwSlideshow);
| |
| });
| |
| | |
| observer.observe(slideshow, {
| |
| attributes: true,
| |
| attributeFilter: ['style'],
| |
| childList: true,
| |
| subtree: true
| |
| });
| |
| }
| |
| });
| |
| }
| |
| | |
| // Init once DOM is ready
| |
| if (document.readyState === 'complete' || document.readyState === 'interactive') {
| |
| cleanAndResizeSlideshows();
| |
| } else {
| |
| document.addEventListener('DOMContentLoaded', cleanAndResizeSlideshows);
| |
| }
| |
| function cleanSlideshowStyles(slideshowContainer) {
| |
| const slideshow = slideshowContainer.querySelector('.slideshow');
| |
| if (slideshow) {
| |
| // Remove inline styles on the main slideshow container
| |
| slideshow.style.width = '';
| |
| slideshow.style.height = '';
| |
| | |
| // Remove inline styles on each slide div
| |
| slideshow.querySelectorAll('div').forEach(slide => {
| |
| slide.style.width = '';
| |
| slide.style.height = '';
| |
| });
| |
| }
| |
| }
| |
| | |
| function initSlideshowFix() {
| |
| // Locate all mw-jsslideshow instances | |
| document.querySelectorAll('.mw-jsslideshow').forEach(mwSlideshow => {
| |
| // Clean styles on page load
| |
| cleanSlideshowStyles(mwSlideshow);
| |
| | |
| // Optional: Re-clean styles on window resize
| |
| window.addEventListener('resize', () => {
| |
| cleanSlideshowStyles(mwSlideshow);
| |
| });
| |
| | |
| // Hook into slide transitions if needed (depends on the specific JS driving the slideshow)
| |
| const slideshow = mwSlideshow.querySelector('.slideshow');
| |
| if (slideshow) {
| |
| const observer = new MutationObserver(() => {
| |
| cleanSlideshowStyles(mwSlideshow);
| |
| });
| |
| | |
| observer.observe(slideshow, {
| |
| attributes: true,
| |
| attributeFilter: ['style'],
| |
| childList: false,
| |
| subtree: false
| |
| });
| |
| }
| |
| });
| |
| }
| |
| | |
| // Run once DOM is ready (in case the slideshows are injected late)
| |
| if (document.readyState === 'complete' || document.readyState === 'interactive') {
| |
| initSlideshowFix();
| |
| } else { | |
| document.addEventListener('DOMContentLoaded', initSlideshowFix);
| |
| }
| |
| })(); | |
| /* Any JavaScript here will be loaded for all users on every page load. */ | |
| (function() {
| |
| function cleanSlideshowStyles(slideshowContainer) {
| |
| const slideshow = slideshowContainer.querySelector('.slideshow');
| |
| if (slideshow) {
| |
| // Remove inline styles on the main slideshow container
| |
| slideshow.style.width = '';
| |
| slideshow.style.height = '';
| |
| | |
| // Remove inline styles on each slide div
| |
| slideshow.querySelectorAll('div').forEach(slide => {
| |
| slide.style.width = '';
| |
| slide.style.height = '';
| |
| });
| |
| }
| |
| }
| |
| | |
| function initSlideshowFix() {
| |
| // Locate all mw-jsslideshow instances
| |
| document.querySelectorAll('.mw-jsslideshow').forEach(mwSlideshow => {
| |
| // Clean styles on page load
| |
| cleanSlideshowStyles(mwSlideshow);
| |
| | |
| // Optional: Re-clean styles on window resize
| |
| window.addEventListener('resize', () => {
| |
| cleanSlideshowStyles(mwSlideshow);
| |
| });
| |
| | |
| // Hook into slide transitions if needed (depends on the specific JS driving the slideshow)
| |
| const slideshow = mwSlideshow.querySelector('.slideshow');
| |
| if (slideshow) {
| |
| const observer = new MutationObserver(() => {
| |
| cleanSlideshowStyles(mwSlideshow);
| |
| });
| |
| | |
| observer.observe(slideshow, {
| |
| attributes: true,
| |
| attributeFilter: ['style'],
| |
| childList: false,
| |
| subtree: false
| |
| });
| |
| }
| |
| });
| |
| }
| |
| | |
| // Run once DOM is ready (in case the slideshows are injected late)
| |
| if (document.readyState === 'complete' || document.readyState === 'interactive') {
| |
| initSlideshowFix();
| |
| } else {
| |
| document.addEventListener('DOMContentLoaded', initSlideshowFix);
| |
| }
| |
| })();
| |
$(function() {
fetch('/api.php?action=query&meta=siteinfo&siprop=statistics&format=json')
.then(res => res.json())
.then(data => {
const current = data.query.statistics.articles;
const goal = 500;
const left = goal - current;
const el = document.getElementById("article-countdown");
if (el) {
el.innerHTML = left > 0
? `🚧 Only <strong>${left}</strong> articles to go until 500!`
: `🎯 We've reached 500 articles! Celebrate good times, c'mon!`;
}
});
});
// MediaWiki:Common.js
mw.hook('rcfilters.ui.initialized').add(function () {
document.documentElement.classList.add('rcfilters-ready');
});
