import './bootstrap';
import Alpine from 'alpinejs';

window.Alpine = Alpine;
Alpine.start();

// ─── Global helpers ────────────────────────────────────────────────────────

/**
 * Format ELO change with sign and colour class.
 */
window.formatElo = (change) => {
    if (change > 0) return { text: `+${change}`, cls: 'text-emerald-400' };
    if (change < 0) return { text: `${change}`, cls: 'text-red-400' };
    return { text: '0', cls: 'text-gray-400' };
};

/**
 * Map ELO to division object { name, badgeClass, icon }.
 */
window.getDivision = (elo) => {
    if (elo >= 2500) return { name: 'Legend',   badge: 'badge-legend',  icon: '👑' };
    if (elo >= 2200) return { name: 'Master',   badge: 'badge-master',  icon: '💎' };
    if (elo >= 1900) return { name: 'Diamond',  badge: 'badge-diamond', icon: '🔷' };
    if (elo >= 1600) return { name: 'Platinum', badge: 'badge-plat',    icon: '🔵' };
    if (elo >= 1300) return { name: 'Gold',     badge: 'badge-gold',    icon: '🥇' };
    if (elo >= 1000) return { name: 'Silver',   badge: 'badge-silver',  icon: '🥈' };
    return               { name: 'Bronze',   badge: 'badge-bronze',  icon: '🥉' };
};

/**
 * Matchmaking countdown timer — shared Alpine component.
 */
window.matchmakingTimer = () => ({
    seconds: 0,
    interval: null,
    start() {
        this.interval = setInterval(() => this.seconds++, 1000);
    },
    stop() {
        clearInterval(this.interval);
        this.seconds = 0;
    },
    get formatted() {
        const m = String(Math.floor(this.seconds / 60)).padStart(2, '0');
        const s = String(this.seconds % 60).padStart(2, '0');
        return `${m}:${s}`;
    },
});
