ShopCategory < Panel
  height: 36
  focusable: true
  background: alpha

  $focus:
    background: #99999999
  
  Label
    id: name
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.bottom: parent.bottom
    margin-left: 40
    text-align: left
    color: white
    font: verdana-11px-rounded    
    
ShopCategoryItem < ShopCategory
  UIItem
    id: item
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.bottom: parent.bottom
    margin-top: 2
    margin-bottom: 2
    margin-left: 2
    virtual: true
    size: 32 32
    
ShopCategoryCreature < ShopCategory
  UICreature
    id: creature
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.bottom: parent.bottom
    margin-top: 2
    margin-bottom: 2
    margin-left: 2
    size: 32 32
    
ShopCategoryImage < ShopCategory
  Label
    id: image
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.bottom: parent.bottom
    margin-top: 2
    margin-bottom: 2
    margin-left: 2
    size: 32 32    
    
    
    
ShopOffer < Panel
  height: 56
  background: alpha
  
  $focus:
    background: #99999999

  Label
    id: title
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.top: parent.top
    margin-top: 4
    margin-left: 55
    text-align: topleft
    color: white
    font: verdana-11px-rounded

  Label
    id: description
    anchors.top: prev.bottom
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.bottom: parent.bottom
    margin-left: 55
    margin-right: 55
    text-align: topleft
    text-auto-resize: true
    text-wrap: true
    color: white
    font: verdana-11px-rounded
    
  Button
    id: buyButton
    text: BUY
    height: 25
    anchors.verticalCenter: parent.verticalCenter
    anchors.left: prev.right
    anchors.right: parent.right    
    margin-right: 15
    text-align: center
    
ShopOfferItem < ShopOffer
  UIItem
    id: item
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.bottom: parent.bottom
    margin-top: 4
    margin-bottom: 4
    margin-left: 2
    virtual: true
    size: 48 48
    
ShopOfferCreature < ShopOffer
  UICreature
    id: creature
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.bottom: parent.bottom
    margin-top: 4
    margin-bottom: 4
    margin-left: 2
    size: 48 48
    
ShopOfferImage < ShopOffer
  Label
    id: image
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.bottom: parent.bottom
    margin-top: 4
    margin-bottom: 4
    margin-left: 2
    size: 48 48    
  
MainWindow
  id: shopWindow
  !text: tr('Shop')
  size: 750 500
  @onEscape: modules.game_shop.hide()
  $mobile:
    size: 500 360

  Panel
    id: infoPanel
    anchors.top: parent.top
    anchors.left: parent.left
    width: 230
    height: 60

    Label
      id: points
      anchors.horizontalCenter: parent.horizontalCenter
      anchors.top: parent.top
      margin-top: 10
      text: -
      text-auto-resize: true
    
    Button
      id: buy
      anchors.horizontalCenter: parent.horizontalCenter
      width: 150
      anchors.top: prev.bottom
      margin-top: 10
      visible: false
      !text: tr("Buy points")

  Panel
    id: adPanel
    anchors.top: parent.top
    anchors.left: infoPanel.right
    anchors.right: parent.right
    margin-left: 10
    height: 0
    
    Label
      id: ad
      anchors.horizontalCenter: parent.horizontalCenter
      anchors.top: parent.top
      anchors.bottom: parent.bottom
      text-auto-resize: true
      text-wrap: true
      text-align: center
      font: sans-bold-16px
  
  TextList    
    id: categories
    vertical-scrollbar: categoriesScrollBar
    anchors.top: infoPanel.bottom
    anchors.left: infoPanel.left
    anchors.right: infoPanel.right
    anchors.bottom: transactionHistory.top
    margin-top: 10
    margin-bottom: 10
    padding: 1
    focusable: false

  VerticalScrollBar
    id: categoriesScrollBar
    anchors.top: categories.top
    anchors.bottom: categories.bottom
    anchors.right: categories.right
    step: 50
    pixels-scroll: true

  TextList
    id: offers
    vertical-scrollbar: offersScrollBar
    anchors.top: adPanel.bottom
    anchors.left: adPanel.left
    anchors.right: adPanel.right
    anchors.bottom: transactionHistory.top
    margin-top: 10
    margin-bottom: 10
    padding: 1
    focusable: false

  VerticalScrollBar
    id: offersScrollBar
    anchors.top: offers.top
    anchors.bottom: offers.bottom
    anchors.right: offers.right
    step: 50
    pixels-scroll: true

  Button
    id: transactionHistory
    !text: tr('Transaction history')
    width: 128
    anchors.left: parent.left
    anchors.bottom: parent.bottom
    @onClick: modules.game_shop.showHistory()

  Button
    id: transferOpen
    !text: tr('Transfer Coins')
    width: 128
    anchors.left: prev. right
    margin-left: 10
    anchors.verticalCenter: prev.verticalCenter
    @onClick: modules.game_shop.showTransfer()

  Button
    id: buttonCancel
    !text: tr('Close')
    width: 64
    anchors.right: parent.right
    anchors.bottom: parent.bottom
    @onClick: modules.game_shop.hide()