SideActionButton < UIButton
  font: cipsoftFont
  height: 36
  padding: 1
  margin-top: 1
    
  Item
    id: item
    anchors.fill: parent
    padding: 1
    &selectable: true
    &editable: false
    virtual: true
    border-width: 1
    border-color: #00000000
    
    $!on:
      image-source: /images/game/actionbar/actionbarslot
      image-color: #dfdfdf
      image-clip: 0 0 34 34
      image-border: 0

    $on:
      image-source: /images/ui/button
      image-color: #dfdfdf
      image-clip: 0 0 22 23
      image-border: 3

    $pressed on:
      image-clip: 0 46 22 23

  Label
    id: text
    anchors.fill: prev
    text-auto-resize: true
    text-wrap: true
    phantom: true
    text-align: center
    font: verdana-9px

  Label
    id: hotkeyLabel
    anchors.top: parent.top
    anchors.right: parent.right
    margin: 3 4 3 3
    text-auto-resize: true
    text-wrap: false
    phantom: true
    font: cipsoftFont
    color: white
    background: #292A2A

  Label
    id: parameterText
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.bottom: parent.bottom
    margin-bottom: -3
    margin-left: 2
    margin-right: 2
    font: verdana-9px
    color: white
    text-align: center

  UIProgressRect
    id: cooldown
    background: #101010aa
    percent: 100
    focusable: false
    phantom: true
    anchors.fill: parent
    font: verdana-11px-rounded
    color: white

TopSliders < Panel
  size: 34 17

  Button
    id: prev
    anchors.fill: parent
    anchors.right: parent.horizontalCenter
    @onClick: modules.game_actionbar.moveActionButtons(self)

    $!on:
      tooltip: No further action buttons in this direction

    $on:
      tooltip: Move to the previous action button

    UIWidget
      id: image
      anchors.centerIn: parent
      phantom: true
      margin-left: 1
      rotation: 90

      $!on:
        image-source: /images/game/actionbar/arrow-disabled

      $on:
        image-source: /images/game/actionbar/arrow

  Button
    id: first
    anchors.fill: parent
    anchors.left: parent.horizontalCenter
    @onClick: modules.game_actionbar.moveActionButtons(self)

    $!on:
      tooltip: No further action buttons in this direction

    $on:
      tooltip: Move to the first action button

    UIWidget
      id: image
      anchors.centerIn: parent
      phantom: true
      margin-left: 1
      rotation: 90

      $!on:
        image-source: /images/game/actionbar/arrow-skip-disabled

      $on:
        image-source: /images/game/actionbar/arrow-skip

BottomSliders < Panel
  size: 34 32
  
  Button
    id: lock
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.bottom: parent.bottom
    height: 15
    @onClick: modules.game_actionbar.changeLockState(self)

    $!on:
      tooltip: Action Bar Locked: You cannot assign actions to or switch actions on action buttons by "drag&drop".

    $on:
      tooltip: Action Bar Unlocked: You can assign actions to or switch actions on action buttons by "drag&drop".

    UIWidget
      id: image
      anchors.centerIn: parent
      phantom: true
      margin-bottom: 1
      
      $!on:
        image-source: /images/game/actionbar/locked

      $on:
        image-source: /images/game/actionbar/unlocked

  Button
    id: next
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.right: parent.horizontalCenter
    height: 17
    margin-right: 1
    @onClick: modules.game_actionbar.moveActionButtons(self)
    on: true

    $!on:
      tooltip: No further action buttons in this direction

    $on:
      tooltip: Move to the next action button

    UIWidget
      id: image
      anchors.centerIn: parent
      phantom: true
      margin-top: 1
      rotation: 270
      on: true

      $!on:
        image-source: /images/game/actionbar/arrow-disabled

      $on:
        image-source: /images/game/actionbar/arrow

  Button
    id: last
    anchors.top: parent.top
    anchors.left: parent.horizontalCenter
    anchors.right: parent.right
    height: 17
    @onClick: modules.game_actionbar.moveActionButtons(self)
    on: true

    $!on:
      tooltip: No further action buttons in this direction

    $on:
      tooltip: Move to the last action button

    UIWidget
      id: image
      anchors.centerIn: parent
      phantom: true
      margin-top: 1
      rotation: 270
      on: true

      $!on:
        image-source: /images/game/actionbar/arrow-skip-disabled

      $on:
        image-source: /images/game/actionbar/arrow-skip
  
Panel
  id: actionBar
  focusable: false
  image-source: /images/ui/actionbar_background
  image-border: 1
  margin-top: -5
  
  $on:
    width: 37
    visible: true
    
  $!on:
    width: 0
    visible: false

  TopSliders
    id: prevPanel
    anchors.top: parent.top
    anchors.horizontalCenter: parent.horizontalCenter
    margin-top: 1
    
  ScrollablePanel
    id: tabBar
    anchors.top: prev.bottom
    anchors.bottom: nextPanel.top
    anchors.left: parent.left
    anchors.right: parent.right
    margin-top: 2
    margin-bottom: 4
    clipping: true
    padding-left: 1
    vertical-scrollbar: actionScroll
    layout: verticalBox

  VerticalScrollBar
    id: actionScroll
    anchors.top: parent.top
    anchors.bottom: parent.bottom
    anchors.right: parent.right
    step: 37
    pixels-scroll: true
    visible: false

  BottomSliders
    id: nextPanel
    anchors.bottom: parent.bottom
    anchors.horizontalCenter: parent.horizontalCenter
    margin-bottom: 3