// OT-MMO: el Gunslinger (server/scripts/clases/gunslinger.lua, opcode 138). Pixel art de arte/gunslinger/hud.py.
// 30-oct (aprobado por el usuario): la recámara ya no es una placa en el centro de la pantalla, es una FRANJA FINA pegada
// encima de la barra de experiencia (game_vitals, id «vitals»), del mismo ancho que ese bloque y que se mueve con él.
// A la izquierda el arma y su nombre en pequeño (o el estado: vacía, recargando, encasquillada, dorada); a la derecha,
// una bala por hueco (cargada = latón, gastada = contorno hueco, dorada = latón claro), la cuenta y la tecla R si falta
// alguna. La metralleta (30+) es un cargador de segmentos en grupos de 5. La placa cambia de canto: brasa vacía, rojo
// encasquillada, oro dorada (forma + color, PRODUCT.md). Se ve en combate, si no está llena o mientras recarga o está
// encasquillada; fuera de combate y llena se desvanece. La barra de recarga activa ocupa ESE MISMO sitio mientras
// recargas: tecla, carril con la zona blanca (baja) y la dorada (alta, sobresale), la aguja y el resultado a la derecha.
GunslingerBala < UIWidget
  phantom: true
  image-smooth: false

GunslingerHud < UIWidget
  id: gunslingerHud
  height: 26
  image-source: /modules/game_gunslinger/images/placa
  image-border: 6
  image-smooth: false
  phantom: true
  focusable: false

  UIWidget
    id: arma
    size: 22 14
    anchors.left: parent.left
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 8
    image-smooth: false
    phantom: true

  UIWidget
    id: rombo
    size: 9 9
    anchors.left: arma.right
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 8
    image-source: /modules/game_gunslinger/images/rombo
    image-smooth: false
    visible: false
    phantom: true

  Label
    id: estado
    anchors.left: arma.right
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 8
    ttf-font: $otmmo-font
    ttf-font-size: $otmmo-size-xs
    color: $otmmo-text-2
    text-auto-resize: true
    phantom: true

  UIWidget
    id: tecla
    size: 20 20
    anchors.right: parent.right
    anchors.verticalCenter: parent.verticalCenter
    margin-right: 4
    image-source: /modules/game_gunslinger/images/tecla-r
    image-smooth: false
    phantom: true

  Label
    id: cuenta
    anchors.right: parent.right
    anchors.verticalCenter: parent.verticalCenter
    margin-right: 30
    ttf-font: $otmmo-font-num
    ttf-font-size: $otmmo-size-md
    color: $otmmo-text
    text-auto-resize: true
    phantom: true

  UIWidget
    id: balas
    anchors.right: cuenta.left
    anchors.verticalCenter: parent.verticalCenter
    margin-right: 10
    size: 108 22
    phantom: true

GunslingerRecarga < UIWidget
  id: gunslingerRecarga
  height: 26
  image-source: /modules/game_gunslinger/images/placa
  image-border: 6
  image-smooth: false
  phantom: true
  focusable: false

  UIWidget
    id: tecla
    size: 20 20
    anchors.left: parent.left
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 4
    image-source: /modules/game_gunslinger/images/tecla-r
    image-smooth: false
    phantom: true

  UIWidget
    id: pista
    size: 268 18
    anchors.left: tecla.right
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 8
    image-source: /modules/game_gunslinger/images/pista
    image-border: 5
    image-smooth: false
    padding: 0 4
    phantom: true

    UIWidget
      id: blanca
      anchors.left: parent.left
      anchors.verticalCenter: parent.verticalCenter
      size: 40 12
      image-source: /modules/game_gunslinger/images/zona-blanca
      image-border: 2
      image-smooth: false
      phantom: true

    UIWidget
      id: dorada
      anchors.left: parent.left
      anchors.verticalCenter: parent.verticalCenter
      size: 12 18
      image-source: /modules/game_gunslinger/images/zona-dorada
      image-border: 2
      image-smooth: false
      phantom: true

    // Encasquillada (28-oct): un solo estado. Las zonas y la aguja se ocultan y el carril se llena de rayado rojo que
    // se vacía de derecha a izquierda durante los 2 s (cuenta atrás); el texto de la derecha dice los segundos que faltan.
    UIWidget
      id: rayado
      anchors.left: parent.left
      anchors.top: parent.top
      anchors.bottom: parent.bottom
      margin-top: 2
      margin-bottom: 2
      width: 260
      image-source: /modules/game_gunslinger/images/rayado
      image-repeated: true
      image-smooth: false
      visible: false
      phantom: true

  UIWidget
    id: aguja
    size: 7 24
    anchors.left: pista.left
    anchors.verticalCenter: pista.verticalCenter
    image-source: /modules/game_gunslinger/images/aguja
    image-smooth: false
    phantom: true

  UIWidget
    id: destello
    size: 16 16
    anchors.verticalCenter: pista.verticalCenter
    anchors.horizontalCenter: pista.horizontalCenter
    image-source: /modules/game_gunslinger/images/destello
    image-clip: 0 0 16 16
    image-smooth: false
    visible: false
    phantom: true

  Label
    id: resultado
    anchors.left: pista.right
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 10
    ttf-font: $otmmo-font-strong
    ttf-font-size: $otmmo-size-xs
    color: $otmmo-text-2
    text-auto-resize: true
    phantom: true