jQuery(function($){
    // refresh interval provided by localized script
    const REFRESH = (typeof mcss_ajax_object !== 'undefined' && mcss_ajax_object.refresh_interval) ? parseInt(mcss_ajax_object.refresh_interval, 10) : 15000;
    const AJAX_URL = (typeof mcss_ajax_object !== 'undefined' && mcss_ajax_object.ajax_url) ? mcss_ajax_object.ajax_url : '/wp-admin/admin-ajax.php';

    function formatTime(ts) {
        const d = new Date(ts * 1000);
        return d.getHours().toString().padStart(2,'0') + ':' + d.getMinutes().toString().padStart(2,'0') + ':' + d.getSeconds().toString().padStart(2,'0');
    }

    function updateCardImmediate($card, data) {
        // top status
        $card.find('.mcss-server-top').removeClass('mcss-online mcss-offline').addClass(data.online ? 'mcss-online' : 'mcss-offline');
        $card.find('.mcss-status-dot').removeClass('online offline').addClass(data.online ? 'online' : 'offline');
        $card.find('.mcss-server-title').text(data.online ? 'Server Online' : 'Server Offline');
        $card.find('.mcss-address').text(data.address || '');

        // IMPORTANT: no leading 'v' — display normalized version as provided by backend
        const ver = (typeof data.version === 'string' && data.version.trim() !== '') ? data.version.trim() : 'Unbekannt';
        $card.find('.mcss-version').text(ver);

        $card.find('.mcss-ping').text((data.ping || 0) + ' ms');

        // defensive players count (data.players might be array of objects or names)
        const playersCount = Array.isArray(data.players) ? data.players.length : 0;
        $card.find('.mcss-players-count').text(playersCount + ' Spieler');

        if (data.motd && data.motd.length > 0) {
            if ($card.find('.mcss-motd').length) {
                $card.find('.mcss-motd').text(data.motd);
            } else {
                $card.find('.mcss-actions').before('<div class="mcss-motd">'+ data.motd +'</div>');
            }
        } else {
            $card.find('.mcss-motd').remove();
        }
        $card.find('.mcss-lastupdate-time').text(formatTime(data.last_update || Math.floor(Date.now()/1000)));

        // players grid: replace
        const $grid = $card.find('.mcss-player-grid');
        $grid.empty();
        if (Array.isArray(data.players) && data.players.length) {
            data.players.forEach(function(p){
                const name = (typeof p === 'string') ? p : (p.name || '');
                const avatar = (typeof p === 'object' && p.avatar) ? p.avatar : (typeof p === 'string' ? ('https://mc-heads.net/avatar/' + encodeURIComponent(name) + '/64') : '');
                const rank = (typeof p === 'object' && p.rank) ? p.rank : '';
                const color = (typeof p === 'object' && p.color) ? p.color : '#6c5ce7';

                const $pc = $('<div class="mcss-player-card"></div>');
                $pc.append('<img src="'+ avatar +'" alt="'+ (name || '') +'" />');
                $pc.append('<div class="mcss-player-name">'+ (name || '') +'</div>');
                $pc.append('<div class="mcss-player-rank" style="color:'+ color +'">'+ rank +'</div>');
                $grid.append($pc);
            });
        } else {
            $grid.append('<div style="grid-column:1/-1;color:#6b7280">Keine Spieler online.</div>');
        }
    }

    function refreshAllCards() {
        $.get(AJAX_URL, { action: 'mcss_fetch' }, function(resp){
            // find all cards (support multiple server cards on a page)
            $('.mcss-server-card').each(function(){
                const $card = $(this);
                // update each card with the fetched data
                updateCardImmediate($card, resp);
            });
        }, 'json');
    }

    // initial auto refresh (only if REFRESH is a positive number)
    if (Number.isFinite(REFRESH) && REFRESH > 0) {
        setInterval(refreshAllCards, REFRESH);
    }

    // delegate update button
    $(document).on('click', '.mcss-refresh-button', function(){
        const $card = $(this).closest('.mcss-server-card');
        $.get(AJAX_URL, { action: 'mcss_fetch' }, function(resp){
            updateCardImmediate($card, resp);
        }, 'json');
    });

    // initial run after load
    $(document).ready(function(){
        refreshAllCards();
    });
});