import cc from 'color-convert'
import getTheme from './index'

const theme = getTheme()
const colors = [
  { v4: 'red', v5: 'darkorchid' },
  { v4: 'orange', v5: 'green' },
  { v4: 'yellow', v5: 'firebrick' },
  { v4: 'green', v5: 'blue' },
  { v4: 'blue', v5: 'purple' },
  { v4: 'purple', v5: 'brown' },
] as const

export default class ColorRotator {
  _index = 0

  getNext() {
    /* In v5 ui, the theme colors aren't present in the DOM as CSS variables, so we
     * have to use hex values directly */
    const colorEntry = colors[this._index % colors.length]
    const color = window.BRIGHTSPOT?.ui.cms.enableV5UI
      ? cc.keyword.hex(colorEntry.v5)
      : theme.getColor(colorEntry.v4, 5)

    const [h, s, l] = cc.hex.hsl(color)
    return `#${cc.hsl.hex([
      h + Math.floor(this._index++ / colors.length) * 20,
      s,
      l,
    ])}`
  }
}
