MenelGame - Interface Tweaks

Poprawki wizualne interfejsu - Skróty 20% poniżej Timerów + Koszty atrybutów PVP

Você precisará instalar uma extensão como Tampermonkey, Greasemonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Userscripts para instalar este script.

Você precisará instalar uma extensão como o Tampermonkey para instalar este script.

Você precisará instalar um gerenciador de scripts de usuário para instalar este script.

(Eu já tenho um gerenciador de scripts de usuário, me deixe instalá-lo!)

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

(Eu já possuo um gerenciador de estilos de usuário, me deixar fazer a instalação!)

// ==UserScript==
// @name         MenelGame - Interface Tweaks
// @namespace    https://greasyfork.org/en/scripts/575758-menelgame-interface-tweaks
// @version      2.5.2
// @description  Poprawki wizualne interfejsu - Skróty 20% poniżej Timerów + Koszty atrybutów PVP
// @author       Arctos + Gemini + DeepSeek
// @match        *://*.menelgame.online/*
// @grant        none
// @run-at       document-start
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';

    const css = `
        .equipment-tabs { margin-bottom: 0px !important; }
        .equipment-presets-section { margin-top: 0px !important; }
        .equipment-slot-row.row-hustling {
            display: block !important;
            text-align: center !important;
            width: 100% !important;
            overflow: visible !important;
            clear: both !important;
            margin-top: -65px !important; 
            position: relative !important;
            z-index: 10 !important;
            line-height: 0 !important;
            pointer-events: none !important; 
        }
        .equipment-slot-row.row-hustling .equipment-slot {
            display: inline-block !important;
            float: none !important;
            position: relative !important;
            margin: 0 1% !important;
            vertical-align: top !important;
            pointer-events: auto !important; 
        }
        .equipment-slot-row.row-hustling .equipment-slot:nth-child(1),
        .equipment-slot-row.row-hustling .equipment-slot:nth-child(2) {
            left: -14% !important;
        }
        .equipment-slot-row.row-hustling .equipment-slot:nth-child(3),
        .equipment-slot-row.row-hustling .equipment-slot:nth-child(4) {
            left: 14% !important;
        }
        .equipment-slot { z-index: 5 !important; pointer-events: auto !important; }
        [title*="buty"], [title*="Buty"], .equipment-slot { pointer-events: auto !important; }
        .avatar-jacket-badge { width: 48px !important; height: 48px !important; }
        .avatar-jacket-icon { width: 100% !important; height: 100% !important; }
        div[style*="background-color: rgba(74, 58, 42, 0.9)"] {
            justify-content: flex-start !important;
            gap: 10px !important;
        }
        div[style*="background-color: rgba(74, 58, 42, 0.9)"] > div:nth-child(2) {
            margin-left: auto !important;
        }
        .timers-pull-tab {
            width: 35px !important; 
            transition: none !important;
            box-shadow: -3px 0 10px rgba(0,0,0,0.5) !important;
        }
        .shortcuts-pull-tab {
            width: 35px !important;
            transition: none !important;
            box-shadow: -3px 0 10px rgba(0,0,0,0.5) !important;
            top: 50% !important; 
            bottom: auto !important;
            transform: translateY(-50%) !important;
            border-radius: 8px 0 0 8px !important;
        }
        .timers-pull-tab:hover, .shortcuts-pull-tab:hover {
            width: 35px !important;
            background: linear-gradient(135deg, #a67c52, #8b5a2b) !important;
        }
        .timers-pull-tab-arrow, .shortcuts-pull-tab-icon {
            font-size: 18px !important;
            font-weight: bold !important;
        }
        .pvp-attribute-cost-info {
            color: #000000 !important;
            font-weight: bold;
            font-size: 12px;
            padding: 2px 5px;
            border-radius: 4px;
            display: inline-block;
            margin-left: auto !important;
            margin-right: 10% !important;
        }
        .pvp-attribute-row[data-attr-type="str"] .pvp-attribute-cost-info { background: rgba(192, 57, 43, 0.4); }
        .pvp-attribute-row[data-attr-type="end"] .pvp-attribute-cost-info { background: rgba(127, 140, 141, 0.4); }
        .pvp-attribute-row[data-attr-type="agi"] .pvp-attribute-cost-info { background: rgba(39, 174, 96, 0.4); }
        .pvp-attribute-row[data-attr-type="vit"] .pvp-attribute-cost-info { background: rgba(231, 76, 60, 0.4); }
        .pvp-attribute-row[data-attr-type="prc"] .pvp-attribute-cost-info { background: rgba(243, 156, 18, 0.4); }
    `;

    const addStyle = () => {
        if (document.getElementById('menel-tweaks-style')) return;
        const style = document.createElement('style');
        style.id = 'menel-tweaks-style';
        style.textContent = css;
        (document.head || document.documentElement).appendChild(style);
    };

    const costTable = { 0: 15, 5: 40, 10: 65, 15: 90, 20: 115, 25: 140, 30: 165, 35: 190, 40: 215, 45: 240 };

    function getCostForLevel(level) {
        const thresholds = Object.keys(costTable).map(Number).sort((a,b) => a-b);
        for (let i = thresholds.length - 1; i >= 0; i--) {
            if (level >= thresholds[i]) return costTable[thresholds[i]];
        }
        return costTable[0];
    }

    function getAttributeType(row) {
        const img = row.querySelector('img[alt]');
        if (!img) return 'unknown';
        const alt = img.getAttribute('alt');
        if (alt === 'STR') return 'str';
        if (alt === 'END') return 'end';
        if (alt === 'AGI') return 'agi';
        if (alt === 'VIT') return 'vit';
        if (alt === 'PRC') return 'prc';
        return 'unknown';
    }

    function addCostInfoToAttributeRow(row) {
        // Szukamy span z wartością atrybutu
        const valueSpan = row.querySelector('div[style*="flex: 1"] div:first-child span:last-child');
        if (!valueSpan) return;
        
        const value = parseInt(valueSpan.textContent);
        if (isNaN(value)) return;
        
        const nextCost = getCostForLevel(value);
        
        // Sprawdzamy czy już dodaliśmy info
        if (row.querySelector('.pvp-attribute-cost-info')) return;
        
        // USUWAMY ORYGINALNĄ STRZAŁKĘ ›
        const originalArrow = row.querySelector('div[style*="color: rgb(160, 144, 128)"]');
        if (originalArrow && originalArrow.textContent.includes('›')) {
            originalArrow.remove();
        }
        
        // Określamy typ atrybutu
        const attrType = getAttributeType(row);
        row.setAttribute('data-attr-type', attrType);
        
        // Tworzymy kontener na koszt + ikonkę + strzałkę
        const costContainer = document.createElement('span');
        costContainer.className = 'pvp-attribute-cost-info';
        costContainer.title = `Koszt podbicia z ${value} na ${value+1}`;
        
        // Dodajemy koszt (liczbę)
        const costValue = document.createTextNode(`${nextCost} `);
        costContainer.appendChild(costValue);
        
        // Dodajemy ikonkę waluty (pomniejszona)
        const currencyIcon = document.createElement('img');
        currencyIcon.src = 'https://menelgame.online/images/icons/premium.png';
        currencyIcon.style.width = '12px';
        currencyIcon.style.height = '12px';
        currencyIcon.style.verticalAlign = 'middle';
        currencyIcon.style.marginRight = '2px';
        costContainer.appendChild(currencyIcon);
        
        // Dodajemy strzałkę w lewo
        const arrowSpan = document.createTextNode(' ←');
        costContainer.appendChild(arrowSpan);
        
        // Wstawiamy przed wartością
        valueSpan.insertAdjacentElement('beforebegin', costContainer);
    }

    function processPVPPage() {
        if (!window.location.href.includes('/pvp') && !document.querySelector('.pvp-attribute-row')) {
            return;
        }
        document.querySelectorAll('.pvp-attribute-row').forEach(row => addCostInfoToAttributeRow(row));
    }

    addStyle();
    
    const observer = new MutationObserver(() => {
        if (!document.getElementById('menel-tweaks-style')) addStyle();
        if (window.location.href.includes('/pvp') || document.querySelector('.pvp-attribute-row')) {
            processPVPPage();
        }
    });
    observer.observe(document.documentElement, { childList: true, subtree: true });
    
    window.addEventListener('DOMContentLoaded', () => {
        addStyle();
        processPVPPage();
    });
    
    if (document.readyState !== 'loading') processPVPPage();
})();