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.

// Slideshow Script: Illustrations of Huck, filter by illustrator

// ===============================
// Huck Slideshow – filter by illustrator
// ===============================

// Globale Bildlisten und aktuelle Indizes für Huck
var huck_slides = { C: [], D: [] };
var huck_currentIndex = { C: 0, D: 0 };

// Slideshow laden für Huck
function huck_filterAndLoadSlideshow(target) {
    var dropdownId = 'illustratorDropdown' + target;
    var selectedIllustrator = document.getElementById(dropdownId).value.toLowerCase();
    var imageElement = document.getElementById('slide' + target);

    if (!imageElement) {
        console.error('Huck Slideshow ' + target + ': Bild-Element nicht gefunden.');
        return;
    }

    huck_slides[target] = [];
    huck_currentIndex[target] = 0;

    if (!selectedIllustrator) {
        imageElement.src = " ";
        imageElement.title = "Kein Illustrator ausgewählt.";
        return;
    }

    var rows = document.querySelectorAll('#catalog tbody tr');

    for (var i = 0; i < rows.length; i++) {
        var row = rows[i];
        var illustratorCell = row.cells[2];
        var tagsCell = row.cells[7];
        var idCell = row.cells[8];

        var illustratorText = illustratorCell ? illustratorCell.textContent.trim().toLowerCase() : '';
        var tagsText = tagsCell ? tagsCell.textContent.trim().toLowerCase() : '';
        var idLink = idCell ? idCell.getElementsByTagName('a')[0] : null;
        var idText = idLink ? idLink.textContent.trim().toLowerCase() : '';

        // Filter: Illustrator match & 'huck'-Tag vorhanden
        if (illustratorText.indexOf(selectedIllustrator) !== -1 && tagsText.indexOf('huck') !== -1) {
            huck_slides[target].push(idText);
            console.log('✓ Zeile ' + i + ': ID=' + idText);
        }
    }

    if (huck_slides[target].length === 0) {
        imageElement.src = " ";
        imageElement.title = "Keine passenden Bilder gefunden.";
        return;
    }

    huck_showSlide(target, 0);
}

// Einzelnes Bild anzeigen
function huck_showSlide(target, index) {
    var imageElement = document.getElementById('slide' + target);
    var slideArray = huck_slides[target];

    if (!imageElement || slideArray.length === 0) return;

    huck_currentIndex[target] = (index + slideArray.length) % slideArray.length;
    var imageId = slideArray[huck_currentIndex[target]];

    imageElement.src = '/index.php/Special:Redirect/file/' + imageId + '.jpg';
    imageElement.alt = imageId;
    imageElement.title = imageId;

    // optional: preload next image
    var nextImg = new Image();
    nextImg.src = '/index.php/Special:Redirect/file/' + slideArray[(huck_currentIndex[target] + 1) % slideArray.length] + '.jpg';
}

// Buttons
function huck_nextSlide(target) {
    huck_showSlide(target, huck_currentIndex[target] + 1);
}

function huck_prevSlide(target) {
    huck_showSlide(target, huck_currentIndex[target] - 1);
}

// ===============================
// Jim Slideshow – filter by illustrator
// ===============================

// Globale Bildlisten und aktuelle Indizes für Jim
var jim_slides = { C: [], D: [] };
var jim_currentIndex = { C: 0, D: 0 };

// Slideshow laden für Jim
function jim_filterAndLoadSlideshow(target) {
    var dropdownId = 'jim_illustratorDropdown' + target;
    var selectedIllustrator = document.getElementById(dropdownId).value.toLowerCase();
    var imageElement = document.getElementById('jim_slide' + target);

    if (!imageElement) {
        console.error('Jim Slideshow ' + target + ': Bild-Element nicht gefunden.');
        return;
    }

    jim_slides[target] = [];
    jim_currentIndex[target] = 0;

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

    var rows = document.querySelectorAll('#catalog tbody tr');

    for (var i = 0; i < rows.length; i++) {
        var row = rows[i];
        var illustratorCell = row.cells[2];
        var tagsCell = row.cells[7];
        var idCell = row.cells[8];

        var illustratorText = illustratorCell ? illustratorCell.textContent.trim().toLowerCase() : '';
        var tagsText = tagsCell ? tagsCell.textContent.trim().toLowerCase() : '';
        var idLink = idCell ? idCell.getElementsByTagName('a')[0] : null;
        var idText = idLink ? idLink.textContent.trim().toLowerCase() : '';

        // Filter: Illustrator match & 'jim'-Tag vorhanden
        if (illustratorText.indexOf(selectedIllustrator) !== -1 && tagsText.indexOf('jim') !== -1) {
            jim_slides[target].push(idText);
            console.log('✓ Zeile ' + i + ': ID=' + idText);
        }
    }

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

    jim_showSlide(target, 0);
}

// Einzelnes Bild anzeigen
function jim_showSlide(target, index) {
    var imageElement = document.getElementById('jim_slide' + target);
    var slideArray = jim_slides[target];

    if (!imageElement || slideArray.length === 0) return;

    jim_currentIndex[target] = (index + slideArray.length) % slideArray.length;
    var imageId = slideArray[jim_currentIndex[target]];

    imageElement.src = '/index.php/Special:Redirect/file/' + imageId + '.jpg';
    imageElement.alt = imageId;
    imageElement.title = imageId;

    // optional: preload next image
    var nextImg = new Image();
    nextImg.src = '/index.php/Special:Redirect/file/' + slideArray[(jim_currentIndex[target] + 1) % slideArray.length] + '.jpg';
}

// Buttons
function jim_nextSlide(target) {
    jim_showSlide(target, jim_currentIndex[target] + 1);
}

function jim_prevSlide(target) {
    jim_showSlide(target, jim_currentIndex[target] - 1);
}

// ===============================
// Pap Finn Slideshow – filter by illustrator
// ===============================

// Globale Bildlisten und aktuelle Indizes für Pap Finn
var pap_slides = { C: [], D: [] };
var pap_currentIndex = { C: 0, D: 0 };

// Slideshow laden für Pap Finn
function pap_filterAndLoadSlideshow(target) {
    var dropdownId = 'pap_illustratorDropdown' + target;
    var selectedIllustrator = document.getElementById(dropdownId).value.toLowerCase();
    var imageElement = document.getElementById('pap_slide' + target);

    if (!imageElement) {
        console.error('Pap Finn Slideshow ' + target + ': Bild-Element nicht gefunden.');
        return;
    }

    pap_slides[target] = [];
    pap_currentIndex[target] = 0;

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

    var rows = document.querySelectorAll('#catalog tbody tr');

    for (var i = 0; i < rows.length; i++) {
        var row = rows[i];
        var illustratorCell = row.cells[2];
        var tagsCell = row.cells[7];
        var idCell = row.cells[8];

        var illustratorText = illustratorCell ? illustratorCell.textContent.trim().toLowerCase() : '';
        var tagsText = tagsCell ? tagsCell.textContent.trim().toLowerCase() : '';
        var idLink = idCell ? idCell.getElementsByTagName('a')[0] : null;
        var idText = idLink ? idLink.textContent.trim().toLowerCase() : '';

        // Filter: Illustrator match & 'pap'-Tag vorhanden
        if (illustratorText.indexOf(selectedIllustrator) !== -1 && tagsText.indexOf('pap') !== -1) {
            pap_slides[target].push(idText);
            console.log('✓ Zeile ' + i + ': ID=' + idText);
        }
    }

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

    pap_showSlide(target, 0);
}

// Einzelnes Bild anzeigen
function pap_showSlide(target, index) {
    var imageElement = document.getElementById('pap_slide' + target);
    var slideArray = pap_slides[target];

    if (!imageElement || slideArray.length === 0) return;

    pap_currentIndex[target] = (index + slideArray.length) % slideArray.length;
    var imageId = slideArray[pap_currentIndex[target]];

    imageElement.src = '/index.php/Special:Redirect/file/' + imageId + '.jpg';
    imageElement.alt = imageId;
    imageElement.title = imageId;

    // optional: preload next image
    var nextImg = new Image();
    nextImg.src = '/index.php/Special:Redirect/file/' + slideArray[(pap_currentIndex[target] + 1) % slideArray.length] + '.jpg';
}

// Buttons
function pap_nextSlide(target) {
    pap_showSlide(target, pap_currentIndex[target] + 1);
}

function pap_prevSlide(target) {
    pap_showSlide(target, pap_currentIndex[target] - 1);
}

// ===============================
// King/Duke Slideshow – filter by illustrator
// ===============================

// Globale Bildlisten und aktuelle Indizes für King/Duke
var kd_slides = { C: [], D: [] };
var kd_currentIndex = { C: 0, D: 0 };

// Slideshow laden für King/Duke
function kd_filterAndLoadSlideshow(target) {
    var dropdownId = 'kd_illustratorDropdown' + target;
    var selectedIllustrator = document.getElementById(dropdownId).value.toLowerCase();
    var imageElement = document.getElementById('kd_slide' + target);

    if (!imageElement) {
        console.error('King/Duke Slideshow ' + target + ': Bild-Element nicht gefunden.');
        return;
    }

    kd_slides[target] = [];
    kd_currentIndex[target] = 0;

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

    var rows = document.querySelectorAll('#catalog tbody tr');

    for (var i = 0; i < rows.length; i++) {
        var row = rows[i];
        var illustratorCell = row.cells[2];
        var tagsCell = row.cells[7];
        var idCell = row.cells[8];

        var illustratorText = illustratorCell ? illustratorCell.textContent.trim().toLowerCase() : '';
        var tagsText = tagsCell ? tagsCell.textContent.trim().toLowerCase() : '';
        var idLink = idCell ? idCell.getElementsByTagName('a')[0] : null;
        var idText = idLink ? idLink.textContent.trim().toLowerCase() : '';

        // Filter: Illustrator match UND '-king' oder '-duke' im Tag
        if (illustratorText.indexOf(selectedIllustrator) !== -1 &&
            (tagsText.indexOf('-king') !== -1 || tagsText.indexOf('-duke') !== -1)) {
            kd_slides[target].push(idText);
            console.log('✓ Zeile ' + i + ': ID=' + idText);
        }
    }

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

    kd_showSlide(target, 0);
}

// Einzelnes Bild anzeigen
function kd_showSlide(target, index) {
    var imageElement = document.getElementById('kd_slide' + target);
    var slideArray = kd_slides[target];

    if (!imageElement || slideArray.length === 0) return;

    kd_currentIndex[target] = (index + slideArray.length) % slideArray.length;
    var imageId = slideArray[kd_currentIndex[target]];

    imageElement.src = '/index.php/Special:Redirect/file/' + imageId + '.jpg';
    imageElement.alt = imageId;
    imageElement.title = imageId;

    // optional: preload next image
    var nextImg = new Image();
    nextImg.src = '/index.php/Special:Redirect/file/' + slideArray[(kd_currentIndex[target] + 1) % slideArray.length] + '.jpg';
}

// Buttons
function kd_nextSlide(target) {
    kd_showSlide(target, kd_currentIndex[target] + 1);
}

function kd_prevSlide(target) {
    kd_showSlide(target, kd_currentIndex[target] - 1);
}

// ===============================
// Tom Slideshow – filter by illustrator
// ===============================

// Globale Bildlisten und aktuelle Indizes für Tom
var tom_slides = { C: [], D: [] };
var tom_currentIndex = { C: 0, D: 0 };

// Slideshow laden für Tom
function tom_filterAndLoadSlideshow(target) {
    var dropdownId = 'tom_illustratorDropdown' + target;
    var selectedIllustrator = document.getElementById(dropdownId).value.toLowerCase();
    var imageElement = document.getElementById('tom_slide' + target);

    if (!imageElement) {
        console.error('Tom Slideshow ' + target + ': Bild-Element nicht gefunden.');
        return;
    }

    tom_slides[target] = [];
    tom_currentIndex[target] = 0;

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

    var rows = document.querySelectorAll('#catalog tbody tr');

    for (var i = 0; i < rows.length; i++) {
        var row = rows[i];
        var illustratorCell = row.cells[2];
        var tagsCell = row.cells[7];
        var idCell = row.cells[8];

        var illustratorText = illustratorCell ? illustratorCell.textContent.trim().toLowerCase() : '';
        var tagsText = tagsCell ? tagsCell.textContent.trim().toLowerCase() : '';
        var idLink = idCell ? idCell.getElementsByTagName('a')[0] : null;
        var idText = idLink ? idLink.textContent.trim().toLowerCase() : '';

        // Filter: Illustrator match & '-tom'-Tag vorhanden
        if (illustratorText.indexOf(selectedIllustrator) !== -1 && tagsText.indexOf('-tom') !== -1) {
            tom_slides[target].push(idText);
            console.log('✓ Zeile ' + i + ': ID=' + idText);
        }
    }

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

    tom_showSlide(target, 0);
}

// Einzelnes Bild anzeigen
function tom_showSlide(target, index) {
    var imageElement = document.getElementById('tom_slide' + target);
    var slideArray = tom_slides[target];

    if (!imageElement || slideArray.length === 0) return;

    tom_currentIndex[target] = (index + slideArray.length) % slideArray.length;
    var imageId = slideArray[tom_currentIndex[target]];

    imageElement.src = '/index.php/Special:Redirect/file/' + imageId + '.jpg';
    imageElement.alt = imageId;
    imageElement.title = imageId;

    // optional: preload next image
    var nextImg = new Image();
    nextImg.src = '/index.php/Special:Redirect/file/' + slideArray[(tom_currentIndex[target] + 1) % slideArray.length] + '.jpg';
}

// Buttons
function tom_nextSlide(target) {
    tom_showSlide(target, tom_currentIndex[target] + 1);
}

function tom_prevSlide(target) {
    tom_showSlide(target, tom_currentIndex[target] - 1);
}

// ===============================
// Other Characters Slideshow – filter by illustrator
// ===============================

// Globale Bildlisten und aktuelle Indizes für Other Characters
var other_slides = { C: [], D: [] };
var other_currentIndex = { C: 0, D: 0 };

// Slideshow laden für Other Characters
function other_filterAndLoadSlideshow(target) {
    var dropdownId = 'other_illustratorDropdown' + target;
    var selectedIllustrator = document.getElementById(dropdownId).value.toLowerCase();
    var imageElement = document.getElementById('other_slide' + target);

    if (!imageElement) {
        console.error('Other Characters Slideshow ' + target + ': Bild-Element nicht gefunden.');
        return;
    }

    other_slides[target] = [];
    other_currentIndex[target] = 0;

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

    var rows = document.querySelectorAll('#catalog tbody tr');

    for (var i = 0; i < rows.length; i++) {
        var row = rows[i];
        var illustratorCell = row.cells[2];
        var tagsCell = row.cells[7];
        var idCell = row.cells[8];

        var illustratorText = illustratorCell ? illustratorCell.textContent.trim().toLowerCase() : '';
        var tagsText = tagsCell ? tagsCell.textContent.trim().toLowerCase() : '';
        var idLink = idCell ? idCell.getElementsByTagName('a')[0] : null;
        var idText = idLink ? idLink.textContent.trim().toLowerCase() : '';

        // Filter: Illustrator match & '-sdc'-Tag vorhanden
        if (illustratorText.indexOf(selectedIllustrator) !== -1 && tagsText.indexOf('-sdc') !== -1) {
            other_slides[target].push(idText);
            console.log('✓ Zeile ' + i + ': ID=' + idText);
        }
    }

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

    other_showSlide(target, 0);
}

// Einzelnes Bild anzeigen
function other_showSlide(target, index) {
    var imageElement = document.getElementById('other_slide' + target);
    var slideArray = other_slides[target];

    if (!imageElement || slideArray.length === 0) return;

    other_currentIndex[target] = (index + slideArray.length) % slideArray.length;
    var imageId = slideArray[other_currentIndex[target]];

    imageElement.src = '/index.php/Special:Redirect/file/' + imageId + '.jpg';
    imageElement.alt = imageId;
    imageElement.title = imageId;

    // optional: preload next image
    var nextImg = new Image();
    nextImg.src = '/index.php/Special:Redirect/file/' + slideArray[(other_currentIndex[target] + 1) % slideArray.length] + '.jpg';
}

// Buttons
function other_nextSlide(target) {
    other_showSlide(target, other_currentIndex[target] + 1);
}

function other_prevSlide(target) {
    other_showSlide(target, other_currentIndex[target] - 1);
}


// ===============================
// Female Characters Slideshow – filter by illustrator
// ===============================

// Globale Bildlisten und aktuelle Indizes für Female Characters
var female_slides = { C: [], D: [] };
var female_currentIndex = { C: 0, D: 0 };

// Slideshow laden für Female Characters
function female_filterAndLoadSlideshow(target) {
    var dropdownId = 'female_illustratorDropdown' + target;
    var selectedIllustrator = document.getElementById(dropdownId).value.toLowerCase();
    var imageElement = document.getElementById('female_slide' + target);

    if (!imageElement) {
        console.error('Female Characters Slideshow ' + target + ': Bild-Element nicht gefunden.');
        return;
    }

    female_slides[target] = [];
    female_currentIndex[target] = 0;

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

    var rows = document.querySelectorAll('#catalog tbody tr');

    for (var i = 0; i < rows.length; i++) {
        var row = rows[i];
        var illustratorCell = row.cells[2];
        var tagsCell = row.cells[7];
        var idCell = row.cells[8];

        var illustratorText = illustratorCell ? illustratorCell.textContent.trim().toLowerCase() : '';
        var tagsText = tagsCell ? tagsCell.textContent.trim().toLowerCase() : '';
        var idLink = idCell ? idCell.getElementsByTagName('a')[0] : null;
        var idText = idLink ? idLink.textContent.trim().toLowerCase() : '';

        // Filter: Illustrator match & '-fem'-Tag vorhanden
        if (illustratorText.indexOf(selectedIllustrator) !== -1 && tagsText.indexOf('-fem') !== -1) {
            female_slides[target].push(idText);
            console.log('✓ Zeile ' + i + ': ID=' + idText);
        }
    }

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

    female_showSlide(target, 0);
}

// Einzelnes Bild anzeigen
function female_showSlide(target, index) {
    var imageElement = document.getElementById('female_slide' + target);
    var slideArray = female_slides[target];

    if (!imageElement || slideArray.length === 0) return;

    female_currentIndex[target] = (index + slideArray.length) % slideArray.length;
    var imageId = slideArray[female_currentIndex[target]];

    imageElement.src = '/index.php/Special:Redirect/file/' + imageId + '.jpg';
    imageElement.alt = imageId;
    imageElement.title = imageId;

    // optional: preload next image
    var nextImg = new Image();
    nextImg.src = '/index.php/Special:Redirect/file/' + slideArray[(female_currentIndex[target] + 1) % slideArray.length] + '.jpg';
}

// Buttons
function female_nextSlide(target) {
    female_showSlide(target, female_currentIndex[target] + 1);
}

function female_prevSlide(target) {
    female_showSlide(target, female_currentIndex[target] - 1);
}

// ===============================
// Black Characters Slideshow – filter by illustrator
// ===============================

// Globale Bildlisten und aktuelle Indizes für Black Characters
var black_slides = { C: [], D: [] };
var black_currentIndex = { C: 0, D: 0 };

// Slideshow laden für Black Characters
function black_filterAndLoadSlideshow(target) {
    var dropdownId = 'black_illustratorDropdown' + target;
    var selectedIllustrator = document.getElementById(dropdownId).value.toLowerCase();
    var imageElement = document.getElementById('black_slide' + target);

    if (!imageElement) {
        console.error('Black Slideshow ' + target + ': Bild-Element nicht gefunden.');
        return;
    }

    black_slides[target] = [];
    black_currentIndex[target] = 0;

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

    var rows = document.querySelectorAll('#catalog tbody tr');

    for (var i = 0; i < rows.length; i++) {
        var row = rows[i];
        var illustratorCell = row.cells[2];
        var tagsCell = row.cells[7];
        var idCell = row.cells[8];

        var illustratorText = illustratorCell ? illustratorCell.textContent.trim().toLowerCase() : '';
        var tagsText = tagsCell ? tagsCell.textContent.trim().toLowerCase() : '';
        var idLink = idCell ? idCell.getElementsByTagName('a')[0] : null;
        var idText = idLink ? idLink.textContent.trim().toLowerCase() : '';

        // Filter: Illustrator match & '-aac'-Tag vorhanden
        if (illustratorText.indexOf(selectedIllustrator) !== -1 && tagsText.indexOf('aac') !== -1) {
            black_slides[target].push(idText);
            console.log('✓ Zeile ' + i + ': ID=' + idText);
        }
    }

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

    black_showSlide(target, 0);
}

// Einzelnes Bild anzeigen
function black_showSlide(target, index) {
    var imageElement = document.getElementById('black_slide' + target);
    var slideArray = black_slides[target];

    if (!imageElement || slideArray.length === 0) return;

    black_currentIndex[target] = (index + slideArray.length) % slideArray.length;
    var imageId = slideArray[black_currentIndex[target]];

    imageElement.src = '/index.php/Special:Redirect/file/' + imageId + '.jpg';
    imageElement.alt = imageId;
    imageElement.title = imageId;

    // optional: preload next image
    var nextImg = new Image();
    nextImg.src = '/index.php/Special:Redirect/file/' + slideArray[(black_currentIndex[target] + 1) % slideArray.length] + '.jpg';
}

// Buttons
function black_nextSlide(target) {
    black_showSlide(target, black_currentIndex[target] + 1);
}

function black_prevSlide(target) {
    black_showSlide(target, black_currentIndex[target] - 1);
}