Raw Source Toggle Dropdown

• Minified Source

brother-torn / Easy Fight (Brother version)

// ==UserScript==
// @name        Easy Fight (Brother version)
// @namespace   seintz.torn.easy-fight
// @version     1.0
// @description move start fight and outcome button for easy click. Includes All-in-One and specific weapon options.
// @author      seintz [2460991], Finaly [2060206], Anxiety [2149726], Brother [2590792]
// @run-at      document-end
// @match       https://www.torn.com/loader.php?sid=attack*
// @grant       GM_addStyle
// @grant       GM_setValue
// @grant       GM_getValue
// @grant       GM_xmlhttpRequest
// @license     AGPL-3.0-only
// @updateURL   https://openuserjs.org/meta/brother-torn/Easy_Fight_(Brother_version).meta.js
// ==/UserScript==

var outcome = GM_getValue("outcome", "leave");
var defaultWeapon = GM_getValue("defaultWeapon", "all");
var useTemp = GM_getValue("useTemp", true);

function injectUI() {
    if (document.getElementById('parameterUI')) return;
    const uiHTML = `
        <div id="parameterUI" style="position: fixed; top: 210px; left: 10px; z-index: 999; background-color: #333; color: white; padding: 10px; border: 2px solid #555; border-radius: 5px; font-family: Arial, sans-serif;">
            <div style="margin-bottom: 10px;">
                <label for="outcomeSelect" style="display: block; margin-bottom: 5px;">Attack Outcome:</label>
                <select id="outcomeSelect" style="width: 100%; padding: 5px;">
                    <option value="leave">Leave</option>
                    <option value="mug">Mug</option>
                    <option value="hosp">Hospitalize</option>
                </select>
            </div>
            <div style="margin-bottom: 10px;">
                <label for="weaponSelect" style="display: block; margin-bottom: 5px;">Weapon Button Style:</label>
                <select id="weaponSelect" style="width: 100%; padding: 5px;">
                    <option value="all">All-in-One</option>
                    <option value="primary">Primary</option>
                    <option value="secondary">Secondary</option>
                    <option value="melee">Melee</option>
                </select>
            </div>
            <div>
                <label for="useTempCheckbox" style="display: flex; align-items: center;">
                    <input type="checkbox" id="useTempCheckbox" style="margin-right: 5px;"> Use Temporary
                </label>
            </div>
        </div>
    `;
    const uiContainer = document.createElement('div');
    uiContainer.innerHTML = uiHTML;
    document.body.appendChild(uiContainer);
    document.getElementById('outcomeSelect').value = outcome;
    document.getElementById('weaponSelect').value = defaultWeapon;
    document.getElementById('useTempCheckbox').checked = useTemp;
    document.getElementById('outcomeSelect').addEventListener('change', () => { GM_setValue("outcome", document.getElementById('outcomeSelect').value); location.reload(); });
    document.getElementById('weaponSelect').addEventListener('change', () => { GM_setValue("defaultWeapon", document.getElementById('weaponSelect').value); location.reload(); });
    document.getElementById('useTempCheckbox').addEventListener('change', () => { GM_setValue("useTemp", document.getElementById('useTempCheckbox').checked); location.reload(); });
}

const buttonContainerSelector = 'div[class^="dialogButtons___"]';
const storage = {
    selectedIndex: { leave: 0, mug: 1, hosp: 2 }[outcome]
};

function moveButton() {
    const optionsDialogBox = document.querySelector(buttonContainerSelector);
    if (!optionsDialogBox || optionsDialogBox.dataset.processed) return;

    const buttons = optionsDialogBox.children;
    let isOutcomeScreen = false;

    for (const button of buttons) {
        const text = button.innerText.toLowerCase();
        if (text === 'leave' || text === 'mug' || text === 'hospitalize') {
            isOutcomeScreen = true;
            break;
        }
    }

    for (const option of buttons) {
        const text = option.innerText.toLowerCase();
        const index = [...option.parentNode.children].indexOf(option);

        // MODIFIED: Only move the selected button. We removed the "else if" block that hid the others.
        if (text.includes("fight") || storage.selectedIndex === index) {
            option.classList.add("btn-move");
            applySelectedStyle();
        } 
        // Logic to hide other buttons was removed here.
    }

    if (isOutcomeScreen) {
        optionsDialogBox.dataset.processed = 'true';
    }
}

function applySelectedStyle() {
    if (defaultWeapon === 'all') {
        applyCoverallStyle();
    } else {
        calculateStyle(defaultWeapon, useTemp);
    }
}

function restyleCSS(topMobile, topTablet, topDesktop) {
    const size = window.innerWidth;
    const mobileSize = 600, tabletSize = 1000;
    const leftMobile = "-100px", leftTablet = "-140px", leftDesktop = "-150px";
    let myTop = (size <= mobileSize) ? topMobile : (size <= tabletSize) ? topTablet : topDesktop;
    let myLeft = (size <= mobileSize) ? leftMobile : (size <= tabletSize) ? leftTablet : leftDesktop;

    GM_addStyle(`
        div[class^="dialogButtons___"] > button[class*="btn-move"] {
            position: absolute; left: ${myLeft}; top: ${myTop}; height: 60px; width: 120px;
        }
        .playerWindow___aDeDI { overflow: visible !important; }
        .modelWrap___j3kfA { visibility: visible !important; width: 322px !important; }
    `);
}

function calculateStyle(weapon, useTemporary) {
    let topMobile, topTablet, topDesktop;
    if (useTemporary) {
        topMobile = `192.5px`; topTablet = `297.5px`; topDesktop = `297.5px`;
    } else {
        switch (weapon) {
            case "primary": topMobile = `10px`; topTablet = `10px`; topDesktop = `10px`; break;
            case "secondary": topMobile = `75px`; topTablet = `110px`; topDesktop = `110px`; break;
            case "melee": topMobile = `140px`; topTablet = `210px`; topDesktop = `210px`; break;
        }
    }
    restyleCSS(topMobile, topTablet, topDesktop);
}

function applyCoverallStyle() {
    const size = window.innerWidth;
    const mobileSize = 600, tabletSize = 1000;
    const leftMobile = "-100px", leftTablet = "-140px", leftDesktop = "-150px";
    const heightMobile = "245px", heightTabletDesktop = "350px";
    let myLeft = (size <= mobileSize) ? leftMobile : (size <= tabletSize) ? leftTablet : leftDesktop;
    let myHeight = (size <= mobileSize) ? heightMobile : heightTabletDesktop;

    GM_addStyle(`
        div[class^="dialogButtons___"] > button[class*="btn-move"] {
            position: absolute; left: ${myLeft}; top: 10px; height: ${myHeight}; width: 120px;
            opacity: 0.8; font-size: 24px;
        }
        .playerWindow___aDeDI { overflow: visible !important; }
        .modelWrap___j3kfA { visibility: visible !important; width: 322px !important; }
    `);
}

const observer = new MutationObserver(moveButton);
observer.observe(document.body, { childList: true, subtree: true });

window.addEventListener("resize", moveButton);
window.addEventListener('load', () => {
    injectUI();
    moveButton();
});