const
    h = 652,
    w = 412

let nfc = () => {}

const buttons = [
    { x: (w - 75) / 2, y : 350 + 60, h: 50, w: 75, callback: b => {} },
    { x: (w - 75) / 2, y : 350 + 2*60, h: 50, w: 75, callback: b => {} },
    { x: (w - 75) / 2, y : 350 + 3*60, h: 50, w: 75, callback: b => {} }
]

const body = document.getElementsByTagName('body')[0]
const textarea = document.getElementsByTagName('textarea')[0]

buttons.forEach(b => {
    const button = document.createElement('div')
    button.classList.add('button')

    button.style.height = b.h + 'px'
    button.style.width = b.w + 'px'
    button.style.top = b.y + 'px'
    button.style.left = b.x + 'px'

    // button.innerText = b.name

    body.appendChild(button)
    b.button = button

    button.addEventListener('click', () => b.callback(b))
})

const resetButtons = () => {
    buttons.forEach(b => {
        b.button.innerText = ""
        b.callback = () => {
        }
    })
}
const sleep = ms => {
    return new Promise(resolve => setTimeout(resolve, ms));
}

let room = undefined
let device = undefined

const state = newState => {
    resetButtons()
    switch (newState) {
        case 1:
            nfc = () => {}
            // Room
            device = undefined
            textarea.innerHTML = `${room.title}
Devices:
` + room.devices.map((d, i) => `${i===room.i ? ">":" "}- ${d.name}`).join("\n")

            if (room.devices.length > 0) {
                buttons[0].button.innerText = "OK"
                buttons[0].callback = b => {
                    device = room.devices[room.i]
                    state(4)
                }
            }
            if (room.devices.length > 1) {
                buttons[1].button.innerText = '\\/'
                buttons[1].callback = b => {
                    room.i = (room.i + 1) % room.devices.length
                    state(1)
                }
            }
            buttons[2].button.innerText = "<"
            buttons[2].callback = b => {
                state(3)
            }
            break;
        case 2:
            // Room_Standby
            break;
        case 3:
            // Ready
            room = undefined
            textarea.innerHTML = `Ready

Tap NFC...`

            buttons[2].button.innerText = "OFF"
            buttons[2].callback = b => {
                state(0)
            }
            nfc = id => {
                switch (id) {
                    case "4c:67:1f:31":
                        // blue
                        room = {
                            title: "Garten",
                            i: 0,
                            devices: [
                                { name: "Rasensprenger"},
                                { name: "Tor"},
                                { name: "Terassenlicht"},
                                { name: "Ambiente"}
                            ]
                        }
                        state(1)
                        break;
                    case "da:10:15:bf":
                        // card
                        room = {
                            title: "Hörsaal I012",
                            i: 0,
                            devices: [
                                { name: "Beamer"},
                                { name: "Licht vorne"},
                                { name: "Licht Raum"},
                                { name: "Soundanlage"}
                            ]
                        }
                        state(1)
                        break;
                    default:
                        textarea.innerHTML = `Ready

Tap NFC...

Unknown Card`
                        nfc = () => {}
                        sleep(1000)
                            .then(() => state(3))
                }
            }
            break;
        case 4:
            // Device
            textarea.innerHTML = `${room.title} - ${device.name}

`
            buttons[2].button.innerText = "<"
            buttons[2].callback = b => {
                state(1)
            }
            break;
        case 0:
        default:
            // Standby
            // Display aus
            textarea.innerHTML = ""

            // mqtt disconnect
            // wifi disconnect

            // nfc aus
            nfc = () => {}

            buttons[0].button.innerText = "ON"
            buttons[0].callback = b => {
                state(3)
            }
            break;
    }
}

state(0);

(async () => {
    try {
        const ndef = new NDEFReader();
        await ndef.scan();
        console.log("> Scan started");

        ndef.addEventListener("readingerror", () => {
            console.log("Argh! Cannot read data from the NFC tag. Try another one?");
        });

        ndef.addEventListener("reading", ({ message, serialNumber }) => {
            console.log(`> Serial Number: ${serialNumber}`);
            console.log(`> Records: (${message.records.length})`);

            nfc(serialNumber)
        });
    } catch (error) {
        console.log("Argh! " + error);
    }
})()