diff --git a/js/admin.js b/js/admin.js new file mode 100644 index 0000000..e3890ef --- /dev/null +++ b/js/admin.js @@ -0,0 +1,79 @@ +jQuery(function($){ + // Ränge Editor + let raw = $('#mcss_ranks_json').val(); + let ranks = []; + try { ranks = JSON.parse(raw || '[]'); } catch(e) { ranks = []; } + + function renderRanks() { + let container = $('#mcss-ranks-editor'); + container.empty(); + ranks.forEach(function(r, i){ + let row = $('
'); + row.append(''); + row.append(''); + row.append(''); + row.append(''); + container.append(row); + }); + container.append('

'); + syncRanks(); + } + + function syncRanks() { + $('#mcss-ranks-editor .mcss-rank-row').each(function(i){ + ranks[i].name = $(this).find('.mcss-rank-name').val(); + ranks[i].groups = $(this).find('.mcss-rank-groups').val(); + ranks[i].color = $(this).find('.mcss-rank-color').val(); + }); + $('#mcss_ranks_json').val(JSON.stringify(ranks)); + } + + $(document).on('click', '#mcss-add-rank', function(){ + ranks.push({name:'Neuer Rang', groups:'', color:'#6c5ce7'}); + renderRanks(); + }); + $(document).on('click', '.mcss-remove-rank', function(){ + let idx = $(this).closest('.mcss-rank-row').data('idx'); + ranks.splice(idx, 1); + renderRanks(); + }); + $(document).on('input', '.mcss-rank-name, .mcss-rank-groups, .mcss-rank-color', syncRanks); + + // Logo Uploader + var mediaUploader; + $('#mcss_upload_logo_button').on('click', function(e) { + e.preventDefault(); + if (mediaUploader) { mediaUploader.open(); return; } + mediaUploader = wp.media({ + title: 'Server Logo auswählen', + button: { text: 'Als Logo verwenden' }, + multiple: false + }); + mediaUploader.on('select', function() { + var attachment = mediaUploader.state().get('selection').first().toJSON(); + $('#mcss_server_logo_id').val(attachment.id); + $('#mcss_server_logo_url').val(''); + $('#mcss-logo-preview img').attr('src', attachment.url); + $('#mcss_remove_logo_button').show(); + }); + mediaUploader.open(); + }); + + $('#mcss_remove_logo_button').on('click', function() { + $('#mcss_server_logo_id').val('0'); + $('#mcss_server_logo_url').val(''); + $('#mcss-logo-preview img').attr('src', 'img/default-server-logo.png'); + $(this).hide(); + }); + + $('#mcss_server_logo_url').on('input', function() { + var url = $(this).val().trim(); + if (url) { + $('#mcss-logo-preview img').attr('src', url); + $('#mcss_server_logo_id').val('0'); + $('#mcss_remove_logo_button').show(); + } + }); + + renderRanks(); +}); \ No newline at end of file diff --git a/js/mcss-frontend.js b/js/mcss-frontend.js new file mode 100644 index 0000000..0407bb7 --- /dev/null +++ b/js/mcss-frontend.js @@ -0,0 +1,88 @@ +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('
'+ data.motd +'
'); + } + } 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 = $('
'); + $pc.append(''+ (name || '') +''); + $pc.append('
'+ (name || '') +'
'); + $pc.append('
'+ rank +'
'); + $grid.append($pc); + }); + } else { + $grid.append('
Keine Spieler online.
'); + } + } + + 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(); + }); +});