MediaWiki:Equipment.js

(function() {
    'use strict';
    // 加载 CSS
    mw.loader.load('/index.php?title=MediaWiki:Equipment.css&action=raw&ctype=text/css', 'text/css');
    
    // 装备管理器
    var EquipmentManager = {
        // 固定选项
        areas: ['蓝壶', '双星之影', '雾之都市'],
        rarities: ['蓝', '金', '彩'],
        types: ['武器', '装甲', '戒指'],
        
        // 当前装备数据
        equipmentData: {},
        currentEditItem: null,
        
        // 初始化
        init: function() {
            var container = document.getElementById('equipment-manager');
            if (!container) return;
            
            // 加载CSS
            mw.loader.load(['ext.gadget.Equipment-css']);
            
            this.loadEquipmentData();
            this.render();
            this.bindEvents();
        },
        
        // 加载装备数据
        loadEquipmentData: function() {
            var self = this;
            new mw.Api().get({
                action: 'query',
                prop: 'revisions',
                titles: 'Module:装备/data',
                rvprop: 'content',
                format: 'json'
            }).done(function(data) {
                var pages = data.query.pages;
                for (var pageId in pages) {
                    var content = pages[pageId].revisions[0]['*'];
                    self.parseEquipmentData(content);
                }
                self.renderEquipmentList();
            });
        },
        
        // 解析Lua数据
        parseEquipmentData: function(luaContent) {
            var self = this;
            // 简单的Lua解析器，提取装备数据
            var regex = /equipment$$"([^"]+)"$$\s*=\s*\{([^}]+)\}/g;
            var match;
            
            while ((match = regex.exec(luaContent)) !== null) {
                var name = match[1];
                var dataStr = match[2];
                
                // 解析装备属性
                var equipment = {
                    name: name,
                    id: this.extractValue(dataStr, 'id'),
                    area: this.extractStringValue(dataStr, 'area'),
                    rarity: this.extractStringValue(dataStr, 'rarity'),
                    type: this.extractStringValue(dataStr, 'type'),
                    tag: this.extractStringValue(dataStr, 'tag'),
                    desc: this.extractDescArray(dataStr)
                };
                
                self.equipmentData[name] = equipment;
            }
        },
        
        // 提取数值
        extractValue: function(str, key) {
            var regex = new RegExp(key + '\\s*=\\s*(\\d+)');
            var match = str.match(regex);
            return match ? parseInt(match[1]) : 0;
        },
        
        // 提取字符串值
        extractStringValue: function(str, key) {
            var regex = new RegExp(key + '\\s*=\\s*"([^"]+)"');
            var match = str.match(regex);
            return match ? match[1] : '';
        },
        
        // 提取描述数组
        extractDescArray: function(str) {
            var descMatch = str.match(/desc\s*=\s*\{([^}]+)\}/);
            if (!descMatch) return [];
            
            var descStr = descMatch[1];
            var descs = [];
            var regex = /"([^"]+)"/g;
            var match;
            
            while ((match = regex.exec(descStr)) !== null) {
                descs.push(match[1]);
            }
            
            return descs;
        },
        
        // 渲染界面
        render: function() {
            var container = document.getElementById('equipment-manager');
            
            var html = [
                '<div class="equipment-container">',
                '  <div class="equipment-header">',
                '    <h2>装备管理器</h2>',
                '    <div class="equipment-actions">',
                '      新增装备',
                '    </div>',
                '  </div>',
                '  <div class="equipment-form-container" style="display:none;">',
                '    <h3 class="form-title">新增装备</h3>',
                '    <div class="equipment-form">',
                '      <div class="form-group">',
                '        <label>装备名称：</label>',
                '        <input type="text" class="form-input" id="equipment-name" />',
                '      </div>',
                '      <div class="form-group">',
                '        <label>装备ID：</label>',
                '        <input type="number" class="form-input" id="equipment-id" />',
                '      </div>',
                '      <div class="form-group">',
                '        <label>地区：</label>',
                '        <div class="radio-group">',
                this.areas.map(function(area) {
                    return '<label class="radio-label"><input type="radio" name="equipment-area" value="' + area + '" /> ' + area + '</label>';
                }).join(''),
                '        </div>',
                '      </div>',
                '      <div class="form-group">',
                '        <label>稀有度：</label>',
                '        <div class="radio-group">',
                this.rarities.map(function(rarity) {
                    return '<label class="radio-label"><input type="radio" name="equipment-rarity" value="' + rarity + '" /> ' + rarity + '</label>';
                }).join(''),
                '        </div>',
                '      </div>',
                '      <div class="form-group">',
                '        <label>类型：</label>',
                '        <div class="radio-group">',
                this.types.map(function(type) {
                    return '<label class="radio-label"><input type="radio" name="equipment-type" value="' + type + '" /> ' + type + '</label>';
                }).join(''),
                '        </div>',
                '      </div>',
                '      <div class="form-group">',
                '        <label>标签（用逗号分隔）：</label>',
                '        <input type="text" class="form-input" id="equipment-tag" placeholder="例如: 暴击率提升,获得信用点数" />',
                '      </div>',
                '      <div class="form-group">',
                '        <label>描述（每行一个等级）：</label>',
                '        <textarea class="form-textarea" id="equipment-desc" rows="5" placeholder="每行输入一个等级的描述"></textarea>',
                '      </div>',
                '      <div class="form-actions">',
                '        保存',
                '        取消',
                '      </div>',
                '    </div>',
                '  </div>',
                '  <div class="equipment-list-container">',
                '    <h3>装备列表</h3>',
                '    <div class="equipment-filter">',
                '      <input type="text" class="filter-input" id="equipment-search" placeholder="搜索装备..." />',
                '    </div>',
                '    <div class="equipment-list" id="equipment-list">',
                '      <!-- 装备列表将在这里动态生成 -->',
                '    </div>',
                '  </div>',
                '</div>'
            ].join('');
            
            container.innerHTML = html;
        },
        
        // 渲染装备列表
        renderEquipmentList: function() {
            var listContainer = document.getElementById('equipment-list');
            if (!listContainer) return;
            
            var html = [];
            
            for (var name in this.equipmentData) {
                var equipment = this.equipmentData[name];
                html.push(this.renderEquipmentItem(equipment));
            }
            
            listContainer.innerHTML = html.join('');
        },
        
        // 渲染单个装备项
        renderEquipmentItem: function(equipment) {
            var imageUrl = '/images/' + equipment.id + '.png';
            
            return [
                '<div class="equipment-item" data-name="' + equipment.name + '">',
                '  <div class="equipment-image">',
                '    <img src="' + imageUrl + '" alt="' + equipment.name + '" onerror="this.src=\'/images/default-equipment.png\'" />',
                '  </div>',
                '  <div class="equipment-info">',
                '    <div class="equipment-name">' + equipment.name + '</div>',
                '    <div class="equipment-meta">',
                '      <span class="equipment-rarity rarity-' + equipment.rarity + '">' + equipment.rarity + '</span>',
                '      <span class="equipment-type">' + equipment.type + '</span>',
                '      <span class="equipment-area">' + equipment.area + '</span>',
                '    </div>',
                '    <div class="equipment-tags">' + equipment.tag + '</div>',
                '  </div>',
                '  <div class="equipment-actions">',
                '     + equipment.name + '">编辑',
                '     + equipment.name + '">删除',
                '  </div>',
                '</div>'
            ].join('');
        },
        
        // 绑定事件
        bindEvents: function() {
            var self = this;
            
            // 新增按钮
            $(document).on('click', '.equipment-btn-add', function(e) {
                e.preventDefault();
                self.showForm();
                self.currentEditItem = null;
            });
            
            // 保存按钮
            $(document).on('click', '.equipment-btn-save', function(e) {
                e.preventDefault();
                self.saveEquipment();
            });
            
            // 取消按钮
            $(document).on('click', '.equipment-btn-cancel', function(e) {
                e.preventDefault();
                self.hideForm();
            });
            
            // 编辑按钮
            $(document).on('click', '.action-edit', function(e) {
                e.preventDefault();
                var name = $(this).data('name');
                self.editEquipment(name);
            });
            
            // 删除按钮
            $(document).on('click', '.action-delete', function(e) {
                e.preventDefault();
                var name = $(this).data('name');
                self.deleteEquipment(name);
            });
            
            // 搜索框
            $(document).on('input', '#equipment-search', function() {
                self.filterEquipment($(this).val());
            });
        },
        
        // 显示表单
        showForm: function() {
            $('.equipment-form-container').slideDown();
            this.clearForm();
        },
        
        // 隐藏表单
        hideForm: function() {
            $('.equipment-form-container').slideUp();
            this.clearForm();
        },
        
        // 清空表单
        clearForm: function() {
            $('#equipment-name').val('');
            $('#equipment-id').val('');
            $('#equipment-tag').val('');
            $('#equipment-desc').val('');
            $('input[name="equipment-area"]').prop('checked', false);
            $('input[name="equipment-rarity"]').prop('checked', false);
            $('input[name="equipment-type"]').prop('checked', false);
        },
        
        // 编辑装备
        editEquipment: function(name) {
            var equipment = this.equipmentData[name];
            if (!equipment) return;
            
            this.currentEditItem = name;
            this.showForm();
            $('.form-title').text('编辑装备');
            
            $('#equipment-name').val(equipment.name);
            $('#equipment-id').val(equipment.id);
            $('#equipment-tag').val(equipment.tag);
            $('#equipment-desc').val(equipment.desc.join('\n'));
            $('input[name="equipment-area"][value="' + equipment.area + '"]').prop('checked', true);
            $('input[name="equipment-rarity"][value="' + equipment.rarity + '"]').prop('checked', true);
            $('input[name="equipment-type"][value="' + equipment.type + '"]').prop('checked', true);
        },
        
        // 删除装备
        deleteEquipment: function(name) {
            if (!confirm('确定要删除装备 "' + name + '" 吗？')) return;
            
            delete this.equipmentData[name];
            this.saveLuaData();
            this.renderEquipmentList();
        },
        
        // 保存装备
        saveEquipment: function() {
            var name = $('#equipment-name').val().trim();
            var id = $('#equipment-id').val();
            var area = $('input[name="equipment-area"]:checked').val();
            var rarity = $('input[name="equipment-rarity"]:checked').val();
            var type = $('input[name="equipment-type"]:checked').val();
            var tag = $('#equipment-tag').val().trim();
            var desc = $('#equipment-desc').val().trim().split('\n').filter(function(d) { return d.trim(); });
            
            if (!name || !id || !area || !rarity || !type) {
                alert('请填写所有必填字段');
                return;
            }
            
            var equipment = {
                name: name,
                id: parseInt(id),
                area: area,
                rarity: rarity,
                type: type,
                tag: tag,
                desc: desc
            };
            
            // 如果是编辑模式且名称改变了，需要删除旧的
            if (this.currentEditItem && this.currentEditItem !== name) {
                delete this.equipmentData[this.currentEditItem];
            }
            
            this.equipmentData[name] = equipment;
            this.saveLuaData();
            this.hideForm();
            this.renderEquipmentList();
        },
        
        // 保存到Lua模块
        saveLuaData: function() {
            var luaContent = this.generateLuaContent();
            
            new mw.Api().postWithToken('csrf', {
                action: 'edit',
                title: 'Module:装备/data',
                text: luaContent,
                summary: '通过装备管理器更新装备数据',
                format: 'json'
            }).done(function() {
                mw.notify('装备数据已保存', { type: 'success' });
            }).fail(function() {
                mw.notify('保存失败，请检查权限', { type: 'error' });
            });
        },
        
        // 生成Lua内容
        generateLuaContent: function() {
            var lines = ['local equipment = {}', ''];
            
            for (var name in this.equipmentData) {
                var eq = this.equipmentData[name];
                lines.push('equipment["' + name + '"] = {');
                lines.push('    id = ' + eq.id + ',');
                lines.push('    area = "' + eq.area + '",');
                lines.push('    rarity = "' + eq.rarity + '",');
                lines.push('    type = "' + eq.type + '",');
                lines.push('    tag = "' + eq.tag + '",');
                lines.push('    desc = {');
                
                eq.desc.forEach(function(desc, index) {
                    var comma = index < eq.desc.length - 1 ? ',' : '';
                    lines.push('        "' + desc + '"' + comma);
                });
                
                lines.push('    }');
                lines.push('}');
                lines.push('');
            }
            
            lines.push('return equipment');
            return lines.join('\n');
        },
        
        // 过滤装备
        filterEquipment: function(searchText) {
            var items = document.querySelectorAll('.equipment-item');
            var search = searchText.toLowerCase();
            
            items.forEach(function(item) {
                var name = item.getAttribute('data-name').toLowerCase();
                var info = item.textContent.toLowerCase();
                
                if (name.indexOf(search) !== -1 || info.indexOf(search) !== -1) {
                    item.style.display = '';
                } else {
                    item.style.display = 'none';
                }
            });
        }
    };
    
    // 页面加载完成后初始化
    $(function() {
        if (mw.config.get('wgPageName') === 'Equipment') {
            EquipmentManager.init();
        }
    });
})();