MediaWiki:CharacterFilter.js

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)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

// ===============================
// Character Slideshows
// ===============================

// --- Helper Factory ---
function createCharacterSlideshow(tag) {
  return {
    tag: tag,
    slides: { A: [], B: [], C: [], D: [] },
    currentIndex: { A: 0, B: 0, C: 0, D: 0 },

    load: function(target) {
      const dropdownId = 'illustratorDropdown' + target;
      const selectedIllustrator = document.getElementById(dropdownId).value.toLowerCase();
      const imageElement = document.getElementById('slide' + target);

      if (!imageElement) return console.error(this.tag + ' Slideshow ' + target + ' not found.');

      this.slides[target] = [];
      this.currentIndex[target] = 0;

      if (!selectedIllustrator) {
        imageElement.src = "https://illus.twainframe.org/images/d/d2/GalleryPlaceholder.png";
        imageElement.title = "No illustrator selected.";
        return;
      }

      const rows = document.querySelectorAll('#catalog tbody tr');
      rows.forEach((row, i) => {
        const illustratorText = row.cells[2]?.textContent.trim().toLowerCase() || '';
        const tagsText = row.cells[7]?.textContent.trim().toLowerCase() || '';
        const idLink = row.cells[8]?.getElementsByTagName('a')[0];
        const idText = idLink?.textContent.trim().toLowerCase() || '';

        if (illustratorText.includes(selectedIllustrator) && tagsText.includes(this.tag)) {
          this.slides[target].push(idText);
          console.log('✓ ' + this.tag + ' row ' + i + ': ID=' + idText);
        }
      });

      if (this.slides[target].length === 0) {
        imageElement.src = "https://illus.twainframe.org/images/d/d2/GalleryPlaceholder.png";
        imageElement.title = "No matching images.";
        return;
      }

      this.show(target, 0);
    },

    show: function(target, index) {
      const imageElement = document.getElementById('slide' + target);
      const slideArray = this.slides[target];
      if (!imageElement || slideArray.length === 0) return;

      this.currentIndex[target] = (index + slideArray.length) % slideArray.length;
      const imageId = slideArray[this.currentIndex[target]];
      imageElement.src = '/index.php/Special:Redirect/file/' + imageId + '.jpg';
      imageElement.alt = imageId;
      imageElement.title = imageId;
    },

    next: function(target) { this.show(target, this.currentIndex[target] + 1); },
    prev: function(target) { this.show(target, this.currentIndex[target] - 1); }
  };
}

// --- Character Slideshow Objects ---
const huckSlideshow = createCharacterSlideshow('huck');
const jimSlideshow = createCharacterSlideshow('jim');
const papSlideshow = createCharacterSlideshow('pap');
const kdSlideshow = createCharacterSlideshow('king'); // King & Duke: einfach beide Tags zusammen filtern
kdSlideshow.altTags = ['duke']; // zusätzlich Duke-Tag berücksichtigen
const tomSlideshow = createCharacterSlideshow('tom');
const sdcSlideshow = createCharacterSlideshow('sdc');
const femSlideshow = createCharacterSlideshow('fem');
const aacSlideshow = createCharacterSlideshow('aac');

// Anpassung für KD, dass beide Tags funktionieren
kdSlideshow.load = function(target) {
  const dropdownId = 'illustratorDropdown' + target;
  const selectedIllustrator = document.getElementById(dropdownId).value.toLowerCase();
  const imageElement = document.getElementById('slide' + target);

  if (!imageElement) return console.error('KD Slideshow ' + target + ' not found.');

  this.slides[target] = [];
  this.currentIndex[target] = 0;

  if (!selectedIllustrator) {
    imageElement.src = "https://illus.twainframe.org/images/d/d2/GalleryPlaceholder.png";
    imageElement.title = "No illustrator selected.";
    return;
  }

  const rows = document.querySelectorAll('#catalog tbody tr');
  rows.forEach((row, i) => {
    const illustratorText = row.cells[2]?.textContent.trim().toLowerCase() || '';
    const tagsText = row.cells[7]?.textContent.trim().toLowerCase() || '';
    const idLink = row.cells[8]?.getElementsByTagName('a')[0];
    const idText = idLink?.textContent.trim().toLowerCase() || '';

    if (illustratorText.includes(selectedIllustrator) &&
       (tagsText.includes('king') || tagsText.includes('duke'))) {
      this.slides[target].push(idText);
      console.log('✓ KD row ' + i + ': ID=' + idText);
    }
  });

  if (this.slides[target].length === 0) {
    imageElement.src = "https://illus.twainframe.org/images/d/d2/GalleryPlaceholder.png";
    imageElement.title = "No matching images.";
    return;
  }

  this.show(target, 0);
};