മീഡിയവിക്കി:Common.js

/* ============================================================
   OpenStreetMap marker URL fix
   ============================================================ */
window.onload = function () {
    var images = document.querySelectorAll('img');
    for (var i = 0; i < images.length; i++) {
        var img = images[i];
        if (
            img.src &&
            img.src.startsWith("https://tile.openstreetmap.org/v4/marker/")
        ) {
            img.src = img.src.replace(
                'https://tile.openstreetmap.org/v4/marker/',
                'https://maps.wikimedia.org/v4/marker/'
            );
        }
};
};

/* ============================================================
   Wikimedia Commons Gallery Loader (Template-based, MULTILINE SAFE)
   ============================================================ */
mw.hook('wikipage.content').add(function ($content) {

    $content.find('.commons-gallery').each(function () {
        var container = this;

        var sources = container.querySelectorAll('.commons-gallery-source');
        if (!sources.length) return;

        var width = 300;

        var grid = document.createElement('div');
        grid.className = 'commons-gallery-grid';
        grid.style.display = 'grid';
        grid.style.gridTemplateColumns =
            'repeat(auto-fill, minmax(' + width + 'px, 1fr))';
        grid.style.gap = '8px';

        container.appendChild(grid);

        sources.forEach(function (srcEl) {
            var filename = srcEl.dataset.file;
            var captionText = srcEl.dataset.caption || '';

            if (!filename) return;

            var apiUrl =
                'https://commons.wikimedia.org/w/api.php' +
                '?action=query' +
                '&format=json' +
                '&prop=imageinfo' +
                '&iiprop=url|extmetadata' +
                '&iiurlwidth=' + width +
                '&titles=File:' + encodeURIComponent(filename) +
                '&origin=*';

            fetch(apiUrl)
                .then(function (r) {
                    if (!r.ok) throw new Error('HTTP ' + r.status);
                    return r.json();
                })
                .then(function (data) {
                    if (!data || !data.query || !data.query.pages) return;

                    var page =
                        data.query.pages[Object.keys(data.query.pages)[0]];
                    if (!page || !page.imageinfo) return;

                    var info = page.imageinfo[0];
                    var imgUrl = info.thumburl || info.url;

                    var artist = 'Unknown';
                    var license = '';
                    var licenseUrl = '';
                    var commonsUrl = info.descriptionurl || '';

                    if (info.extmetadata) {
                        if (info.extmetadata.Artist) {
                            artist = info.extmetadata.Artist.value;
                        }
                        if (info.extmetadata.LicenseShortName) {
                            license = info.extmetadata.LicenseShortName.value;
                        }
                        if (info.extmetadata.LicenseUrl) {
                            licenseUrl = info.extmetadata.LicenseUrl.value;
                        }
                    }

                    var figure = document.createElement('figure');
                    figure.className = 'commons-gallery-item';

                    var img = document.createElement('img');
                    img.src = imgUrl;
                    img.alt = captionText || filename;
                    img.loading = 'lazy';
                    img.style.width = '100%';

                    /* Lightbox source: responsive, not original */
                    var lightboxSrc = info.url;
                    if (info.responsiveUrls) {
                        if (window.devicePixelRatio > 1 && info.responsiveUrls['2']) {
                            lightboxSrc = info.responsiveUrls['2'];
                        } else if (info.responsiveUrls['1.5']) {
                            lightboxSrc = info.responsiveUrls['1.5'];
                        }
                    }

                    img.dataset.fullsrc = lightboxSrc;
                    img.dataset.caption =
                        (captionText ? captionText + '<br>' : '') +
                        '© ' + artist +
                        (licenseUrl
                            ? ' – <a href="' + licenseUrl +
                              '" target="_blank" rel="noopener noreferrer">' +
                              license + '</a>'
                            : '') +
                        (commonsUrl
                            ? '<br><a href="' + commonsUrl +
                              '" target="_blank" rel="noopener noreferrer">' +
                              'View on Wikimedia Commons</a>'
                            : '');

                    figure.appendChild(img);

                    var figcaption = document.createElement('figcaption');
                    figcaption.style.fontSize = '0.75em';
                    figcaption.style.textAlign = 'center';
                    figcaption.innerHTML = img.dataset.caption;

                    figure.appendChild(figcaption);
                    grid.appendChild(figure);
                })
                .catch(function (err) {
                    console.warn(
                        'Commons gallery image failed:',
                        filename,
                        err.message
                    );
                });
        });

        /* Hide source placeholders */
        sources.forEach(function (el) {
            el.style.display = 'none';
        });
    });
});

/* ============================================================
   Commons Gallery Lightbox Viewer (with navigation)
   ============================================================ */
(function () {

    var galleryImages = [];
    var currentIndex = -1;

    function collectGalleryImages() {
        galleryImages = Array.prototype.slice.call(
            document.querySelectorAll('.commons-gallery-item img')
        );
    }

    function createLightbox() {
        if (document.getElementById('commons-lightbox')) return;

        var overlay = document.createElement('div');
        overlay.id = 'commons-lightbox';

        overlay.innerHTML =
            '<div class="clb-backdrop"></div>' +
            '<div class="clb-content">' +
                '<button class="clb-prev" aria-label="Previous">‹</button>' +
                '<button class="clb-next" aria-label="Next">›</button>' +
                '<button class="clb-close" aria-label="Close">×</button>' +
                '<img class="clb-image" alt="">' +
                '<div class="clb-caption"></div>' +
            '</div>';

        document.body.appendChild(overlay);

        overlay.querySelector('.clb-backdrop').onclick = closeLightbox;
        overlay.querySelector('.clb-close').onclick = closeLightbox;
        overlay.querySelector('.clb-prev').onclick = showPrev;
        overlay.querySelector('.clb-next').onclick = showNext;

        document.addEventListener('keydown', function (e) {
            if (!overlay.classList.contains('active')) return;
            if (e.key === 'Escape') closeLightbox();
            if (e.key === 'ArrowLeft') showPrev();
            if (e.key === 'ArrowRight') showNext();
        });
    }

    function openLightbox(img) {
        collectGalleryImages();
        currentIndex = galleryImages.indexOf(img);
        if (currentIndex === -1) return;

        createLightbox();
        showImage(currentIndex);

        document.getElementById('commons-lightbox').classList.add('active');
        document.body.style.overflow = 'hidden';
    }

    function showImage(index) {
        var overlay = document.getElementById('commons-lightbox');
        var lbImg = overlay.querySelector('.clb-image');
        var caption = overlay.querySelector('.clb-caption');

        var img = galleryImages[index];
        if (!img) return;

        lbImg.src = img.dataset.fullsrc || img.src;
        lbImg.alt = img.alt || '';
        caption.innerHTML = img.dataset.caption || '';

        currentIndex = index;
    }

    function showPrev() {
        if (currentIndex > 0) showImage(currentIndex - 1);
    }

    function showNext() {
        if (currentIndex < galleryImages.length - 1) {
            showImage(currentIndex + 1);
        }
    }

    function closeLightbox() {
        var overlay = document.getElementById('commons-lightbox');
        if (!overlay) return;
        overlay.classList.remove('active');
        document.body.style.overflow = '';
    }

    /* Event delegation (single, correct) */
    document.addEventListener('click', function (e) {
        var img = e.target;
        if (img && img.matches('.commons-gallery-item img')) {
            openLightbox(img);
        }
    });

})();

/* ============================================================
   Editing tools
   ============================================================ */
if (
    mw.config.get('wgAction') === 'edit' ||
    mw.config.get('wgAction') === 'submit' ||
    mw.config.get('wgCanonicalSpecialPageName') === 'Upload'
) {
    mw.loader.load(
        '/index.php?title=മീഡിയവിക്കി:Common.js/edit.js&action=raw&ctype=text/javascript'
    );
}

/* ============================================================
   Special characters subset menu
   ============================================================ */
function addCharSubsetMenu() {
    if ($('#editpage-specialchars').length > 0) {

        var s = parseInt($.cookie('edittoolscharsubset'), 10);
        if (isNaN(s)) s = 0;

        var $menu = $('<select />')
            .attr('id', 'charSubsetControl')
            .css('display', 'inline')
            .change(chooseCharSubset)
            .data('previousSelectedIndex', s)
            .append($('<option />').text('ഫലകങ്ങൾ'))
            .append($('<option />').text('വിക്കിവിന്യാസങ്ങൾ'))
            .append($('<option />').text('അനുമതിപത്രങ്ങൾ'))
            .append($('<option />').text('മലയാളം'))
            .append($('<option />').text('കൊറിയൻ'))
            .append($('<option />').text('ലത്തീൻ'))
            .append($('<option />').text('ഐ.പി.എ.'))
            .append($('<option />').text('പലവക'))
            .append($('<option />').text('അറബി'))
            .append($('<option />').text('ദേവനാഗരി'))
            .append($('<option />').text('ഹിബ്രു'))
            .append($('<option />').text('പഴയ ഇംഗ്ലീഷ്'));

        $('#editpage-specialchars').prepend($menu);
        $('#charSubsetControl')[0].selectedIndex = s;

        $('p', '#editpage-specialchars').each(function (index) {
            $(this).css({
                display: index === s ? 'inline' : 'none',
                visibility: index === s ? 'visible' : 'hidden'
            });
        });
    }
}

function chooseCharSubset() {
    var selectedIndex = $(this).find(':selected').index();
    $('p', '#editpage-specialchars').each(function (index) {
        $(this).css({
            display: index === selectedIndex ? 'inline' : 'none',
            visibility: index === selectedIndex ? 'visible' : 'hidden'
        });
    });
    $.cookie('edittoolscharsubset', selectedIndex);
}

$(addCharSubsetMenu);

/* ============================================================
   Navigation bars
   ============================================================ */
var NavigationBarHide = 'മറയ്ക്കുക';
var NavigationBarShow = 'പ്രദർശിപ്പിക്കുക';
var indexNavigationBar = 0;

window.toggleNavigationBar = function (index, event) {
    var NavToggle = document.getElementById('NavToggle' + index);
    var NavFrame = document.getElementById('NavFrame' + index);
    if (!NavFrame || !NavToggle) return;

    var show = NavToggle.firstChild.data === NavigationBarShow;
    NavToggle.firstChild.data = show ? NavigationBarHide : NavigationBarShow;

    var children = NavFrame.children;
    for (var i = 0; i < children.length; i++) {
        if ($(children[i]).hasClass('NavContent') ||
            $(children[i]).hasClass('NavPic')) {
            children[i].style.display = show ? 'block' : 'none';
        }
    }
    event.preventDefault();
};

mw.hook('wikipage.content').add(function ($content) {
    $content.find('div.NavFrame').each(function () {
        indexNavigationBar++;
        var NavFrame = this;
        var NavHead = $(NavFrame).find('.NavHead').first();
        if (!NavHead.length) return;

        var NavToggle = $('<a href="#" class="NavToggle"></a>')
            .attr('id', 'NavToggle' + indexNavigationBar)
            .text(NavigationBarHide)
            .on('click', function (e) {
                toggleNavigationBar(indexNavigationBar, e);
            });

        NavFrame.id = 'NavFrame' + indexNavigationBar;
        NavHead.append(NavToggle);
    });
});

/* ============================================================
   Collapsible tables
   ============================================================ */
var autoCollapse = 2;
var collapseCaption = 'മറയ്ക്കുക';
var expandCaption = 'പ്രദർശിപ്പിക്കുക';

function collapseTable(tableIndex) {
    var Button = document.getElementById('collapseButton' + tableIndex);
    var Table = document.getElementById('collapsibleTable' + tableIndex);
    if (!Table || !Button) return;

    var Rows = Table.rows;
    var hide = Button.firstChild.data === collapseCaption;

    for (var i = 1; i < Rows.length; i++) {
        Rows[i].style.display = hide ? 'none' : '';
    }
    Button.firstChild.data = hide ? expandCaption : collapseCaption;
}

$(function () {
    var tableIndex = 0;
    $('table.collapsible').each(function () {
        var $table = $(this);
        var $header = $table.find('tr:first th:first');
        if (!$header.length) return;

        $table.attr('id', 'collapsibleTable' + tableIndex);

        var $button = $('<span class="collapseButton">[</span>');
        var $link = $('<a href="#"></a>')
            .attr('id', 'collapseButton' + tableIndex)
            .text(collapseCaption)
            .on('click', function (e) {
                e.preventDefault();
                collapseTable(tableIndex);
            });

        $button.append($link).append(']');
        $header.prepend($button);

        tableIndex++;
    });
});