Dateien nach "js" hochladen

2025-11-22 16:56:12 +00:00
parent 0ad7e563ad
commit e894e952cf
2 changed files with 167 additions and 0 deletions
--- a/js/admin.js
+++ 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 = $('<div class="mcss-rank-row" data-idx="'+i+'" style="display:flex;gap:8px;margin-bottom:8px;align-items:center;"></div>');
+            row.append('<input class="mcss-rank-name" placeholder="Rangname" style="width:140px;" value="'+ (r.name || '') +'"/>');
+            row.append('<input class="mcss-rank-groups" placeholder="LuckPerms Gruppen (kommagetrennt)" style="width:320px;" value="'+ (r.groups || '') +'"/>');
+            row.append('<input class="mcss-rank-color" type="color" value="'+ (r.color || '#6c5ce7') +'" />');
+            row.append('<button type="button" class="button mcss-remove-rank">Entfernen</button>');
+            container.append(row);
+        });
+        container.append('<p><button type="button" id="mcss-add-rank" class="button">Rang hinzufügen</button></p>');
+        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', '<?php echo MCSS_URL; ?>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();
+});