Resolve "Merge the best from 7.40 branch"

SabrehavenOTClient/layouts/retro/styles/10-checkboxes.otui

@@ -0,0 +1,59 @@
+CheckBox < UICheckBox
+  size: 12 12
+  text-align: left
+  text-offset: 18 -1
+  color: #dfdfdf
+  image-color: #dfdfdfff
+  image-rect: 0 0 12 12
+  image-source: /images/ui/checkbox
+
+  $hover !disabled:
+    color: #ffffff
+
+  $!checked:
+    image-clip: 0 0 12 12
+
+  $checked:
+    image-clip: 0 12 12 12
+
+  $disabled:
+    image-color: #dfdfdf88
+    color: #dfdfdf88
+    opacity: 0.8
+
+ColorBox < UICheckBox
+  size: 16 16
+  image-color: #dfdfdfff
+  image-source: /images/ui/colorbox
+
+  $checked:
+    image-clip: 16 0 16 16
+
+  $!checked:
+    image-clip: 0 0 16 16
+
+ButtonBox < UICheckBox
+  font: verdana-11px-antialised
+  color: white
+  size: 106 23
+  text-offset: 0 0
+  text-align: center
+  image-source: /images/ui/button
+  image-color: #dfdfdf
+  image-clip: 0 0 22 23
+  image-border: 3
+
+  $hover !disabled:
+    image-clip: 0 23 22 23
+
+  $checked:
+    image-clip: 0 46 22 23
+    color: white
+    text-offset: 2 2
+
+  $disabled:
+    color: #dfdfdf88
+    image-color: #dfdfdf88
+
+ButtonBoxRounded < ButtonBox
+  image-source: /images/ui/button_rounded

SabrehavenOTClient/layouts/retro/styles/10-comboboxes.otui

@@ -0,0 +1,106 @@
+ComboBoxPopupScrollMenuButton < UIButton
+  height: 23
+  font: verdana-11px-antialised
+  text-align: left
+  text-offset: 4 0
+  color: #BFBFBF
+  background-color: alpha
+  margin: 1
+
+  $hover !disabled:
+    color: #dfdfdf
+    background-color: #595959
+
+  $disabled:
+    color: #dfdfdf88
+
+ComboBoxPopupScrollMenu < UIPopupScrollMenu
+  image-source: /images/ui/combobox_square
+  image-clip: 0 69 91 23
+  image-border: 1
+
+ComboBoxPopupMenuButton < UIButton
+  height: 23
+  font: verdana-11px-antialised
+  text-align: left
+  text-offset: 5 2
+  color: #dfdfdf
+  background-color: alpha
+  margin: 1
+
+  $hover !disabled:
+    color: #dfdfdf
+    background-color: #355d89
+
+  $disabled:
+    color: #dfdfdf88
+
+ComboBoxPopupMenu < UIPopupMenu
+  image-source: /images/ui/combobox_square
+  image-clip: 0 69 91 23
+  image-border: 1
+
+ComboBox < UIComboBox
+  font: verdana-11px-antialised
+  color: #dfdfdf
+  size: 91 23
+  text-offset: 5 2
+  text-align: left
+  image-source: /images/ui/combobox_square
+  image-border: 3
+  image-border-right: 19
+  image-clip: 0 0 91 23
+
+  $hover !disabled:
+    image-clip: 0 23 91 23
+
+  $on:
+    image-clip: 0 46 91 23
+
+  $disabled:
+    color: #dfdfdf88
+    opacity: 0.8
+
+ComboBoxRoundedPopupScrollMenuButton < UIButton
+  height: 23
+  font: verdana-11px-antialised
+  text-align: left
+  text-offset: 5 2
+  color: #dfdfdf
+  background-color: alpha
+
+  $hover !disabled:
+    color: #ffffff
+    background-color: #355d89
+
+  $disabled:
+    color: #dfdfdf88
+
+ComboBoxRoundedPopupScrollMenu < UIPopupScrollMenu
+  image-source: /images/ui/combobox_rounded
+  image-clip: 0 69 91 23
+  image-border: 3
+
+ComboBoxRoundedPopupMenuButton < UIButton
+  height: 23
+  font: verdana-11px-antialised
+  text-align: left
+  text-offset: 5 2
+  color: #dfdfdf
+  background-color: alpha
+
+  $hover !disabled:
+    color: #ffffff
+    background-color: #355d89
+
+  $disabled:
+    color: #dfdfdf88
+
+ComboBoxRoundedPopupMenu < UIPopupMenu
+  image-source: /images/ui/combobox_rounded
+  image-clip: 0 69 91 23
+  image-border: 3
+
+ComboBoxRounded < ComboBox
+  image-source: /images/ui/combobox_rounded
+  image-border: 3

SabrehavenOTClient/layouts/retro/styles/10-panels.otui

@@ -0,0 +1,19 @@
+Panel < UIWidget
+  phantom: true
+  auto-focus: first
+
+ScrollablePanel < UIScrollArea
+  phantom: true
+  auto-focus: first
+
+FlatPanel < Panel
+  image-source: /images/ui/panel_flat
+  image-border: 1
+
+ScrollableFlatPanel < ScrollablePanel
+  image-source: /images/ui/panel_flat
+  image-border: 1
+
+LightFlatPanel < Panel
+  image-source: /images/ui/panel_lightflat
+  image-border: 1

SabrehavenOTClient/layouts/retro/styles/10-progressbars.otui

@@ -0,0 +1,38 @@
+ProgressBar < UIProgressBar
+  height: 16
+  background-color: red
+  image-source: /images/ui/progressbar
+  image-border: 2
+  font: verdana-11px-rounded
+  text-offset: 0 2
+
+  $!on:
+    visible: false
+    margin-top: 0
+    margin-bottom: 0
+    height: 0
+
+LifeProgressBar < UIProgressBar
+  height: 16
+  background-color: green
+  border: 1 black
+  font: verdana-11px-rounded
+  text-offset: 0 2
+  margin: 2
+
+ProgressRect < UIProgressRect
+  anchors.fill: parent
+  phantom: true
+  color: white
+  background-color: #00000088
+  font: verdana-11px-rounded
+
+HealthBar < ProgressBar
+  image-source: /images/ui/progressbarhpmana
+  image-border: 3
+  background-color: #ff4444
+
+ManaBar < ProgressBar
+  image-source: /images/ui/progressbarhpmana
+  image-border: 4
+  background-color: #4444ff

SabrehavenOTClient/layouts/retro/styles/10-textedits.otui

@@ -0,0 +1,20 @@
+TextEdit < UITextEdit
+  font: verdana-11px-antialised
+  color: white
+  size: 86 22
+  text-offset: 0 4
+  opacity: 1
+  padding: 4
+  image-source: /images/ui/textedit
+  image-border: 1
+  selection-color: #272727
+  selection-background-color: #cccccc
+  $disabled:
+    color: #27272788
+    opacity: 0.5
+
+PasswordTextEdit < TextEdit
+  text-hidden: true
+
+MultilineTextEdit < TextEdit
+  multiline: true

SabrehavenOTClient/layouts/retro/styles/10-windows.otui

@@ -0,0 +1,32 @@
+Window < UIWindow
+  font: verdana-11px-antialised
+  size: 236 207
+  opacity: 1
+  color: #AFAFAF
+  text-offset: 0 2
+  text-align: top
+  image-source: /images/ui/window
+  image-border: 4
+  image-border-top: 17
+  padding-top: 25
+  padding-left: 16
+  padding-right: 16
+  padding-bottom: 16
+
+  $disabled:
+    color: #dfdfdf
+
+HeadlessWindow < UIWindow
+  image-source: /images/ui/window_headless
+  image-border: 5
+  padding: 5
+
+MainWindow < Window
+  anchors.centerIn: parent
+
+StaticWindow < Window
+  &static: true
+
+StaticMainWindow < StaticWindow
+  anchors.centerIn: parent
+  

SabrehavenOTClient/layouts/retro/styles/20-popupmenus.otui

@@ -0,0 +1,83 @@
+PopupMenuButton < UIButton
+  height: 18
+  size: 0 21
+  text-offset: 4 2
+  text-align: left
+  font: verdana-11px-antialised
+
+  color: white
+  background-color: alpha
+
+  $hover !disabled:
+    color: #ffffff
+    background-color: #ffffff44
+    image-clip: 0 40 20 20
+
+  $disabled:
+    color: #555555
+
+PopupMenuShortcutLabel < Label
+  font: verdana-11px-antialised
+  text-align: right
+  anchors.fill: parent
+  margin-right: 2
+  margin-left: 5
+
+PopupMenuSeparator < UIWidget
+  margin-left: 2
+  margin-right: 2
+  margin-bottom: 1
+  image-source: /images/ui/separator_horizontal
+  image-border-left: 1
+  image-border-right: 1
+  image-clip: 0 0 32 2
+  height: 2
+  phantom: true
+
+PopupMenu < UIPopupMenu
+  width: 120
+  image-source: /images/ui/menubox
+  image-border: 3
+  padding: 5
+
+PopupScrollMenuButton < UIButton
+  height: 18
+  size: 0 21
+  text-offset: 4 0
+  text-align: left
+  font: verdana-11px-antialised
+
+  color: #aaaaaa
+  background-color: alpha
+
+  $hover !disabled:
+    color: #ffffff
+    background-color: #ffffff44
+    image-clip: 0 40 20 20
+
+  $disabled:
+    color: #555555
+
+PopupScrollMenuShortcutLabel < Label
+  font: verdana-11px-antialised
+  text-align: right
+  anchors.fill: parent
+  margin-right: 2
+  margin-left: 5
+
+PopupScrollMenuSeparator < UIWidget
+  margin-left: 2
+  margin-right: 2
+  margin-bottom: 1
+  image-source: /images/ui/menubox
+  image-border-left: 1
+  image-border-right: 1
+  image-clip: 0 0 32 2
+  height: 2
+  phantom: true
+
+PopupScrollMenu < UIPopupScrollMenu
+  width: 50
+  image-source: /images/ui/menubox
+  image-border: 3
+  padding: 3

SabrehavenOTClient/layouts/retro/styles/20-tabbars.otui

@@ -0,0 +1,113 @@
+MoveableTabBar < UIMoveableTabBar
+  size: 80 21
+MoveableTabBarPanel < Panel
+MoveableTabBarButton < UIButton
+  size: 96 18
+  image-source: /images/ui/tabbutton_square
+  image-clip: 0 0 96 22
+  image-border: 3
+  image-border-bottom: 0
+  color: #7F7F7F
+  anchors.top: parent.top
+  anchors.left: parent.left
+  margin-top: 2
+  padding: 3
+
+  $checked:
+    image-clip: 0 36 96 22
+    color: #dfdfdf
+
+  $on !checked:
+    color: #F75F5F
+
+TabBar < UITabBar
+  size: 80 21
+  Panel
+    id: buttonsPanel
+    anchors.fill: parent
+TabBarPanel < Panel
+TabBarButton < UIButton
+  size: 17 18
+  image-source: /images/ui/tabbutton_square
+  image-color: #dfdfdf
+  image-clip: 0 0 98 18
+  image-border: 3
+  icon-color: #dfdfdf
+  color: #dfdfdf
+  anchors.top: parent.top
+  padding: 5
+
+  $first:
+    anchors.left: parent.left
+
+  $!first:
+    anchors.left: prev.right
+    margin-left: 5
+
+  $hover !checked:
+    image-clip: 0 18 98 18
+    color: #dfdfdf
+
+  $disabled:
+    image-color: #dfdfdf88
+    icon-color: #dfdfdf
+
+  $checked:
+    image-clip: 0 36 98 18
+    color: #dfdfdf
+
+  $on !checked:
+    color: #de6f6f
+
+TabBarRounded < TabBar
+TabBarRoundedPanel < TabBarPanel
+TabBarRoundedButton < TabBarButton
+  image-source: /images/ui/tabbutton_rounded
+
+TabBarVertical < UITabBar
+  width: 96
+  ScrollableFlatPanel
+    id: buttonsPanel
+    anchors.top: parent.top
+    anchors.left: parent.left
+    anchors.right: scrollBar.left
+    anchors.bottom: parent.bottom
+    vertical-scrollbar: scrollBar
+    margin-right: 1
+    padding-top: 10
+    
+  VerticalScrollBar
+    id: scrollBar
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    step: 16
+    pixels-scroll: true
+    $!on:
+      width: 0
+
+TabBarVerticalPanel < Panel 
+TabBarVerticalButton < UIButton
+  size: 48 48
+  color: #aaaaaa
+  anchors.left: parent.left
+  anchors.right: parent.right
+  text-align: bottom
+  icon-align: top
+  icon-offset-y: 2
+  icon-color: #888888
+  $first:
+    anchors.top: parent.top
+  $!first:
+    anchors.top: prev.bottom
+    margin-top: 10
+  $hover !checked:
+    color: white
+    icon-color: #dfdfdf
+  $disabled:
+    icon-color: #333333
+  $checked:
+    icon-color: #ffffff
+    color: #80c7f8
+  $on !checked:
+    color: #F55E5E

SabrehavenOTClient/layouts/retro/styles/20-topmenu.otui

@@ -0,0 +1,131 @@
+TopButton < UIButton
+  size: 26 26
+  image-source: /images/ui/button_top
+  image-clip: 0 0 26 26
+  image-border: 3
+  image-color: #ffffffff
+  icon-color: #ffffffff
+  icon-clip: 0 0 20 20
+  
+  $on:
+    image-source: /images/ui/button_top_blink
+    icon-clip: 0 20 20 20
+
+  $hover !disabled:
+    image-color: #ffffff99
+    image-clip: 26 0 26 26
+
+  $pressed:
+    image-clip: 52 0 26 26
+    icon-clip: 0 20 20 20
+
+  $disabled:
+    image-color: #ffffff44
+    icon-color: #ffffff44
+
+TopToggleButton < UIButton
+  size: 20 20
+  image-source: /images/ui/button_top
+  image-clip: 0 0 26 26
+  image-color: #ffffffff
+  image-border: 3
+  icon-clip: 0 0 20 20
+  icon-color: #ffffffff
+  
+  $on:
+    icon-clip: 0 20 20 20
+
+  $hover !disabled:
+    image-color: #ffffff99
+    image-clip: 26 0 26 26
+
+  $pressed:
+    image-clip: 52 0 26 26
+    icon-clip: 0 20 20 20
+
+  $disabled:
+    image-color: #ffffff44
+    icon-color: #ffffff44
+    
+TopMenuButtonsPanel < Panel
+  layout:
+    type: horizontalBox
+    spacing: 4
+    fit-children: true
+  padding: 6 4
+
+TopMenuPanel < Panel
+  height: 36
+  image-source: /images/ui/panel_top
+  image-repeated: true
+  image-border: 3
+  image-border-top: 0
+  focusable: false
+
+TopMenuFrameCounterLabel < Label
+  font: verdana-11px-rounded
+  color: white
+  margin-top: 4
+  margin-left: 5
+
+TopMenuPingLabel < Label
+  font: verdana-11px-rounded
+
+TopMenu < TopMenuPanel
+  id: topMenu
+  width: 800
+  anchors.horizontalCenter: parent.horizontalCenter
+  anchors.top: parent.top
+  &hideIngame: true
+  &reverseButtons: true
+
+  UIWidget
+    id: discord
+    anchors.top: parent.top
+    anchors.left: parent.left
+    margin-top: 3
+    margin-left: 5
+    image-source: /images/ui/discord
+    
+  Label
+    id: discordLabel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.left: prev.right
+    text-align: center
+    margin-left: 2
+    text-auto-resize: true
+
+  TopMenuButtonsPanel
+    id: rightButtonsPanel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.left: prev.right
+
+  TopMenuButtonsPanel
+    id: rightGameButtonsPanel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.left: prev.right
+    visible: false
+
+  Label
+    id: onlineLabel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.horizontalCenter: parent.horizontalCenter
+    text-align: center
+    text-auto-resize: true
+
+  TopMenuButtonsPanel
+    id: leftButtonsPanel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+
+  TopMenuButtonsPanel
+    id: leftGameButtonsPanel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: prev.left
+    visible: false

SabrehavenOTClient/layouts/retro/styles/30-miniwindow.otui

@@ -0,0 +1,215 @@
+MiniWindow < UIMiniWindow
+  font: verdana-11px-antialised
+  icon-rect: 4 2 13 13
+  icon-clip: 0 0 20 20
+  color: #9F9F9F
+  width: 190
+  height: 200
+  text-offset: 24 2
+  text-align: topLeft
+  image-source: /images/ui/miniwindow
+  image-border: 4
+  image-border-top: 20
+  image-border-bottom: 4
+  focusable: false
+  &minimizedHeight: 20
+
+  $on:
+    image-border-bottom: 2
+
+  UIWidget
+    id: miniwindowTopBar
+    anchors.top: parent.top
+    anchors.right: parent.right
+    anchors.left: parent.left
+    margin-right: 3
+    margin-left: 3
+    margin-top: 3
+    size: 258 14
+    phantom: true
+
+  UIButton
+    id: closeButton
+    anchors.top: parent.top
+    anchors.right: parent.right
+    margin-top: 2
+    margin-right: 4
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 28 0 14 14
+
+    $hover:
+      image-clip: 28 14 14 14
+
+    $pressed:
+      image-clip: 28 28 14 14
+
+  UIButton
+    id: minimizeButton
+    anchors.top: closeButton.top
+    anchors.right: closeButton.left
+    margin-right: 3
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 0 0 14 14
+
+    $hover:
+      image-clip: 0 14 14 14
+
+    $pressed:
+      image-clip: 0 28 14 14
+
+    $on:
+      image-clip: 14 0 14 14
+
+    $on hover:
+      image-clip: 14 14 14 14
+
+    $on pressed:
+      image-clip: 14 28 14 14
+
+  UIButton
+    id: lockButton
+    anchors.top: minimizeButton.top
+    anchors.right: minimizeButton.left
+    margin-right: 2
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 98 0 14 14
+
+    $hover:
+      image-clip: 98 14 14 14
+
+    $pressed:
+      image-clip: 98 28 14 14
+
+    $on:
+      image-clip: 84 0 14 14
+
+    $on hover:
+      image-clip: 84 14 14 14
+
+    $on pressed:
+      image-clip: 84 28 14 14
+
+  VerticalScrollBar
+    id: miniwindowScrollBar
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    step: 14
+    margin-top: 18
+    margin-right: 4
+    margin-bottom: 3
+    pixels-scroll: true
+
+    $!on:
+      width: 0
+
+  ResizeBorder
+    id: bottomResizeBorder
+    anchors.bottom: parent.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+    height: 3
+    minimum: 48
+    margin-left: 3
+    margin-right: 3
+    background: #ffffff88
+
+MiniWindowContents < ScrollablePanel
+  id: contentsPanel
+  anchors.fill: parent
+  anchors.right: miniwindowScrollBar.left
+  margin-left: 3
+  margin-bottom: 3
+  margin-top: 18
+  margin-right: 1
+  vertical-scrollbar: miniwindowScrollBar
+
+HeadlessMiniWindow < UIMiniWindow
+  font: verdana-11px-antialised
+  icon-rect: 4 2 13 12
+  icon-clip: 0 0 20 20
+  color: #8F8F8F
+  width: 190
+  height: 200
+  focusable: false
+  &minimizedHeight: 20
+
+  $on:
+    image-border-bottom: 2
+    
+  $!on:
+    text:
+    icon:
+
+  UIButton
+    id: minimizeButton
+    anchors.top: parent.top
+    anchors.right: parent.right
+    margin-right: 10
+    margin-top: 1
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 0 0 14 14
+
+    $hover:
+      image-clip: 0 14 14 14
+
+    $pressed:
+      image-clip: 0 28 14 14
+
+    $on:
+      image-clip: 14 0 14 14
+
+    $on hover:
+      image-clip: 14 14 14 14
+
+    $on pressed:
+      image-clip: 14 28 14 14
+      
+    $!on:
+      size: 0 0
+
+  UIWidget
+    id: miniwindowTopBar
+    anchors.top: parent.top
+    anchors.right: parent.right
+    anchors.left: parent.left
+    margin-right: 3
+    margin-left: 3
+    margin-top: 3
+    size: 258 14
+    phantom: true
+
+  UIButton
+    id: closeButton
+    anchors.top: parent.top
+    anchors.right: parent.right
+    hidden: true
+
+  VerticalScrollBar
+    id: miniwindowScrollBar
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    step: 14
+    margin-top: 16
+    margin-right: 4
+    margin-bottom: 3
+    pixels-scroll: true
+
+    $!on:
+      width: 0
+
+  ResizeBorder
+    id: bottomResizeBorder
+    anchors.bottom: parent.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+    height: 3
+    minimum: 48
+    margin-left: 3
+    margin-right: 3
+    background: #ffffff88

SabrehavenOTClient/layouts/retro/styles/40-console.otui

@@ -0,0 +1,219 @@
+ConsoleLabel < UITextEdit
+  font: verdana-11px-antialised
+  height: 14
+  color: yellow
+  margin-left: 1
+  text-wrap: true
+  text-auto-resize: true
+  selection-color: #111416
+  selection-background-color: #808080
+  change-cursor-image: false
+  cursor-visible: false
+  editable: false
+  draggable: true
+  selectable: false
+  focusable: false
+
+ConsolePhantomLabel < UILabel
+  font: verdana-11px-antialised
+  height: 14
+  color: yellow
+  text-wrap: true
+  text-auto-resize: true
+  selection-color: #111416
+  selection-background-color: #999999
+
+ConsoleTabBar < MoveableTabBar
+  height: 16
+
+ConsoleTabBarPanel < MoveableTabBarPanel
+  id: consoleTab
+
+  ScrollablePanel
+    id: consoleBuffer
+    anchors.fill: parent
+    margin-right: 12
+    vertical-scrollbar: consoleScrollBar
+    layout:
+      type: verticalBox
+      align-bottom: true
+    border-width: 1
+    border-color: #202327
+    background: #00000066
+    inverted-scroll: true
+    padding: 1
+
+  VerticalScrollBar
+    id: consoleScrollBar
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    step: 14
+    pixels-scroll: true
+
+ConsoleTabBarButton < MoveableTabBarButton
+  height: 16
+  padding: 15
+
+ConsolePanel < Panel
+  image-source: /images/ui/panel_bottom
+  image-border: 7
+  image-border-top: 29
+  
+  $first:
+    anchors.fill: parent
+    
+  $!first:
+    anchors.top: prev.bottom
+    anchors.bottom: parent.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+
+  CheckBox
+    id: toggleChat
+    !tooltip: tr('Disable chat mode, allow to walk using ASDW')
+    anchors.left: parent.left
+    anchors.top: parent.top
+    margin-left: 6
+    margin-top: 3
+    @onCheckChange: toggleChat()
+
+  TabButton
+    id: prevChannelButton
+    icon: /images/game/console/leftarrow
+    anchors.left: toggleChat.right
+    anchors.top: parent.top
+    margin-top: 1
+    size: 16 16
+    
+  ConsoleTabBar
+    id: consoleTabBar
+    anchors.left: prev.right
+    anchors.top: parent.top
+    anchors.right: next.left
+    margin-top: 0
+    tab-spacing: 2
+    movable: true
+
+  TabButton
+    id: nextChannelButton
+    icon: /images/game/console/rightarrow
+    anchors.right: next.left
+    anchors.top: parent.top
+    margin-top: 1
+    size: 16 16
+    margin-right: 5
+
+  TabButton
+    id: closeChannelButton
+    !tooltip: tr('Close this channel') .. ' (Ctrl+E)'
+    icon: /images/game/console/closechannel
+    anchors.right: next.left
+    anchors.top: parent.top
+    enabled: false
+    margin-right: 5
+    margin-top: 1
+    size: 16 16
+    icon-clip: 0 0 16 16
+
+    $pressed:
+      icon-clip: 0 16 16 16
+
+    @onClick: removeCurrentTab()
+    
+  TabButton
+    id: clearChannelButton
+    !tooltip: tr('Clear current message window')
+    icon: /images/game/console/clearchannel
+    anchors.right: next.left
+    anchors.top: parent.top
+    margin-right: 5
+    margin-top: 1
+    size: 16 16
+    icon-clip: 0 0 16 16
+
+    $pressed:
+      icon-clip: 0 16 16 16
+
+    @onClick: |
+      local consoleTabBar = self:getParent():getChildById('consoleTabBar')
+      clearChannel(consoleTabBar)
+
+  TabButton
+    id: channelsButton
+    !tooltip: tr('Open new channel') .. ' (Ctrl+O)'
+    icon: /images/game/console/channels
+    anchors.right: next.left
+    anchors.top: parent.top
+    margin-right: 5
+    margin-top: 1
+    size: 16 16
+    icon-clip: 0 0 16 16
+
+    $pressed:
+      icon-clip: 0 16 16 16
+
+    @onClick: g_game.requestChannels()
+
+  TabButton
+    id: ignoreButton
+    !tooltip: tr('Ignore players')
+    icon: /images/game/console/ignore
+    anchors.right: parent.right
+    anchors.top: parent.top
+    margin-right: 5
+    margin-top: 1
+    size: 16 16
+    icon-clip: 0 0 16 16
+
+    $pressed:
+      icon-clip: 0 16 16 16
+
+    @onClick: onClickIgnoreButton()
+
+  Panel
+    id: consoleContentPanel
+    anchors.top: consoleTabBar.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+    anchors.bottom: consoleTextEdit.top
+    margin-left: 6
+    margin-right: 6
+    margin-bottom: 2
+    margin-top: 6
+    padding: 1
+    focusable: false
+    phantom: true
+
+  TabButton
+    id: sayModeButton
+    icon: /images/game/console/say
+    !tooltip: tr('Adjust volume')
+    &sayMode: 2
+    size: 18 18
+    anchors.left: parent.left
+    anchors.bottom: parent.bottom
+    margin-left: 8
+    margin-bottom: 4
+    @onClick: sayModeChange()
+
+  HorizontalSeparator
+    id: separator
+    anchors.left: parent.left
+    anchors.right: parent.right
+    anchors.bottom: prev.top
+    margin-bottom: 3
+    margin-left: 7
+    margin-right: 7
+
+  TextEdit
+    id: consoleTextEdit
+    anchors.left: sayModeButton.right
+    anchors.right: parent.right
+    anchors.bottom: parent.bottom
+    margin-right: 7
+    margin-left: 2
+    margin-bottom: 2
+    shift-navigation: true
+    max-length: 255
+    text-auto-submit: true

SabrehavenOTClient/layouts/retro/styles/40-entergame.otui

@@ -0,0 +1,3 @@
+EnterGameWindow < StaticMainWindow
+  !text: tr('Enter Game')
+  size: 260 340

SabrehavenOTClient/layouts/retro/styles/40-gamebuttons.otui

@@ -0,0 +1,16 @@
+GameButtonsWindow < HeadlessMiniWindow
+  height: 26
+  &forceOpen: true
+  &autoOpen: 4
+
+  MiniWindowContents
+    margin-top: 2
+    
+    Panel
+      id: buttons
+      anchors.fill: parent
+      layout:
+        type: grid
+        cell-spacing: 3
+        cell-size: 20 20
+        flow: true

SabrehavenOTClient/layouts/retro/styles/40-healthinfo.otui

@@ -0,0 +1,154 @@
+ExperienceBar < ProgressBar
+  id: experienceBar
+  background-color: #B6E866
+  anchors.top: prev.bottom
+  anchors.left: parent.left
+  anchors.right: parent.right
+  margin: 1
+  margin-top: 3
+
+SoulLabel < GameLabel
+  id: soulLabel
+  text-align: right
+  color: white
+  font: verdana-11px-rounded
+  anchors.bottom: parent.bottom
+  anchors.right: parent.right
+  anchors.left: parent.horizontalCenter
+  margin-top: 5
+  margin-right: 3
+  on: true
+
+  $!on:
+    visible: false
+    margin-top: 0
+    height: 0
+
+CapLabel < GameLabel
+  id: capLabel
+  color: white
+  font: verdana-11px-rounded
+  anchors.bottom: parent.bottom
+  anchors.left: parent.left
+  anchors.right: parent.horizontalCenter
+  margin-top: 5
+  margin-left: 3
+  on: true
+
+  $!on:
+    visible: false
+    margin-top: 0
+    height: 0
+
+ConditionWidget < UIWidget
+  size: 18 18
+
+  $!first:
+    margin-left: 2
+      
+HealthOverlay < UIWidget
+  id: healthOverlay
+  anchors.fill: parent
+  phantom: true
+  
+  HealthBar
+    id: topHealthBar
+    anchors.top: parent.top
+    anchors.left: parent.left
+    anchors.right: parent.horizontalCenter
+    phantom: true
+
+  ManaBar
+    id: topManaBar
+    anchors.top: parent.top
+    anchors.right: parent.right
+    anchors.left: parent.horizontalCenter
+    phantom: true
+    
+  UIProgressBar
+    id: healthCircle
+    anchors.horizontalCenter: parent.horizontalCenter
+    anchors.verticalCenter: parent.verticalCenter
+    image-source: /images/game/circle/left_empty
+    margin-right: 169
+    margin-bottom: 16
+    opacity: 0.5
+    phantom: true
+
+  UIProgressBar
+    id: healthCircleFront
+    anchors.horizontalCenter: parent.horizontalCenter
+    anchors.verticalCenter: parent.verticalCenter
+    image-source: /images/game/circle/left_full
+    margin-right: 169
+    margin-bottom: 16
+    opacity: 0.5
+    phantom: true
+
+  UIProgressBar
+    id: manaCircle
+    anchors.horizontalCenter: parent.horizontalCenter
+    anchors.verticalCenter: parent.verticalCenter
+    image-source: /images/game/circle/right_empty    
+    margin-left: 130
+    margin-bottom: 16
+    opacity: 0.5
+    phantom: true
+
+  UIProgressBar
+    id: manaCircleFront
+    anchors.horizontalCenter: parent.horizontalCenter
+    anchors.verticalCenter: parent.verticalCenter
+    image-source: /images/game/circle/right_full
+    margin-left: 130
+    margin-bottom: 16    
+    opacity: 0.4
+    image-color: #0000FFFF
+    phantom: true
+  
+HealthInfoWindow < HeadlessMiniWindow
+  icon: 
+  text:
+  height: 100
+  &forceOpen: true
+  icon: /images/topbuttons/healthinfo
+  !text: tr('Health Info')  
+
+  MiniWindowContents
+    margin-top: 2
+    
+    HealthBar
+      id: healthBar
+      anchors.top: parent.top
+      anchors.left: parent.left
+      anchors.right: parent.right
+      margin: 2
+      margin-top: 0
+      phantom: true
+      
+    ManaBar
+      id: manaBar
+      anchors.top: prev.bottom
+      anchors.left: parent.left
+      anchors.right: parent.right
+      margin: 2
+      margin-bottom: 0
+      phantom: true
+      
+    ExperienceBar
+    Panel
+      id: conditionPanel
+      layout:
+        type: horizontalBox
+      height: 22
+      margin-top: 4
+      padding: 2
+      anchors.top: prev.bottom
+      anchors.left: parent.left
+      anchors.right: parent.right
+      border-width: 1
+      border-color: #00000077
+      background-color: #ffffff11
+    SoulLabel
+    CapLabel
+

SabrehavenOTClient/layouts/retro/styles/40-inventory.otui

@@ -0,0 +1,333 @@
+InventoryItem < Item
+  $on:
+    image-source: /images/ui/item-blessed
+
+HeadSlot < InventoryItem
+  id: slot1
+  image-source: /images/game/slots/head
+  &position: {x=65535, y=1, z=0}
+  $on:
+    image-source: /images/game/slots/head-blessed
+
+BodySlot < InventoryItem
+  id: slot4
+  image-source: /images/game/slots/body
+  &position: {x=65535, y=4, z=0}
+  $on:
+    image-source: /images/game/slots/body-blessed
+
+LegSlot < InventoryItem
+  id: slot7
+  image-source: /images/game/slots/legs
+  &position: {x=65535, y=7, z=0}
+  $on:
+    image-source: /images/game/slots/legs-blessed
+
+FeetSlot < InventoryItem
+  id: slot8
+  image-source: /images/game/slots/feet
+  &position: {x=65535, y=8, z=0}
+  $on:
+    image-source: /images/game/slots/feet-blessed
+
+NeckSlot < InventoryItem
+  id: slot2
+  image-source: /images/game/slots/neck
+  &position: {x=65535, y=2, z=0}
+  $on:
+    image-source: /images/game/slots/neck-blessed
+
+LeftSlot < InventoryItem
+  id: slot6
+  image-source: /images/game/slots/left-hand
+  &position: {x=65535, y=6, z=0}
+  $on:
+    image-source: /images/game/slots/left-hand-blessed
+
+FingerSlot < InventoryItem
+  id: slot9
+  image-source: /images/game/slots/finger
+  &position: {x=65535, y=9, z=0}
+  $on:
+    image-source: /images/game/slots/finger-blessed
+
+BackSlot < InventoryItem
+  id: slot3
+  image-source: /images/game/slots/back
+  &position: {x=65535, y=3, z=0}
+  $on:
+    image-source: /images/game/slots/back-blessed
+
+RightSlot < InventoryItem
+  id: slot5
+  image-source: /images/game/slots/right-hand
+  &position: {x=65535, y=5, z=0}
+  $on:
+    image-source: /images/game/slots/right-hand-blessed
+
+AmmoSlot < InventoryItem
+  id: slot10
+  image-source: /images/game/slots/ammo
+  &position: {x=65535, y=10, z=0}
+  $on:
+    image-source: /images/game/slots/ammo-blessed
+
+PurseButton < UIButton
+  id: purseButton
+  size: 34 12
+  !tooltip: tr('Open purse')
+  icon-source: /images/game/slots/purse
+  icon-clip: 0 0 34 12
+  
+  $on:
+    icon-clip: 0 12 34 12
+
+  $pressed:
+    icon-clip: 0 12 34 12
+
+CombatBox < UICheckBox
+  size: 20 20
+  image-clip: 0 0 20 20
+  margin-left: 4
+
+  $checked:
+    image-clip: 0 20 20 20
+
+
+InventoryButton < Button
+  height: 18
+  margin-top: 2
+  text-align: center
+  font: cipsoftFont
+  color: white
+  size: 45 20
+  text-offset: 2 2
+
+SoulCapLabel < GameLabel
+  text-align: center
+  color: #FFFFFF
+  font: cipsoftFont
+  margin-top: 4
+  text-offset: 0 3
+  width: 36
+  height: 20
+  icon-source: /images/game/slots/soulcap
+      
+FightOffensiveBox < CombatBox
+  image-source: /images/game/combatmodes/fightoffensive
+FightBalancedBox < CombatBox
+  image-source: /images/game/combatmodes/fightbalanced
+FightDefensiveBox < CombatBox
+  image-source: /images/game/combatmodes/fightdefensive
+ChaseModeBox < CombatBox
+  image-source: /images/game/combatmodes/chasemode
+SafeFightBox < CombatBox
+  image-source: /images/game/combatmodes/safefight
+
+MountButton < CombatBox
+  image-source: /images/game/combatmodes/mount    
+
+InventoryWindow < HeadlessMiniWindow
+  icon: /images/topbuttons/inventory
+  height: 178
+  id: inventoryWindow
+  @onClose: modules.game_inventory.onMiniWindowClose()
+  &save: true
+  &autoOpen: 3
+  &forceOpen: true
+
+  MiniWindowContents
+    anchors.left: parent.left
+    margin-top: 0
+    
+    UIButton
+      id: minimizeButton
+      anchors.top: parent.top
+      anchors.left: parent.left
+      size: 14 14
+      image-source: /images/ui/miniwindow_buttons
+      image-clip: 0 0 14 14
+      margin-top: 3
+      margin-left: 4
+
+      $hover:
+        image-clip: 0 14 14 14
+
+      $pressed:
+        image-clip: 0 28 14 14
+
+      $on:
+        image-clip: 14 0 14 14
+
+      $on hover:
+        image-clip: 14 14 14 14
+
+      $on pressed:
+        image-clip: 14 28 14 14
+      
+      @onClick: |
+        self:getParent():getParent().minimizeButton:onClick()
+        
+    Panel
+      id: inventoryPanel
+      margin-right: 63
+      margin-top: 2
+      anchors.fill: parent
+      
+      HeadSlot
+        anchors.top: parent.top
+        anchors.horizontalCenter: parent.horizontalCenter
+        margin-top: 3
+
+      BodySlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      LegSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      FeetSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      NeckSlot
+        anchors.top: slot1.top
+        anchors.right: slot1.left
+        margin-top: 13
+        margin-right: 5
+
+      LeftSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      FingerSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+        
+      BackSlot
+        anchors.top: slot1.top
+        anchors.left: slot1.right
+        margin-top: 13
+        margin-left: 5
+
+      RightSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      AmmoSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      SoulCapLabel
+        id: soulLabel
+        anchors.top: slot10.bottom
+        anchors.horizontalCenter: slot10.horizontalCenter
+        
+      SoulCapLabel
+        id: capLabel
+        anchors.top: slot9.bottom
+        anchors.horizontalCenter: slot9.horizontalCenter
+
+      PurseButton
+        anchors.left: slot3.left
+        anchors.bottom: slot3.top        
+        margin-bottom: 3
+  
+      Panel
+        id: conditionPanel
+        layout:
+          type: horizontalBox
+        height: 22
+        padding: 2
+        anchors.top: slot8.bottom
+        anchors.left: slot6.left
+        anchors.right: slot5.right
+        margin-top: 4
+        border-width: 1
+        border-color: #00000077
+        background-color: #ffffff22
+        
+    Panel
+      margin-top: 5
+      anchors.fill: parent
+      anchors.left: prev.right
+        
+      FightOffensiveBox
+        id: fightOffensiveBox
+        anchors.left: parent.left
+        anchors.top: parent.top        
+        margin-left: 8
+
+      ChaseModeBox
+        id: chaseModeBox
+        anchors.left: prev.right
+        anchors.top: parent.top
+
+      FightBalancedBox
+        id: fightBalancedBox
+        margin-top: 22
+        anchors.left: parent.left
+        anchors.top: parent.top
+        margin-left: 8
+        
+      SafeFightBox
+        id: safeFightBox
+        margin-top: 22
+        anchors.left: prev.right
+        anchors.top: parent.top
+
+      FightDefensiveBox
+        id: fightDefensiveBox
+        margin-top: 44
+        anchors.left: parent.left
+        anchors.top: parent.top
+        margin-left: 8
+        
+      MountButton
+        id: mountButton
+        margin-top: 44
+        anchors.left: prev.right
+        anchors.top: parent.top
+        
+      Panel
+        id: buttonsPanel
+        margin-top: 4
+        margin-right: 5
+        anchors.fill: parent
+        anchors.top: prev.bottom
+        layout:
+          type: verticalBox
+        
+        UIButton
+          id: buttonPvp
+          height: 20
+          icon: /images/game/combatmodes/pvp
+          icon-clip: 0 0 42 20
+
+          $on:
+            icon-clip: 0 20 42 20
+        
+        InventoryButton
+          !text: tr('Stop')
+          @onClick: g_game.stop(); g_game.cancelAttackAndFollow()
+
+        InventoryButton
+          !text: tr('Options')
+          @onClick: modules.client_options.toggle()
+
+        InventoryButton
+          !text: tr('Hotkeys')
+          @onClick: modules.game_hotkeys.toggle()
+
+        InventoryButton
+          !text: tr('Logout')
+          @onClick: modules.game_interface.tryLogout()
+

SabrehavenOTClient/layouts/retro/styles/40-minimap.otui

@@ -0,0 +1,261 @@
+MinimapFlag < UIWidget
+  size: 11 11
+  focusable: false
+
+MinimapCross < UIWidget
+  focusable: false
+  phantom: true
+  image: /images/game/minimap/cross
+  size: 16 16
+
+MinimapFloorUpButton < Button
+  size: 20 20
+  margin-right: 28
+  margin-bottom: 28
+  anchors.right: parent.right
+  anchors.bottom: parent.bottom
+  icon-source: /images/game/minimap/floor_up
+  icon-clip: 0 32 16 16
+  $pressed:
+    icon-clip: 0 0 16 16
+  $hover !pressed:
+    icon-clip: 0 16 16 16
+
+MinimapFloorDownButton < Button
+  size: 20 20
+  margin-right: 28
+  margin-bottom: 4
+  anchors.right: parent.right
+  anchors.bottom: parent.bottom
+  icon-source: /images/game/minimap/floor_down
+  icon-clip: 0 32 16 16
+  $pressed:
+    icon-clip: 0 0 16 16
+  $hover !pressed:
+    icon-clip: 0 16 16 16
+
+MinimapZoomInButton < Button
+  text: +
+  size: 20 20
+  margin-right: 4
+  margin-bottom: 28
+  anchors.right: parent.right
+  anchors.bottom: parent.bottom
+  //icon-source: /images/game/minimap/zoom_in
+
+MinimapZoomOutButton < Button
+  text: -
+  size: 20 20
+  margin-right: 4
+  margin-bottom: 4
+  anchors.right: parent.right
+  anchors.bottom: parent.bottom
+  //icon-source: /images/game/minimap/zoom_out
+
+MinimapResetButton < Button
+  !text: tr('Center')
+  size: 44 20
+  anchors.left: parent.left
+  anchors.top: parent.top
+  margin: 4
+
+Minimap < UIMinimap
+  draggable: true
+  focusable: false
+  cross: true
+  color: black
+
+  MinimapFloorUpButton
+    id: floorUpWidget
+    @onClick: self:getParent():floorUp(1)
+
+  MinimapFloorDownButton
+    id: floorDownWidget
+    @onClick: self:getParent():floorDown(1)
+
+  MinimapZoomInButton
+    id: zoomInWidget
+    @onClick: self:getParent():zoomIn()
+
+  MinimapZoomOutButton
+    id: zoomOutWidget
+    @onClick: self:getParent():zoomOut()
+
+  MinimapResetButton
+    id: resetWidget
+    @onClick: self:getParent():reset()
+
+
+// Minimap Flag Create Window
+
+
+MinimapFlagCheckBox < CheckBox
+  size: 15 15
+  margin-left: 2
+  image-source: /images/game/minimap/flagcheckbox
+  image-size: 15 15
+  image-border: 3
+  icon-source: /images/game/minimap/mapflags
+  icon-size: 11 11
+  icon-offset: 2 4
+  anchors.left: prev.right
+  anchors.top: prev.top
+  $!checked:
+    image-clip: 26 0 26 26
+  $hover !checked:
+    image-clip: 78 0 26 26
+  $checked:
+    image-clip: 0 0 26 26
+  $hover checked:
+    image-clip: 52 0 26 26
+
+MinimapFlagWindow < MainWindow
+  !text: tr('Create Map Mark')
+  size: 196 185
+
+  Label
+    !text: tr('Position') .. ':'
+    text-auto-resize: true
+    anchors.top: parent.top
+    anchors.left: parent.left
+    margin-top: 2
+
+  Label
+    id: position
+    text-auto-resize: true
+    anchors.top: parent.top
+    anchors.right: parent.right
+    margin-top: 2
+
+  Label
+    !text: tr('Description') .. ':'
+    anchors.left: parent.left
+    anchors.top: prev.bottom
+    margin-top: 7
+
+  TextEdit
+    id: description
+    margin-top: 3
+    anchors.left: parent.left
+    anchors.top: prev.bottom
+    anchors.right: parent.right
+
+  MinimapFlagCheckBox
+    id: flag0
+    icon-source: /images/game/minimap/flag0
+    anchors.left: parent.left
+    anchors.top: prev.bottom
+    margin-top: 6
+    margin-left: 0  
+
+  MinimapFlagCheckBox
+    id: flag1
+    icon-source: /images/game/minimap/flag1
+
+  MinimapFlagCheckBox
+    id: flag2
+    icon-source: /images/game/minimap/flag2
+
+  MinimapFlagCheckBox
+    id: flag3
+    icon-source: /images/game/minimap/flag3
+
+  MinimapFlagCheckBox
+    id: flag4
+    icon-source: /images/game/minimap/flag4
+
+  MinimapFlagCheckBox
+    id: flag5
+    icon-source: /images/game/minimap/flag5
+
+  MinimapFlagCheckBox
+    id: flag6
+    icon-source: /images/game/minimap/flag6
+
+  MinimapFlagCheckBox
+    id: flag7
+    icon-source: /images/game/minimap/flag7
+
+  MinimapFlagCheckBox
+    id: flag8
+    icon-source: /images/game/minimap/flag8
+
+  MinimapFlagCheckBox
+    id: flag9
+    icon-source: /images/game/minimap/flag9
+
+  MinimapFlagCheckBox
+    id: flag10
+    icon-source: /images/game/minimap/flag10
+    anchors.left: parent.left
+    anchors.top: prev.bottom
+    margin-top: 6
+    margin-left: 0  
+
+  MinimapFlagCheckBox
+    id: flag11
+    icon-source: /images/game/minimap/flag11
+
+  MinimapFlagCheckBox
+    id: flag12
+    icon-source: /images/game/minimap/flag12
+
+  MinimapFlagCheckBox
+    id: flag13
+    icon-source: /images/game/minimap/flag13
+
+  MinimapFlagCheckBox
+    id: flag14
+    icon-source: /images/game/minimap/flag14
+
+  MinimapFlagCheckBox
+    id: flag15
+    icon-source: /images/game/minimap/flag15
+
+  MinimapFlagCheckBox
+    id: flag16
+    icon-source: /images/game/minimap/flag16
+
+  MinimapFlagCheckBox
+    id: flag17
+    icon-source: /images/game/minimap/flag17
+
+  MinimapFlagCheckBox
+    id: flag18
+    icon-source: /images/game/minimap/flag18
+
+  MinimapFlagCheckBox
+    id: flag19
+    icon-source: /images/game/minimap/flag19
+
+  Button
+    id: okButton
+    !text: tr('Ok')
+    width: 64
+    anchors.right: next.left
+    anchors.bottom: parent.bottom
+    margin-right: 10
+
+  Button
+    id: cancelButton
+    !text: tr('Cancel')
+    width: 64
+    anchors.right: parent.right
+    anchors.bottom: parent.bottom
+
+MinimapWindow < HeadlessMiniWindow
+  height: 150
+  &forceOpen: true
+
+  MiniWindowContents
+    margin: 5
+
+    Minimap
+      id: minimap
+      anchors.fill: parent
+
+  ResizeBorder
+    anchors.right: parent.right
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    enabled: true