import * as Components from './components/index.js'
const { Transform, Camera, Renderable, Sprite } = Components
import { Renderer2D } from './render/index.js'
import { addEntity, addComponent, createWorld, set, observe, onSet } from '../public/vendor/bitecs/index.js'

const canvas = document.querySelector('main canvas')
const addComponents = (world, entity, components) => {
    components.forEach(component => addComponent(world, entity, component))
}

const setData = (component, eid, data) => {
    const entries = Object.entries(data)
    if (Array.isArray(data) || ArrayBuffer.isView(data) || entries.length === 0) {
        component[eid] = data
    } else {
        entries.forEach(([key, value]) => setData(component[key], eid, value))
    }
}

if (canvas.getContext) {
    const world = createWorld()

    Object.values(Components).forEach(component => {
        observe(world, onSet(component), (eid, params) => {
            setData(component, eid, params)
        })
    })

    const camera = addEntity(world)
    addComponents(world, camera, [
        Transform,
        set(Camera, { viewport: { position: { x: 16, y: 16 } } })
    ])

    const obj = addEntity(world)

    const pixels = new Uint8ClampedArray(64 * 64 * 4)
    for (let i = 0; i < pixels.length; i += 4) {
        pixels[i + 0] = 255
        pixels[i + 3] = 255
    }

    addComponents(world, obj, [
        Renderable,
        set(Transform, { translation: { x: 32, y: 32 } }),
        set(Sprite, {
            data: pixels,
            width: 64,
            height: 64
        })
    ])

    const renderer = Renderer2D(canvas)
    renderer(world)
} else {
    // canvas not supported
}