SpellGroupIcon < UIWidget
  size: 22 22
  image-size: 22 22
  image-source: /game_cooldown/icons/cooldownIcons.png
  focusable: false
  margin-top: 3

SpellIcon < UIWidget
  size: 22 22 
  image-size: 22 22
  margin-left: 2
  anchors.top: prev.top
  anchors.left: prev.right
  focusable: false
  
  $first:
    margin-top: 3
    anchors.top: parent.top
    anchors.left: parent.left

SpellProgressRect < UIProgressRect
  background: #585858AA
  percent: 100
  focusable: false
  
MiniWindow
  id: cooldownWindow
  !text: tr('Spell Cooldowns')
  height: 85
  icon: cooldown.png
  @onClose: modules.game_cooldown.onMiniWindowClose()
  &save: true
  
  MiniWindowContents
    SpellGroupIcon
      id: groupIconAttack
      image-clip: 0 0 20 20
      anchors.top: parent.top
      anchors.left: parent.left
      margin-left: 3
      $on:
        image-clip: 0 20 20 20

    SpellProgressRect
      id: progressRectAttack
      anchors.fill: groupIconAttack
      !tooltip: tr('Attack')

    SpellGroupIcon
      id: groupIconHealing
      image-clip: 20 0 20 20
      anchors.top: parent.top
      anchors.left: groupIconAttack.right
      margin-left: 3
      $on:
        image-clip: 20 20 20 20

    SpellProgressRect
      id: progressRectHealing
      anchors.fill: groupIconHealing
      !tooltip: tr('Healing')

    SpellGroupIcon
      id: groupIconSupport
      image-clip: 40 0 20 20
      anchors.top: parent.top
      anchors.left: groupIconHealing.right
      margin-left: 3
      $on:
        image-clip: 40 20 20 20

    SpellProgressRect
      id: progressRectSupport
      anchors.fill: groupIconSupport
      !tooltip: tr('Support')

    SpellGroupIcon
      id: groupIconSpecial
      image-clip: 60 0 20 20
      anchors.top: parent.top
      anchors.left: groupIconSupport.right
      margin-left: 3
      $on:
        image-clip: 60 20 20 20

    SpellProgressRect
      id: progressRectSpecial
      anchors.fill: groupIconSpecial
      !tooltip: tr('Special')

    Panel
      id: spellCooldownPanel
      margin-top: 5
      anchors.top: groupIconSpecial.bottom
      anchors.left: parent.left
      anchors.right: parent.right
      height: 30
      padding: 1
      margin-left: 2
      margin-right: 2
      border: 1 #444444