import { Graphics, Container } from 'pixi.js'
import type { TileDto } from './interfaces'

export function getColorBackground(container: Container, colorName: string, alpha: number = 0.5) {
  const graphics = new Graphics()
  const color = 0xffffff
  graphics.rect(0, 0, container.width, container.height)
  graphics.fill(color)
  graphics.alpha = alpha
  graphics.x = 0
  graphics.y = 0
  return graphics
}

interface ContainerOptions {
  width?: number
  height?: number
  x?: number
  y?: number
  color?: number
  visible?: boolean
  parent?: Container
}

const defaultContainerOptions = {
  width: 100,
  height: 100,
  x: 0,
  y: 0,
  visible: true
}

export function createContainer(options: ContainerOptions) {
  const opts = { ...defaultContainerOptions, ...options }
  const container = new Container()

  const rect = new Graphics().rect(opts.x, opts.y, opts.width, opts.height)

  if (opts.color) {
    rect.fill(opts.color)
  }
  rect.visible = opts.visible
  container.addChild(rect)
  if (opts.parent) {
    opts.parent.addChild(container)
  }
  return container
}

export async function wait(ms: number) {
  return new Promise((resolve) => setTimeout(resolve, ms))
}

export const DIRECTIONS = ['north', 'east', 'south', 'west']

export function isTilePair(tile: TileDto): boolean {
  return !!(tile.pips && tile.pips[0] === tile.pips[1])
}

export function isTileVertical(tile: TileDto): boolean {
  return tile.orientation === 'north' || tile.orientation === 'south'
}