MediaWiki:Common.js：修订间差异

来自广州交通维基 - Canton Trans Wiki
跳到导航 跳到搜索
无编辑摘要
无编辑摘要
第86行： 第86行：
// 102. 功能：封面画册JS代码
// 102. 功能：封面画册JS代码


/* 外部图片淡入 轮播 - 修复版（MediaWiki 1.39+ 兼容） */
   <script>
/* 使用 jQuery + mw.hook('wikipage.content') 确保内容就绪 */
     //  核心 轮播 逻辑
/* 支持动态内容（Parsoid/预览）、多实例、ES5兼容 */
     const slides = document.querySelectorAll('.carousel-slide');
     const slideContainer = document.querySelector('.carousel-slides');
     const prevBtn = document.querySelector('.prev');
     const nextBtn = document.querySelector('.next');
     const carouselContainer = document.getElementById('carousel-container');
     let currentSlide = 0;
     const slideCount = slides.length;
     const intervalTime = 3000; //  轮播间隔3秒
     let autoPlayInterval;


(function($, mw) {
     //  更新 轮播 显示
   'use strict';
     function updateSlidePosition() {
 
       slideContainer.style.transform = `translateX(-${currentSlide * 100}%)`;
   //  核心函数：初始化单个 轮播
   function initCarousel(carousel) {
     const slides = carousel.querySelectorAll('.slide');
     if (slides.length === 0) return;  // 无slides跳过
 
     const prevBtn = carousel.querySelector('.prev');
     const nextBtn = carousel.querySelector('.next');
     let current = 0;
     let interval;
 
     function showSlide(index) {
       slides.forEach((s, i) => s.classList.toggle('active', i === index));
       current = index;
      }
      }


     // 下一张
      function nextSlide() {
      function nextSlide() {
        showSlide((current + 1) % slides.length);
        currentSlide = (currentSlide + 1) % slideCount;
       updateSlidePosition();
      }
      }


     // 上一张
      function prevSlide() {
      function prevSlide() {
        showSlide((current - 1 + slides.length) % slides.length);
        currentSlide = (currentSlide - 1 + slideCount) % slideCount;
     }
        updateSlidePosition();
 
     function startAuto() {
        interval = setInterval(nextSlide, 5000);
      }
      }


      function stopAuto() {
     // 自动播放
        clearInterval(interval);
      function startAutoPlay() {
        autoPlayInterval = setInterval(nextSlide, intervalTime);
      }
      }


      //  按钮事件（防重复绑定）
      //  暂停自动播放
      function bindButtons() {
      function stopAutoPlay() {
        if (prevBtn) {
        clearInterval(autoPlayInterval);
         prevBtn.onclick = function(e) {
           e.preventDefault();
           stopAuto();
           prevSlide();
           setTimeout(startAuto, 1000); // 1s后重启自动
         };
       }
       if (nextBtn) {
         nextBtn.onclick = function(e) {
           e.preventDefault();
           stopAuto();
           nextSlide();
           setTimeout(startAuto, 1000);
         };
       }
      }
      }


      //  鼠标 事件
      //  绑定按钮 事件
      carousel.onmouseenter = stopAuto;
      prevBtn.addEventListener('click', prevSlide);
     carousel.onmouseleave = startAuto;
      nextBtn.addEventListener('click', nextSlide);
 
     // 键盘支持（可选）
     carousel.onkeydown = function(e) {
       if (e.key === 'ArrowLeft') prevSlide();
       if (e.key === 'ArrowRight') nextSlide();
       if (e.key === ' ') { e.preventDefault(); nextSlide(); }
      };
     carousel.tabIndex = 0;  // 焦点支持
 
     bindButtons();
     showSlide(0);
     startAuto();
   }
 
   // 绑定所有轮播（MutationObserver 捕获动态添加）
   function bindAllCarousels() {
     const selector = '.simple-fade-carousel';
     let carousels = document.querySelectorAll(selector);
     carousels.forEach(initCarousel);
 
     // 监听动态内容（预览/Parsoid/AJAX）
     const observer = new MutationObserver(function(mutations) {
       let added = false;
       mutations.forEach(function(mutation) {
         mutation.addedNodes.forEach(function(node) {
           if (node.nodeType === 1 && (node.matches && node.matches(selector) || node.querySelector(selector))) {
             added = true;
           }
         });
       });
       if (added) {
         // 延迟100ms再绑（图片加载）
         setTimeout(bindAllCarousels, 100);
       }
     });
     observer.observe(document.body, { childList: true, subtree: true });
   }
 
   // MediaWiki Hook：内容就绪后执行（防ResourceLoader延迟）
   mw.hook('wikipage.content').add(bindAllCarousels);
   $(document).ready(bindAllCarousels); // 双重保险（jQuery ready）


   // Fallback：window.load（图片全载后）
     // 鼠标悬停暂停，离开继续
   $(window).on('load', bindAllCarousels);
     carouselContainer.addEventListener('mouseenter', stopAutoPlay);
     carouselContainer.addEventListener('mouseleave', startAutoPlay);


})(window.jQuery, mediaWiki); // MediaWiki jQuery + mw 全局
     // 初始化
     updateSlidePosition();
     startAutoPlay();
   </script>
</div>

2025年12月25日 (四) 22:54的版本

/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */
/*加载ToolsWIKI的DiffTool 以逐字显示更改，0缓存，具体可见https://wiki.biligame.com/tools/%E4%BC%98%E5%8C%96%E7%89%88%E6%9C%AC%E5%B7%AE%E5%BC%82-DiffTools */
try { mw.loader.load("https://wiki.biligame.com/tools/MediaWiki:DiffTool.js?action=raw&ctype=text/javascript&rand="+Math.random(), "text/javascript");} catch(e) { console.log("Error, MediaWiki:DiffTool.js 加载失败");console.error(e, e.stack);}
/* 参见[[模板:ResourceLoader]]*/

//居中与右对齐，文本默认为左对齐，不用另外添加此按钮。（仅适用于源代码编辑模式）
/*居中*/
if ( [ 'edit', 'submit' ].indexOf( mw.config.get( 'wgAction' ) ) !== -1 ) {
    // Add a hook handler.
    mw.hook( 'wikiEditor.toolbarReady' ).add( function ( $textarea ) {
        // Configure a new toolbar entry on the given $textarea jQuery object.
        $textarea.wikiEditor( 'addToToolbar', {
            section: 'advanced',
            group: 'format',
            tools: {
                AlignCenter: {
                    label: '居中',
                    type: 'button',
                    oouiIcon: 'alignCenter',
                    action: {
                        type: 'encapsulate',
                        options: {
                            pre: "<center>",
                            post: "</center>"
                        }
                    }
                }
            }
        } );
    } );
}

/*右对齐*/
if ( [ 'edit', 'submit' ].indexOf( mw.config.get( 'wgAction' ) ) !== -1 ) {
    // Add a hook handler.
    mw.hook( 'wikiEditor.toolbarReady' ).add( function ( $textarea ) {
        // Configure a new toolbar entry on the given $textarea jQuery object.
        $textarea.wikiEditor( 'addToToolbar', {
            section: 'advanced',
            group: 'format',
            tools: {
                AlignCenter: {
                    label: '右对齐',
                    type: 'button',
                    oouiIcon: 'alignRight',
                    action: {
                        type: 'encapsulate',
                        options: {
                            pre: "<div align=right>",
                            post: "</div>"
                        }
                    }
                }
            }
        } );
    } );
}

// 101. 功能：快捷编辑理由。支持编辑摘要时，点击快捷选项填充编辑理由。（仅适用于源代码编辑模式）
//参考Wikipedia:MediaWiki:Common.js/edit.js
if (mw.config.get('wgAction') == "edit" || mw.config.get('wgAction') == "submit" || mw.config.get('wgCanonicalSpecialPageName') == 'Search') { // 编辑页面
  
( function( $, mw ) { $( function() {
    if ( $( '#editform input[name=wpSection]' ).val() === 'new' ) {
        if ( $( '#no-new-title' ).length ) {
            $( '#wpSummary' ).attr( 'disabled', true );
        }
        return;
    }
    $( '#wpSummaryLabel .mw-summary-preset' ).on( 'click', '.mw-summary-preset-item a', function( e ) {
        e.preventDefault();
        var $this = $( this ), summary = $( '#wpSummary' ).val();
        var $item = $this.parent( '.mw-summary-preset-item' );
        summary = summary.replace( /\s+$/g, '' );
        if ( summary != '' ) {
            summary += ' ';
        }
        summary += $item.attr( 'title' ) || $this.text();
        $this.replaceWith( $this.contents() );
        $( '#wpSummary' ).val( summary ).focus();
    } );
} ); } )( jQuery, mediaWiki );

}

// 102. 功能：封面画册JS代码

    <script>
        // 核心轮播逻辑
        const slides = document.querySelectorAll('.carousel-slide');
        const slideContainer = document.querySelector('.carousel-slides');
        const prevBtn = document.querySelector('.prev');
        const nextBtn = document.querySelector('.next');
        const carouselContainer = document.getElementById('carousel-container');
        let currentSlide = 0;
        const slideCount = slides.length;
        const intervalTime = 3000; // 轮播间隔3秒
        let autoPlayInterval;

        // 更新轮播显示
        function updateSlidePosition() {
            slideContainer.style.transform = `translateX(-${currentSlide * 100}%)`;
        }

        // 下一张
        function nextSlide() {
            currentSlide = (currentSlide + 1) % slideCount;
            updateSlidePosition();
        }

        // 上一张
        function prevSlide() {
            currentSlide = (currentSlide - 1 + slideCount) % slideCount;
            updateSlidePosition();
        }

        // 自动播放
        function startAutoPlay() {
            autoPlayInterval = setInterval(nextSlide, intervalTime);
        }

        // 暂停自动播放
        function stopAutoPlay() {
            clearInterval(autoPlayInterval);
        }

        // 绑定按钮事件
        prevBtn.addEventListener('click', prevSlide);
        nextBtn.addEventListener('click', nextSlide);

        // 鼠标悬停暂停，离开继续
        carouselContainer.addEventListener('mouseenter', stopAutoPlay);
        carouselContainer.addEventListener('mouseleave', startAutoPlay);

        // 初始化
        updateSlidePosition();
        startAutoPlay();
    </script>
</div>
取自“https://t.ctwiki.top/index.php?title=MediaWiki:Common.js&oldid=282361”