EnterGamePanel < Panel
  font: verdana-11px-antialised
  color: #dfdfdf
  text-offset: 0 6
  text-align: top
  image-source: /images/ui/window
  image-border: 6
  image-border-top: 27
  padding-top: 28
  padding-left: 8
  padding-right: 8
  padding-bottom: 8

News < EnterGamePanel
  id: news
  anchors.left: parent.left
  anchors.top: parent.top
  anchors.bottom: parent.bottom
  width: 230
  !text: tr("News") 
  
  ScrollablePanel
    id: content
    anchors.fill: parent
    margin-right: 8
    margin-left: 1
    margin-bottom: 5
    vertical-scrollbar: newsPanelScroll
    layout:
      type: verticalBox

  SmallScrollBar
    id: newsPanelScroll
    anchors.top: parent.top
    anchors.bottom: parent.bottom
    anchors.right: parent.right
    
NewsLabel < Label
  text-wrap: true
  text-auto-resize: true
  text-align: center
  font: terminus-14px-bold
  
NewsText < Label
  text-wrap: true
  text-auto-resize: true
  text-align: left
  margin-bottom: 10

NewsImage < Label
  text-wrap: true
  margin-bottom: 5
  text-align: center
  
EnterGame < Panel
  anchors.fill: parent
  id: entergame
  
  EnterGamePanel
    id: mainPanel
    anchors.horizontalCenter: parent.horizontalCenter
    anchors.verticalCenter: parent.verticalCenter
    size: 230 210
    !text: tr("Enter Game") 
    padding-top: 36
    padding-left: 16
    padding-right: 16
    padding-bottom: 16
    
    MenuLabel
      !text: tr('Account name')
      anchors.left: parent.left
      anchors.top: parent.top
      text-auto-resize: true

    TextEdit
      id: account
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 2

    MenuLabel
      !text: tr('Password')
      anchors.left: prev.left
      anchors.top: prev.bottom
      margin-top: 8
      text-auto-resize: true

    PasswordTextEdit
      id: password
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 2
      
    HorizontalSeparator
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 10

    CheckBox
      id: rememberPasswordBox
      !text: tr('Remember password')
      !tooltip: tr('Remember account and password when starts client')
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 9

    HorizontalSeparator
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 9

    Button
      id: button
      !text: tr('Login')
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 10
      margin-left: 50
      margin-right: 50

  EnterGamePanel
    id: buttons
    anchors.horizontalCenter: prev.horizontalCenter
    anchors.top: prev.bottom
    margin-top: 20
    size: 290 50
    image-source: /images/ui/window_headless
    image-border: 6
    padding-top: 8
    
  Button
    id: register
    anchors.verticalCenter: buttons.verticalCenter
    anchors.left: buttons.left
    margin-left: 10
    !text: tr("Create account")
    size: 130 30
    
  Button
    id: register
    anchors.verticalCenter: buttons.verticalCenter
    anchors.right: buttons.right
    margin-right: 10
    !text: tr("Casts")
    size: 130 30
    
Registration < Panel
  anchors.fill: parent
  id: registration

  EnterGamePanel
    id: mainPanel
    anchors.horizontalCenter: parent.horizontalCenter
    anchors.verticalCenter: parent.verticalCenter
    size: 250 262
    !text: tr("Create Acoount") 
    padding-top: 36
    padding-left: 16
    padding-right: 16
    padding-bottom: 16
    
    MenuLabel
      !text: tr('Account name')
      anchors.left: parent.left
      anchors.top: parent.top
      text-auto-resize: true

    TextEdit
      id: accountNameTextEdit
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 2

    MenuLabel
      !text: tr('Email')
      anchors.left: prev.left
      anchors.top: prev.bottom
      margin-top: 8
      text-auto-resize: true

    TextEdit
      id: emailTextEdit
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 2
    
    MenuLabel
      !text: tr('Password')
      anchors.left: prev.left
      anchors.top: prev.bottom
      margin-top: 8
      text-auto-resize: true

    PasswordTextEdit
      id: accountPasswordTextEdit
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 2
      
    MenuLabel
      !text: tr('Password confirmation')
      anchors.left: prev.left
      anchors.top: prev.bottom
      margin-top: 8
      text-auto-resize: true

    PasswordTextEdit
      id: accountPasswordTextEdit
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 2
      
    HorizontalSeparator
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 9

    Button
      !text: tr('Create account')
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 10
      margin-left: 50
      margin-right: 50

  EnterGamePanel
    id: buttons
    anchors.horizontalCenter: prev.horizontalCenter
    anchors.top: prev.bottom
    margin-top: 20
    size: 200 50
    image-source: /images/ui/window_headless
    image-border: 6
    padding-top: 8
    
  Button
    id: back
    anchors.verticalCenter: buttons.verticalCenter
    anchors.horizontalCenter: buttons.horizontalCenter
    !text: tr("Back")
    size: 160 30
    
QuickLogin < EnterGamePanel
  id: quick
  anchors.right: parent.right
  anchors.verticalCenter: parent.verticalCenter
  size: 230 312
  !text: tr("Quick Login & Registration")

  UIButton
    id: qrcode
    width: 200
    height: 200
    anchors.top: parent.top
    anchors.horizontalCenter: parent.horizontalCenter
    image-fixed-ratio: true
    image-smooth: false
    margin-top: 5
    
  UIButton
    id: quathlogo
    width: 66
    height: 40
    anchors.verticalCenter: prev.verticalCenter
    anchors.horizontalCenter: prev.horizontalCenter
    image-fixed-ratio: true
    image-smooth: false
    image-source: /images/ui/qauth
    
  Label
    anchors.top: qrcode.bottom
    anchors.left: qrcode.left
    anchors.right: qrcode.right
    text-align: center
    text-auto-resize: true
    !text: tr("Scan or click QR code\nto register or login")
    height: 40
    margin-top: 10
    margin-bottom: 5
    
  Button
    anchors.top: prev.bottom
    anchors.left: parent.left
    anchors.right: parent.right
    text-align: center
    !text: tr("Click to get PC/Android/iOS app")
    height: 23
    margin-top: 10
    margin-left: 5
    margin-right: 5
    color: #FFFFFF
    @onClick: g_platform.openUrl("http://qauth.co")
    
Characters < Panel
  id: characters
  anchors.fill: parent

  EnterGamePanel
    id: mainPanel
    anchors.horizontalCenter: parent.horizontalCenter
    anchors.verticalCenter: parent.verticalCenter
    size: 550 350
    !text: tr("Characters") 
    padding-top: 36
    padding-left: 16
    padding-right: 16
    padding-bottom: 16
    
    Label
      id: motd
      anchors.top: parent.top
      anchors.left: parent.left
      anchors.right: parent.right
      text-auto-resize: true
      text-wrap: true
      text-align: center
          
    HorizontalSeparator
      id: motdSeparator
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 5
      
    ScrollablePanel
      id: outfitsPanel
      layout:
        type: grid
        cell-size: 125 125
        cell-spacing: 1
        flow: true
      vertical-scrollbar: outfitsScroll      
      background-color: #444444
      anchors.top: prev.bottom
      anchors.bottom: bottomSeparator.top
      anchors.left: parent.left
      anchors.right: parent.right
      margin-right: 12
      margin-bottom: 5
      margin-top: 5
      
    VerticalScrollBar
      id: outfitsScroll
      anchors.top: outfitsPanel.top
      anchors.bottom: outfitsPanel.bottom
      anchors.left: outfitsPanel.right
      step: 14
      pixels-scroll: true

    ScrollablePanel
      id: charactersPanel
      layout:
        type: verticalBox
      vertical-scrollbar: charactersScroll      
      background-color: #444444
      anchors.top: motdSeparator.bottom
      anchors.bottom: bottomSeparator.top
      anchors.left: parent.left
      anchors.right: parent.right
      margin-right: 12
      margin-bottom: 5
      margin-top: 5
      
    VerticalScrollBar
      id: charactersScroll
      anchors.top: charactersPanel.top
      anchors.bottom: charactersPanel.bottom
      anchors.left: charactersPanel.right
      step: 14
      pixels-scroll: true    
    
    HorizontalSeparator
      id: bottomSeparator
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.bottom: parent.bottom
      margin-bottom: 30
      
    Button
      id: autoReconnect
      !text: tr('Auto reconnect: On')
      width: 140
      anchors.left: parent.left
      anchors.bottom: parent.bottom
      image-color: green
      $!on:
        image-color: red    
        !text: tr('Auto reconnect: Off')

    Button
      id: showOutfits
      anchors.horizontalCenter: parent.horizontalCenter
      anchors.bottom: parent.bottom
      width: 140

      $on:
        !text: tr("Hide big outfits")      

      $!on:
        !text: tr("Show big outfits")

    Button
      id: connect
      anchors.right: parent.right
      anchors.bottom: parent.bottom
      !text: tr("Connect")
      width: 140
      @onClick: modules.client_entergamev2.doGameLogin()

  EnterGamePanel
    id: buttons
    anchors.horizontalCenter: prev.horizontalCenter
    anchors.top: prev.bottom
    margin-top: 20
    size: 450 50
    image-source: /images/ui/window_headless
    image-border: 6
    padding-top: 8
    
  Button
    id: createcharacter
    anchors.verticalCenter: buttons.verticalCenter
    anchors.left: buttons.left
    !text: tr("Create character")
    margin-left: 10
    size: 140 30

  Button
    id: settings
    anchors.verticalCenter: buttons.verticalCenter
    anchors.horizontalCenter: buttons.horizontalCenter
    !text: tr("Account settings")
    size: 140 30

  Button
    id: logout
    anchors.verticalCenter: buttons.verticalCenter
    anchors.right: buttons.right
    margin-right: 10
    !text: tr("Logout")
    size: 140 30
    
EntergameBigCharacter < UIButton
  border-width: 1
  padding: 1 1 1 1
  @onClick: self:setChecked(true)
  @onDoubleClick: modules.client_entergamev2.doGameLogin()
  
  $checked:
    border-color: #ffffff

  $!checked:
    border-color: black

  UICreature
    id: outfit
    anchors.bottom: parent.bottom
    anchors.horizontalCenter: parent.horizontalCenter
    size: 70 70
    margin-bottom: 3
    phantom: true

  Label
    id: line1
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.top: parent.top
    text-align: center
    text-wrap: false
    height: 16
    font: terminus-10px
    border-width-bottom: 1
    border-color: #00000077
    phantom: true
    
  Label
    id: line2
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.top: prev.bottom
    text-align: center
    text-wrap: false
    height: 16
    font: terminus-10px
    border-width-bottom: 1
    border-color: #00000077
    phantom: true
    
  Label
    id: line3
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.top: prev.bottom
    text-align: center
    text-wrap: false
    height: 16
    font: terminus-10px
    border-width-bottom: 1
    border-color: #00000077
    phantom: true
    
EntergameCharacter < UIButton
  padding: 3 3 3 3
  @onClick: self:setChecked(true)
  @onDoubleClick: modules.client_entergamev2.doGameLogin()
  height: 34
  
  $checked:
    background-color: #333333

  $!checked:
    background-color: #555555
    
  UICreature
    id: outfit
    anchors.left: parent.left
    anchors.top: parent.top
    anchors.bottom: parent.bottom
    size: 32 32
    margin-top: -2
    margin-bottom: -2
    phantom: true

  UILabel
    id: line1
    anchors.left: prev.right
    anchors.top: parent.top
    anchors.bottom: parent.bottom
    margin-left: 6
    width: 150
    text-align: left
    phantom: true
    
  VerticalSeparator
    anchors.left: prev.right
    anchors.top: parent.top
    anchors.bottom: parent.bottom

  UILabel
    id: line2
    anchors.left: prev.right
    anchors.top: parent.top
    anchors.bottom: parent.bottom
    width: 150
    text-align: center
    phantom: true

  VerticalSeparator
    anchors.left: prev.right
    anchors.top: parent.top
    anchors.bottom: parent.bottom

  UILabel
    id: line3
    anchors.left: prev.right
    anchors.right: parent.right
    anchors.top: parent.top
    anchors.bottom: parent.bottom
    text-align: center
    phantom: true
    
CreateCharacter < Panel
  anchors.fill: parent
  id: createcharacter

  EnterGamePanel
    id: mainPanel
    anchors.horizontalCenter: parent.horizontalCenter
    anchors.verticalCenter: parent.verticalCenter
    size: 250 262
    !text: tr("Create Character") 
    padding-top: 36
    padding-left: 16
    padding-right: 16
    padding-bottom: 16
    
    MenuLabel
      !text: tr('Name')
      anchors.left: parent.left
      anchors.top: parent.top
      text-auto-resize: true

    TextEdit
      id: name
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 2

    MenuLabel
      !text: tr('Gender')
      anchors.left: prev.left
      anchors.top: prev.bottom
      margin-top: 8
      text-auto-resize: true
      
    ComboBox
      id: gender
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      menu-scroll: true
      menu-height: 125
      menu-scroll-step: 25
      margin-right: 3
      @onSetup: |
        self:addOption("Male")
        self:addOption("Female")
      
    MenuLabel
      !text: tr('Vocation')
      anchors.left: prev.left
      anchors.top: prev.bottom
      margin-top: 8
      text-auto-resize: true

    ComboBox
      id: vocation
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      menu-scroll: true
      menu-height: 125
      menu-scroll-step: 25
      margin-right: 3
      @onSetup: |
        self:addOption("Sorcerer")
        self:addOption("Druid")
        self:addOption("Paladin")
        self:addOption("Knight")
      
    MenuLabel
      !text: tr('Town')
      anchors.left: prev.left
      anchors.top: prev.bottom
      margin-top: 8
      text-auto-resize: true

    ComboBox
      id: town
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      menu-scroll: true
      menu-height: 125
      menu-scroll-step: 25
      margin-right: 3
      @onSetup: |
        self:addOption("Carlin")
        self:addOption("Edron")
        self:addOption("Thais")
        self:addOption("Venore")
      
    HorizontalSeparator
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 9

    Button
      id: createButton
      !text: tr('Create character')
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 10
      margin-left: 50
      margin-right: 50

  EnterGamePanel
    id: buttons
    anchors.horizontalCenter: prev.horizontalCenter
    anchors.top: prev.bottom
    margin-top: 20
    size: 200 50
    image-source: /images/ui/window_headless
    image-border: 6
    padding-top: 8
    
  Button
    id: back
    anchors.verticalCenter: buttons.verticalCenter
    anchors.horizontalCenter: buttons.horizontalCenter
    !text: tr("Back")
    size: 160 30
    
    
AccountSettings < Panel
  anchors.fill: parent
  id: settings

  EnterGamePanel
    id: mainPanel
    anchors.horizontalCenter: parent.horizontalCenter
    anchors.verticalCenter: parent.verticalCenter
    size: 250 173
    !text: tr("Account settings") 
    padding-top: 36
    padding-left: 16
    padding-right: 16
    padding-bottom: 16
    
    MenuLabel
      !text: tr('Email')
      anchors.left: parent.left
      anchors.top: parent.top
      text-auto-resize: true

    TextEdit
      id: email
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 2
      
    MenuLabel
      !text: tr('Security level')
      anchors.left: prev.left
      anchors.top: prev.bottom
      margin-top: 8
      text-auto-resize: true
      
    ComboBox
      id: security
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      menu-scroll: true
      menu-height: 125
      menu-scroll-step: 25
      margin-right: 3
      @onSetup: |
        self:addOption("Low")
        self:addOption("Medium")
        self:addOption("High")
        
    HorizontalSeparator
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 9

    Button
      id: updateButton
      !text: tr('Update settings')
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.top: prev.bottom
      margin-top: 10
      margin-left: 50
      margin-right: 50

  EnterGamePanel
    id: buttons
    anchors.horizontalCenter: prev.horizontalCenter
    anchors.top: prev.bottom
    margin-top: 20
    size: 200 50
    image-source: /images/ui/window_headless
    image-border: 6
    padding-top: 8
    
  Button
    id: back
    anchors.verticalCenter: buttons.verticalCenter
    anchors.horizontalCenter: buttons.horizontalCenter
    !text: tr("Back")
    size: 160 30
    
Panel
  anchors.top: topMenu.bottom
  anchors.bottom: parent.bottom
  anchors.left: parent.left
  anchors.right: parent.right
  margin: 10 10 10 10
  
  News
  QuickLogin
  EnterGame
  Registration
  Characters
  CreateCharacter
  AccountSettings