// OT-MMO: bola de cristal (game_bola.lua). Estilo VALDREN: ValdrenVentana y ValdrenBoton, importados de
// /game_viaje/valdren. Oro #C7A86B solo en lo que se pulsa; el nombre de quien transmite en oro claro.

BolaEtiqueta < Label
  ttf-font: geist
  ttf-font-size: 11
  color: #9AA7AE
  text-auto-resize: true

BolaBotonSec < UIButton
  height: 30
  ttf-font: geistsemibold
  ttf-font-size: 13
  color: #E8D3A2
  background-color: alpha
  border-width: 1
  border-color: #C7A86B80
  width: 110
  click-sound: 2774

  $hover !disabled:
    background-color: #C7A86B1F
    border-color: #C7A86B

  $pressed !disabled:
    text-offset: 0 1

  $disabled:
    color: #9AA7AE80
    border-color: #39444C

BolaBotonTexto < UIButton
  height: 24
  ttf-font: geist
  ttf-font-size: 12
  color: #9AA7AE
  background-color: alpha
  text-auto-resize: true
  padding-left: 6
  padding-right: 6

  $hover !disabled:
    color: #DC6B6B

// Pública / Solo mi lista: dos botones que se marcan (setChecked)
BolaSegmento < UIButton
  height: 30
  ttf-font: geistsemibold
  ttf-font-size: 12
  color: #9AA7AE
  background-color: alpha
  border-width: 1
  border-color: #39444C
  click-sound: 2774

  $hover !checked:
    color: #E2E5E6
    border-color: #6E5B37

  $checked:
    color: #E8D3A2
    background-color: #C7A86B26
    border-color: #C7A86B

// Fila de la lista de transmisiones
BolaFila < UIWidget
  height: 62
  background-color: #10161C66
  border-width: 1
  border-color: #2A333A

  $hover:
    border-color: #6E5B37

  Label
    id: nombre
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.right: mirando.left
    margin-top: 8
    margin-left: 12
    margin-right: 8
    height: 18
    ttf-font: geistsemibold
    ttf-font-size: 14
    color: #E8D3A2
    phantom: true

  Label
    id: ficha
    anchors.top: nombre.bottom
    anchors.left: nombre.left
    anchors.right: nombre.right
    margin-top: 1
    height: 15
    ttf-font: geist
    ttf-font-size: 11
    color: #9AA7AE
    phantom: true

  Label
    id: donde
    anchors.top: ficha.bottom
    anchors.left: nombre.left
    anchors.right: nombre.right
    margin-top: 1
    height: 15
    ttf-font: geist
    ttf-font-size: 12
    color: #C9D1D5
    phantom: true

  Label
    id: mirando
    anchors.right: mirar.left
    anchors.top: parent.top
    margin-top: 10
    margin-right: 12
    width: 88
    height: 16
    text-align: right
    ttf-font: geistmono
    ttf-font-size: 11
    color: #9AA7AE
    phantom: true

  Label
    id: modo
    anchors.right: mirando.right
    anchors.top: mirando.bottom
    margin-top: 6
    width: 88
    height: 16
    text-align: right
    ttf-font: geist
    ttf-font-size: 11
    color: #9AA7AE
    phantom: true

  ValdrenBoton
    id: mirar
    anchors.right: parent.right
    anchors.verticalCenter: parent.verticalCenter
    margin-right: 12
    width: 84
    text: Mirar

BolaVentana < ValdrenVentana
  id: bolaVentana
  size: 540 470
  text: Bola de cristal
  @onEscape: modules.game_bola.cerrar()

  Label
    id: cabecera
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.right: parent.right
    height: 20
    ttf-font: geistsemibold
    ttf-font-size: 15
    color: #E8D3A2
    text: Transmisiones que puedes mirar

  Label
    id: explica
    anchors.top: cabecera.bottom
    anchors.left: parent.left
    anchors.right: parent.right
    margin-top: 4
    height: 32
    text-wrap: true
    ttf-font: geist
    ttf-font-size: 12
    color: #9AA7AE

  ScrollablePanel
    id: lista
    anchors.top: explica.bottom
    anchors.left: parent.left
    anchors.right: barraLista.left
    anchors.bottom: pie.top
    margin-top: 12
    margin-bottom: 12
    margin-right: 4
    vertical-scrollbar: barraLista
    layout:
      type: verticalBox
      spacing: 6

  VerticalScrollBar
    id: barraLista
    anchors.top: explica.bottom
    anchors.bottom: pie.top
    anchors.right: parent.right
    margin-top: 12
    margin-bottom: 12
    step: 34
    pixels-scroll: true

  Label
    id: vacia
    anchors.top: lista.top
    anchors.left: parent.left
    anchors.right: parent.right
    margin-top: 40
    margin-left: 24
    margin-right: 24
    height: 64
    text-wrap: true
    text-align: center
    ttf-font: geist
    ttf-font-size: 13
    color: #9AA7AE

  UIWidget
    id: pie
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.bottom: parent.bottom
    height: 30

    BolaBotonSec
      id: actualizar
      anchors.left: parent.left
      anchors.verticalCenter: parent.verticalCenter
      text: Actualizar
      @onClick: modules.game_bola.actualizar()

    Label
      id: estado
      anchors.left: actualizar.right
      anchors.right: transmitir.left
      anchors.verticalCenter: parent.verticalCenter
      margin-left: 10
      margin-right: 10
      height: 30
      text-wrap: true
      ttf-font: geist
      ttf-font-size: 11
      color: #9AA7AE

    BolaBotonSec
      id: transmitir
      anchors.right: parent.right
      anchors.verticalCenter: parent.verticalCenter
      width: 140
      text: Transmitir yo
      @onClick: modules.game_bola.abrirTransmitir()

// Fila de la lista de permitidos
BolaPermitido < UIWidget
  height: 28
  background-color: alpha

  $hover:
    background-color: #E2E5E60D

  Label
    id: nombre
    anchors.left: parent.left
    anchors.right: quitar.left
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 8
    height: 16
    ttf-font: geist
    ttf-font-size: 13
    color: #E2E5E6
    phantom: true

  BolaBotonTexto
    id: quitar
    anchors.right: parent.right
    anchors.verticalCenter: parent.verticalCenter
    text: Quitar

BolaTransmitir < ValdrenVentana
  id: bolaTransmitir
  size: 430 484
  text: Transmitir por la bola de cristal
  @onEscape: modules.game_bola.cerrarTransmitir()

  Label
    id: titulo
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.right: parent.right
    margin-top: 6
    height: 24
    ttf-font: geistsemibold
    ttf-font-size: 18
    color: #E8D3A2

  Label
    id: sub
    anchors.top: titulo.bottom
    anchors.left: parent.left
    anchors.right: parent.right
    margin-top: 2
    height: 32
    text-wrap: true
    ttf-font: geist
    ttf-font-size: 12
    color: #9AA7AE

  BolaEtiqueta
    id: etiquetaModo
    anchors.top: sub.bottom
    anchors.left: parent.left
    margin-top: 12
    text: Quién puede mirar

  BolaSegmento
    id: publica
    anchors.top: etiquetaModo.bottom
    anchors.left: parent.left
    anchors.right: parent.horizontalCenter
    margin-top: 6
    margin-right: 3
    text: Cualquiera
    @onClick: modules.game_bola.elegirModo('publica')

  BolaSegmento
    id: privada
    anchors.top: publica.top
    anchors.left: parent.horizontalCenter
    anchors.right: parent.right
    margin-left: 3
    text: Solo mi lista
    @onClick: modules.game_bola.elegirModo('privada')

  ValdrenBoton
    id: empezar
    anchors.top: publica.bottom
    anchors.left: parent.left
    anchors.right: parent.right
    margin-top: 12
    text: Empezar a transmitir
    @onClick: modules.game_bola.alternarTransmision()

  BolaBotonSec
    id: parar
    anchors.top: empezar.top
    anchors.left: parent.left
    anchors.right: parent.right
    color: #DC6B6B
    border-color: #DC6B6B80
    text: Parar la transmisión
    visible: false
    @onClick: modules.game_bola.alternarTransmision()

  HorizontalSeparator
    id: sep1
    anchors.top: empezar.bottom
    anchors.left: parent.left
    anchors.right: parent.right
    margin-top: 16

  BolaEtiqueta
    id: etiquetaLista
    anchors.top: sep1.bottom
    anchors.left: parent.left
    margin-top: 14
    ttf-font: geistsemibold
    ttf-font-size: 12
    color: #C7A86B
    text: Tu lista

  TextEdit
    id: nombre
    anchors.top: etiquetaLista.bottom
    anchors.left: parent.left
    anchors.right: anadir.left
    margin-top: 6
    margin-right: 8
    height: 28
    padding-left: 8
    text-offset: 0 6
    ttf-font-size: 13
    max-length: 30
    placeholder: Nombre del personaje
    placeholder-color: #9AA7AE80

  BolaBotonSec
    id: anadir
    anchors.top: etiquetaLista.bottom
    anchors.right: parent.right
    margin-top: 6
    height: 28
    width: 96
    text: Añadir
    @onClick: modules.game_bola.anadir()

  ScrollablePanel
    id: permitidos
    anchors.top: nombre.bottom
    anchors.left: parent.left
    anchors.right: barraPermitidos.left
    anchors.bottom: nota.top
    margin-top: 8
    margin-bottom: 8
    margin-right: 4
    vertical-scrollbar: barraPermitidos
    layout:
      type: verticalBox
      spacing: 0

  VerticalScrollBar
    id: barraPermitidos
    anchors.top: nombre.bottom
    anchors.bottom: nota.top
    anchors.right: parent.right
    margin-top: 8
    margin-bottom: 8
    step: 28
    pixels-scroll: true

  Label
    id: listaVacia
    anchors.top: permitidos.top
    anchors.left: parent.left
    anchors.right: parent.right
    margin-top: 6
    height: 34
    text-wrap: true
    ttf-font: geist
    ttf-font-size: 12
    color: #9AA7AE90
    text: Nadie todavía. Con «Solo mi lista», solo te ven los personajes que añadas aquí.

  Label
    id: nota
    anchors.bottom: parent.bottom
    anchors.left: parent.left
    anchors.right: parent.right
    height: 30
    text-wrap: true
    ttf-font: geist
    ttf-font-size: 11
    color: #9AA7AEB0

// Indicador mientras transmites (arriba, a la izquierda del minimapa). Clic: abre «Transmitir».
BolaIndicador < UIButton
  height: 28
  width: 240
  background-color: #10161CE8
  border-width: 1
  border-color: #C7A86B80
  focusable: false

  $hover:
    border-color: #C7A86B

  UIWidget
    id: punto
    anchors.left: parent.left
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 10
    size: 8 8
    background-color: #DC6B6B
    phantom: true

  Label
    id: texto
    anchors.left: punto.right
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 8
    text-auto-resize: true
    ttf-font: geistsemibold
    ttf-font-size: 12
    color: #E8D3A2
    phantom: true

// Barra del espectador (arriba, centrada). Solo se ve mirando o esperando.
BolaBarra < UIWidget
  size: 520 40
  anchors.top: parent.top
  anchors.horizontalCenter: parent.horizontalCenter
  margin-top: 8
  background-color: #10161CF0
  border-width: 1
  border-color: #C7A86B
  focusable: false

  UIWidget
    id: punto
    anchors.left: parent.left
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 12
    size: 8 8
    background-color: #C7A86B
    phantom: true

  Label
    id: texto
    anchors.left: punto.right
    anchors.right: salir.left
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 10
    margin-right: 10
    height: 18
    ttf-font: geistsemibold
    ttf-font-size: 13
    color: #E8D3A2
    text-align: left

  ValdrenBoton
    id: salir
    anchors.right: parent.right
    anchors.verticalCenter: parent.verticalCenter
    margin-right: 6
    size: 104 28
    text: Volver