MediaWiki:Common.js：修订间差异

2025年5月3日 (六) 22:28的版本

/* 轮播图功能 */
mw.hook('wikipage.content').add(function($content) {
  // 查找页面中所有轮播图
  $content.find('.mw-carousel').each(function() {
    const $carousel = $(this);
    const $items = $carousel.find('.carousel-item');
    const $indicators = $carousel.find('.carousel-indicators');
    const $prevBtn = $carousel.find('.carousel-prev');
    const $nextBtn = $carousel.find('.carousel-next');
    
    let currentIndex = 0;
    const slideCount = $items.length;
    
    if (slideCount === 0) return;
    
    // 创建指示器
    for (let i = 0; i < slideCount; i++) {
      const $indicator = $('<div class="indicator"></div>');
      if (i === 0) $indicator.addClass('active');
      
      $indicator.on('click', function() {
        goToSlide(i);
      });
      
      $indicators.append($indicator);
    }
    
    // 初始化第一张幻灯片
    $items.eq(0).addClass('active');
    
    // 给每个幻灯片添加点击事件
    $items.each(function() {
      const $item = $(this);
      const link = $item.data('link');
      
      if (link && link.length > 0) {
        $item.css('cursor', 'pointer').on('click', function() {
          window.location.href = link;
        });
      }
    });
    
    // 切换到指定幻灯片
    function goToSlide(index) {
      $items.removeClass('active');
      $indicators.find('.indicator').removeClass('active');
      
      $items.eq(index).addClass('active');
      $indicators.find('.indicator').eq(index).addClass('active');
      
      currentIndex = index;
    }
    
    // 上一张
    function prevSlide() {
      const newIndex = (currentIndex - 1 + slideCount) % slideCount;
      goToSlide(newIndex);
    }
    
    // 下一张
    function nextSlide() {
      const newIndex = (currentIndex + 1) % slideCount;
      goToSlide(newIndex);
    }
    
    // 绑定按钮事件
    $prevBtn.on('click', function(e) {
      e.preventDefault();
      e.stopPropagation();
      prevSlide();
    });
    
    $nextBtn.on('click', function(e) {
      e.preventDefault();
      e.stopPropagation();
      nextSlide();
    });
    
    // 自动播放
    let autoplayInterval = setInterval(nextSlide, 5000);
    
    $carousel.on('mouseenter', function() {
      clearInterval(autoplayInterval);
    }).on('mouseleave', function() {
      autoplayInterval = setInterval(nextSlide, 5000);
    });
    
    // 触摸滑动支持
    let touchStartX = 0;
    let touchEndX = 0;
    
    $carousel.on('touchstart', function(e) {
      touchStartX = e.originalEvent.touches[0].clientX;
    });
    
    $carousel.on('touchend', function(e) {
      touchEndX = e.originalEvent.changedTouches[0].clientX;
      
      // 判断滑动方向
      if (touchEndX < touchStartX - 50) {
        nextSlide(); // 左滑，下一张
      } else if (touchEndX > touchStartX + 50) {
        prevSlide(); // 右滑，上一张
      }
    });
  });
});
// Collapsible blocks functionality
$(document).ready(function() {
  // Initialize collapsible blocks
  $('.collapsible-header').click(function() {
    $(this).next('.collapsible-content').slideToggle();
    $(this).toggleClass('active');
  });
  
  // Initially hide collapsible content
  $('.collapsible-content').hide();
  
  // Carousel functionality
  // This would need to be expanded based on your complex SCSS carousel
  // For now, a simple interval-based switch
  $('.carousel-container').each(function() {
    const $carousel = $(this);
    const $slides = $carousel.find('.rolling a');
    const slideCount = $slides.length;
    let currentSlide = 0;
    
    // Hide all slides except the first one
    $slides.css('left', '100%').eq(0).css('left', '0');
    
    // Only set up carousel if there are multiple slides
    if (slideCount > 1) {
      setInterval(function() {
        let nextSlide = (currentSlide + 1) % slideCount;
        
        // Move current slide out
        $slides.eq(currentSlide).animate({left: '-100%'}, 500);
        
        // Move next slide in
        $slides.eq(nextSlide).css('left', '100%').animate({left: '0'}, 500);
        
        currentSlide = nextSlide;
      }, 5000); // Change slide every 5 seconds
    }
  });
});
/* Common.js - Database New主题JavaScript增强 */

$(function() {
    // 创建CRT效果容器
    function createCRTEffects() {
        if ($('.crt-effects').length === 0) {
            var crtContainer = $('<div>', {
                'class': 'crt-effects',
                html: [
                    $('<div>', {'class': 'scan-line-effect'}),
                    $('<div>', {'class': 'scan-animation'}),
                    $('<div>', {'class': 'radial-glow'})
                ]
            });
            $('body').append(crtContainer);
        }
    }
    
    // 初始化CRT效果
    createCRTEffects();
    
    // 橙幕切换功能（类似黑幕切换）
    if (typeof window.orangemu_toggle_init === 'undefined') {
        window.orangemu_toggle_init = true;
        
        // 为橙幕添加点击切换功能
        $(document).on('click', '.orangemu', function(e) {
            e.stopPropagation();
            $(this).toggleClass('orangemu_toggle_on');
        });
    }
    
    // 淡入动画支持
    function applyFadeInAnimation() {
        $('#mw-content-text > *').each(function(index) {
            $(this).css('animation-delay', (index * 0.1) + 's');
        });
    }
    
    // 应用淡入动画
    applyFadeInAnimation();
    
    // 监听新内容加载（如AJAX）
    mw.hook('wikipage.content').add(function($content) {
        if ($content.attr('id') === 'mw-content-text') {
            applyFadeInAnimation();
        }
    });
    
    // 添加复古终端效果的打字动画
    function typeWriter(element, text, speed) {
        var i = 0;
        element.empty();
        function type() {
            if (i < text.length) {
                element.append(text.charAt(i));
                i++;
                setTimeout(type, speed);
            }
        }
        type();
    }
    
    // 为特定元素应用打字效果
    $('.terminal-text').each(function() {
        var text = $(this).text();
        typeWriter($(this), text, 50);
    });
    
    // 添加闪烁光标效果
    function createBlinkingCursor() {
        var cursor = $('<span>', {
            'class': 'terminal-cursor',
            text: '▋'
        });
        
        setInterval(function() {
            cursor.toggle();
        }, 500);
        
        return cursor;
    }
    
    // 为终端元素添加光标
    $('.terminal').each(function() {
        $(this).append(createBlinkingCursor());
    });
    
    // 模拟CRT屏幕抖动效果
    function screenGlitch() {
        var container = $('#content');
        container.css('transform', 'translate(' + (Math.random() * 2 - 1) + 'px, ' + (Math.random() * 2 - 1) + 'px)');
        setTimeout(function() {
            container.css('transform', 'translate(0, 0)');
        }, 50);
    }
    
    // 随机触发屏幕抖动
    setInterval(function() {
        if (Math.random() < 0.005) { // 0.5%的概率
            screenGlitch();
        }
    }, 1000);
    
    // 添加按键声音效果（可选）
    var keySound = new Audio('path/to/keyboard-sound.mp3'); // 需要提供音频文件
    
    $(document).on('keydown', 'input[type="text"], textarea', function() {
        if (keySound.readyState === 4) {
            keySound.currentTime = 0;
            keySound.play().catch(function() {}); // 避免自动播放限制错误
        }
    });
    
    // 为页面添加启动动画
    function bootSequence() {
        $('body').addClass('booting');
        setTimeout(function() {
            $('body').removeClass('booting').addClass('booted');
        }, 2000);
    }
    
    // 页面加载时执行启动序列
    bootSequence();
});

// 辅助CSS类
$(function() {
    // 动态添加一些必要的CSS
    var customStyles = `
        .terminal-cursor {
            animation: blink 1s infinite;
        }
        
        @keyframes blink {
            0% { opacity: 1; }
            50% { opacity: 0; }
            100% { opacity: 1; }
        }
        
        .booting #content {
            opacity: 0;
            transform: scale(0.95);
            transition: all 0.5s ease-out;
        }
        
        .booted #content {
            opacity: 1;
            transform: scale(1);
        }
        
        .terminal {
            font-family: var(--mono-font);
            background-color: rgb(var(--black-monochrome));
            color: rgb(var(--bright-accent));
            padding: 1rem;
            border: 2px solid rgb(var(--bright-accent));
            box-shadow: 0 0 10px rgba(var(--bright-accent), 0.3);
        }
    `;
    
    $('<style>').text(customStyles).appendTo('head');
});