text spawner 0.2

// --- SAFETY CHECK AND DUMMY CURSOR ---
if (typeof w === "undefined") w = { cursors: new Map() }
if (!w.cursors) w.cursors = new Map()
if (w.cursors.size === 0) {
    w.cursors.set("test123", { n: "TestCursor", rawx: 50, rawy: 10, c: 1 })
}

// --- CREATE HUD ---
if (!document.getElementById('cursorTextHUD')) {
    const hud = document.createElement('div')
    hud.id = 'cursorTextHUD'
    hud.style.cssText = `
        position: fixed;
        top: 20px;
        left: 20px;
        width: 340px;
        padding: 10px;
        background: rgba(0,0,0,0.85);
        color: white;
        font-family: monospace;
        border-radius: 8px;
        z-index: 9999;
        cursor: move;
    `

    hud.innerHTML = `
        <div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:5px;">
            <strong>Cursor Text HUD</strong>
            <button id="hudCloseBtn" style="background:red;color:white;border:none;border-radius:3px;cursor:pointer;">X</button>
        </div>

        <div>
            <label>Choose Cursor (or leave blank for all):</label><br/>
            <select id="hudCursorSelect" style="width:100%"></select>
        </div>

        <div style="margin-top:5px;">
            <label>Text (max 180 chars):</label><br/>
            <input type="text" id="hudCursorText" maxlength="180" style="width:100%">
        </div>

        <div style="margin-top:5px;">
            <label><input type="checkbox" id="hudFollowCursor"> Follow Cursor</label>
        </div>

        <button id="hudSpawnText" style="margin-top:5px;width:100%">Spawn Text</button>
    `
    document.body.appendChild(hud)
}

// --- ELEMENT REFERENCES ---
const hud = document.getElementById("cursorTextHUD")
const select = document.getElementById("hudCursorSelect")
const input = document.getElementById("hudCursorText")
const followToggle = document.getElementById("hudFollowCursor")

// --- POPULATE CURSOR DROPDOWN (sticky selection) ---
function updateOptions() {
    const currentSelection = select.value
    select.innerHTML = '<option value="">All Cursors</option>'
    for (const [id, c] of w.cursors) {
        const option = document.createElement('option')
        option.value = id
        option.textContent = `${c.n} (${id})`
        select.appendChild(option)
    }
    if ([...w.cursors.keys()].includes(currentSelection) || currentSelection === "") {
        select.value = currentSelection
    } else {
        select.value = ""
    }
}
updateOptions()
setInterval(updateOptions, 2000)

// --- TRACK FOLLOWING TEXT ---
const followingTexts = [] // each: {text, cursorId, offsetX, offsetY, prevPositions: []}

// --- HELPER FUNCTION TO WRITE CENTERED AND TRACK POSITIONS ---
function writeCenteredFollow(followObj) {
    const c = w.cursors.get(followObj.cursorId)
    if (!c) return

    const chars = [...followObj.text]
    const startX = c.rawx - Math.floor(chars.length / 2) + (followObj.offsetX || 0)
    const y = c.rawy + (followObj.offsetY || 0)

    // Erase previous text
    if (followObj.prevPositions) {
        for (const pos of followObj.prevPositions) {
            writeCharAt(' ', c.c ?? 0, pos.x, pos.y)
        }
    }

    // Write new text and store positions
    followObj.prevPositions = []
    for (let i = 0; i < chars.length; i++) {
        writeCharAt(chars[i], c.c ?? 0, startX + i, y)
        followObj.prevPositions.push({x: startX + i, y})
    }
}

// --- LIVE TYPING ---
input.addEventListener("input", () => {
    const text = input.value.slice(0, 180)
    const cursorId = select.value.trim()
    if (!cursorId) return
    if (!text) return

    // Check if a follow object already exists
    let followObj = followingTexts.find(f => f.cursorId === cursorId)
    if (!followObj) {
        followObj = { text, cursorId, offsetX: 0, offsetY: 0, prevPositions: [] }
        followingTexts.push(followObj)
    } else {
        followObj.text = text
    }

    // Only track following if toggle is on
    followObj.follow = followToggle.checked

    writeCenteredFollow(followObj)
})

// --- SPAWN TEXT BUTTON ---
document.getElementById("hudSpawnText").onclick = () => {
    const cursorId = select.value.trim()
    const text = input.value.slice(0, 180)

    if (!text) return alert("Enter some text!")

    let cursors = []
    if (!cursorId) {
        cursors = [...w.cursors.values()]
    } else {
        const cById = w.cursors.get(cursorId)
        if (cById) cursors.push(cById)
    }

    if (cursors.length === 0) return alert("No valid cursors found!")

    for (const c of cursors) {
        writeCenteredFollow({ text, cursorId: [...w.cursors].find(([k,v]) => v===c)[0], offsetX:0, offsetY:0, prevPositions:[] })
    }
}

// --- CLOSE BUTTON ---
document.getElementById("hudCloseBtn").onclick = () => {
    document.getElementById("cursorTextHUD").remove()
}

// --- MAKE HUD DRAGGABLE ---
let isDragging = false, offsetX = 0, offsetY = 0
hud.addEventListener("mousedown", e => {
    if (e.target.closest("input, select, button")) return
    isDragging = true
    offsetX = e.clientX - hud.offsetLeft
    offsetY = e.clientY - hud.offsetTop
    e.preventDefault()
})
document.addEventListener("mousemove", e => {
    if (!isDragging) return
    hud.style.left = `${e.clientX - offsetX}px`
    hud.style.top = `${e.clientY - offsetY}px`
})
document.addEventListener("mouseup", () => isDragging = false)

// --- FOCUS INPUT ON OPEN ---
input.focus()

// --- UPDATE FOLLOWING TEXT EACH FRAME ---
setInterval(() => {
    for (const f of followingTexts) {
        if (f.follow) writeCenteredFollow(f)
    }
}, 50)