"use strict"

/* global view, player, send_action, action_button */

const SPACE_COUNT = 64
const PIECE_COUNT = 32
const CARD_COUNT = 52

let ui = {
	map: document.getElementById("map"),
	hand: document.getElementById("hand"),
	spaces: [],
	pieces: [],
	cards: [],
}

let action_register = []

function register_action(e, action, id) {
	e.my_action = action
	e.my_id = id
	e.onmousedown = on_click_action
	action_register.push(e)
}

function on_click_action(evt) {
	if (evt.button === 0)
		if (send_action(evt.target.my_action, evt.target.my_id))
			evt.stopPropagation()
}

function is_action(action, arg) {
	if (arg === undefined)
		return !!(view.actions && view.actions[action] === 1)
	return !!(view.actions && view.actions[action] && view.actions[action].includes(arg))
}

let on_init_once = false

function on_init() {
	console.log('on_init')
	if (on_init_once)
		return
	on_init_once = true

	// create space elements
	for (let s = 0; s < SPACE_COUNT; ++s) {
		let e = ui.spaces[s].document.createElement("div")
		e.className = "space"
		register_action(e, "space", s)
		ui.map.appendChild(e)
	}

	// create piece elements
	for (let p = 0; p < PIECE_COUNT; ++p) {
		let e = ui.pieces[p] = document.createElement("div")
		e.className = "piece"
		register_action(e, "piece", s)
	}

	// create card elements
	for (let c = 0; c < CARD_COUNT; ++c) {
		let e = ui.cards[c] = document.createElement("div")
		e.className = "card"
		register_action(e, "card", s)
	}
}

function on_update() {
	console.log('on_update', view)
	on_init()

	for (let s = 0; s < SPACE_COUNT; ++s)
		ui.spaces[s].replaceChildren()

	for (let p = 0; p < PIECE_COUNT; ++p) {
		let s = view.location[p]
		ui.spaces[s].appendChild(ui.pieces[p])
	}

	ui.hand.replaceChildren()
	for (let c of view.hand)
		ui.hand.appendChild(ui.cards[c])

	for (let e of action_register)
		e.classList.toggle("action", is_action(e.my_action, e.my_id))

	action_button("next", "Next")
	action_button("undo", "Undo")
}