From 8418098dd8e95fa07b8ec05eda35f9f345debf21 Mon Sep 17 00:00:00 2001
From: Jesse Rougeau <jmaster9999@gmail.com>
Date: Sun, 13 Mar 2022 19:33:19 -0700
Subject: [PATCH] Lobby Refactor (#7077)

---
 .../GameTicking/Managers/ClientGameTicker.cs  |   4 +-
 Content.Client/Info/DevInfoBanner.cs          |  32 ++++++
 Content.Client/Info/LinkBanner.cs             |  43 ++++++++
 Content.Client/Info/ServerInfo.cs             |  41 -------
 Content.Client/Lobby/LobbyState.cs            |  43 ++------
 .../Lobby/UI/LobbyCharacterPreviewPanel.cs    |  36 +++---
 Content.Client/Lobby/UI/LobbyGui.xaml         | 103 ++++++++----------
 Content.Client/Lobby/UI/LobbyGui.xaml.cs      |  96 ----------------
 .../UserInterface/Controls/HLine.cs           |  46 ++++++++
 .../UserInterface/Controls/HSpacer.cs         |  21 ++++
 .../UserInterface/Controls/VSpacer.cs         |  20 ++++
 .../GameTicking/GameTicker.Lobby.cs           |   2 +-
 .../GameTicking/GameTicker.LobbyBackground.cs |  33 ++++++
 Content.Server/GameTicking/GameTicker.cs      |   1 +
 .../GameTicking/SharedGameTicker.cs           |   4 +-
 Resources/Locale/en-US/lobby/lobby-gui.ftl    |   1 +
 .../LobbyScreens/PutLobbyScreensHere.txt      |   2 +
 17 files changed, 278 insertions(+), 250 deletions(-)
 create mode 100644 Content.Client/Info/DevInfoBanner.cs
 create mode 100644 Content.Client/Info/LinkBanner.cs
 create mode 100644 Content.Client/UserInterface/Controls/HLine.cs
 create mode 100644 Content.Client/UserInterface/Controls/HSpacer.cs
 create mode 100644 Content.Client/UserInterface/Controls/VSpacer.cs
 create mode 100644 Content.Server/GameTicking/GameTicker.LobbyBackground.cs
 create mode 100644 Resources/Textures/LobbyScreens/PutLobbyScreensHere.txt

diff --git a/Content.Client/GameTicking/Managers/ClientGameTicker.cs b/Content.Client/GameTicking/Managers/ClientGameTicker.cs
index bc37a6e4d6..b1451b73e8 100644
--- a/Content.Client/GameTicking/Managers/ClientGameTicker.cs
+++ b/Content.Client/GameTicking/Managers/ClientGameTicker.cs
@@ -9,6 +9,7 @@ using Content.Shared.Station;
 using JetBrains.Annotations;
 using Robust.Client.Graphics;
 using Robust.Client.State;
+using Robust.Shared.ContentPack;
 using Robust.Shared.IoC;
 using Robust.Shared.Log;
 using Robust.Shared.Network;
@@ -21,7 +22,6 @@ namespace Content.Client.GameTicking.Managers
     public sealed class ClientGameTicker : SharedGameTicker
     {
         [Dependency] private readonly IStateManager _stateManager = default!;
-
         [ViewVariables] private bool _initialized;
         private Dictionary<StationId, Dictionary<string, int>>  _jobsAvailable = new();
         private Dictionary<StationId, string> _stationNames = new();
@@ -29,6 +29,7 @@ namespace Content.Client.GameTicking.Managers
         [ViewVariables] public bool AreWeReady { get; private set; }
         [ViewVariables] public bool IsGameStarted { get; private set; }
         [ViewVariables] public string? LobbySong { get; private set; }
+        [ViewVariables] public string? LobbyBackground { get; private set; }
         [ViewVariables] public bool DisallowedLateJoin { get; private set; }
         [ViewVariables] public string? ServerInfoBlob { get; private set; }
         [ViewVariables] public TimeSpan StartTime { get; private set; }
@@ -89,6 +90,7 @@ namespace Content.Client.GameTicking.Managers
             IsGameStarted = message.IsRoundStarted;
             AreWeReady = message.YouAreReady;
             LobbySong = message.LobbySong;
+            LobbyBackground = message.LobbyBackground;
             Paused = message.Paused;
             if (IsGameStarted)
                 Status.Clear();
diff --git a/Content.Client/Info/DevInfoBanner.cs b/Content.Client/Info/DevInfoBanner.cs
new file mode 100644
index 0000000000..9898b60f83
--- /dev/null
+++ b/Content.Client/Info/DevInfoBanner.cs
@@ -0,0 +1,32 @@
+using Content.Client.Changelog;
+using Content.Client.Credits;
+using Content.Client.Links;
+using Robust.Client.UserInterface;
+using Robust.Client.UserInterface.Controls;
+using Robust.Shared.IoC;
+using Robust.Shared.Localization;
+using Robust.Shared.Utility;
+
+namespace Content.Client.Info
+{
+    public sealed class DevInfoBanner : BoxContainer
+    {
+        public DevInfoBanner() {
+            var buttons = new BoxContainer
+            {
+                Orientation = LayoutOrientation.Horizontal
+            };
+            AddChild(buttons);
+
+            var uriOpener = IoCManager.Resolve<IUriOpener>();
+
+            var reportButton = new Button {Text = Loc.GetString("server-info-report-button")};
+            reportButton.OnPressed += args => uriOpener.OpenUri(UILinks.BugReport);
+
+            var creditsButton = new Button {Text = Loc.GetString("server-info-credits-button")};
+            creditsButton.OnPressed += args => new CreditsWindow().Open();
+            buttons.AddChild(reportButton);
+            buttons.AddChild(creditsButton);
+        }
+    }
+}
diff --git a/Content.Client/Info/LinkBanner.cs b/Content.Client/Info/LinkBanner.cs
new file mode 100644
index 0000000000..b79293bd37
--- /dev/null
+++ b/Content.Client/Info/LinkBanner.cs
@@ -0,0 +1,43 @@
+using Content.Client.Changelog;
+using Content.Client.Credits;
+using Content.Client.Links;
+using Robust.Client.UserInterface;
+using Robust.Client.UserInterface.Controls;
+using Robust.Shared.IoC;
+using Robust.Shared.Localization;
+using Robust.Shared.Utility;
+
+namespace Content.Client.Info
+{
+    public sealed class LinkBanner : BoxContainer
+    {
+        public LinkBanner()
+        {
+            var buttons = new BoxContainer
+            {
+                Orientation = LayoutOrientation.Horizontal
+            };
+            AddChild(buttons);
+
+            var uriOpener = IoCManager.Resolve<IUriOpener>();
+
+            var rulesButton = new Button() {Text = Loc.GetString("server-info-rules-button")};
+            rulesButton.OnPressed += args => new RulesAndInfoWindow().Open();
+
+            var discordButton = new Button {Text = Loc.GetString("server-info-discord-button")};
+            discordButton.OnPressed += args => uriOpener.OpenUri(UILinks.Discord);
+
+            var websiteButton = new Button {Text = Loc.GetString("server-info-website-button")};
+            websiteButton.OnPressed += args => uriOpener.OpenUri(UILinks.Website);
+
+            var wikiButton = new Button {Text = Loc.GetString("server-info-wiki-button")};
+            wikiButton.OnPressed += args => uriOpener.OpenUri(UILinks.Wiki);
+            var changelogButton = new ChangelogButton();
+            buttons.AddChild(changelogButton);
+            buttons.AddChild(rulesButton);
+            buttons.AddChild(discordButton);
+            buttons.AddChild(websiteButton);
+            buttons.AddChild(wikiButton);
+        }
+    }
+}
diff --git a/Content.Client/Info/ServerInfo.cs b/Content.Client/Info/ServerInfo.cs
index 455950d929..f072c50397 100644
--- a/Content.Client/Info/ServerInfo.cs
+++ b/Content.Client/Info/ServerInfo.cs
@@ -22,48 +22,7 @@ namespace Content.Client.Info
                 VerticalExpand = true
             };
             AddChild(_richTextLabel);
-
-            var buttons = new BoxContainer
-            {
-                Orientation = LayoutOrientation.Horizontal
-            };
-            AddChild(buttons);
-
-            var uriOpener = IoCManager.Resolve<IUriOpener>();
-
-            var rulesButton = new Button() { Text = Loc.GetString("server-info-rules-button") };
-            rulesButton.OnPressed += args => new RulesAndInfoWindow().Open();
-
-            var discordButton = new Button {Text = Loc.GetString("server-info-discord-button") };
-            discordButton.OnPressed += args => uriOpener.OpenUri(UILinks.Discord);
-
-            var websiteButton = new Button {Text = Loc.GetString("server-info-website-button") };
-            websiteButton.OnPressed += args => uriOpener.OpenUri(UILinks.Website);
-
-            var wikiButton = new Button {Text = Loc.GetString("server-info-wiki-button") };
-            wikiButton.OnPressed += args => uriOpener.OpenUri(UILinks.Wiki);
-
-            var reportButton = new Button { Text = Loc.GetString("server-info-report-button") };
-            reportButton.OnPressed += args => uriOpener.OpenUri(UILinks.BugReport);
-
-            var creditsButton = new Button { Text = Loc.GetString("server-info-credits-button") };
-            creditsButton.OnPressed += args => new CreditsWindow().Open();
-
-            var changelogButton = new ChangelogButton
-            {
-                HorizontalExpand = true,
-                HorizontalAlignment = HAlignment.Right
-            };
-
-            buttons.AddChild(rulesButton);
-            buttons.AddChild(discordButton);
-            buttons.AddChild(websiteButton);
-            buttons.AddChild(wikiButton);
-            buttons.AddChild(reportButton);
-            buttons.AddChild(creditsButton);
-            buttons.AddChild(changelogButton);
         }
-
         public void SetInfoBlob(string markup)
         {
             _richTextLabel.SetMessage(FormattedMessage.FromMarkup(markup));
diff --git a/Content.Client/Lobby/LobbyState.cs b/Content.Client/Lobby/LobbyState.cs
index f9a88a778b..5d128c32b8 100644
--- a/Content.Client/Lobby/LobbyState.cs
+++ b/Content.Client/Lobby/LobbyState.cs
@@ -8,6 +8,7 @@ using Content.Client.LateJoin;
 using Content.Client.Lobby.UI;
 using Content.Client.Preferences;
 using Content.Client.Preferences.UI;
+using Content.Client.Resources;
 using Content.Client.Voting;
 using Content.Shared.GameTicking;
 using Robust.Client;
@@ -22,6 +23,7 @@ using Robust.Shared.IoC;
 using Robust.Shared.Localization;
 using Robust.Shared.Prototypes;
 using Robust.Shared.Timing;
+using Robust.Shared.Utility;
 using Robust.Shared.ViewVariables;
 
 namespace Content.Client.Lobby
@@ -104,12 +106,10 @@ namespace Content.Client.Lobby
             _lobby.LeaveButton.OnPressed += _ => _consoleHost.ExecuteCommand("disconnect");
             _lobby.OptionsButton.OnPressed += _ => new OptionsMenu().Open();
 
-            UpdatePlayerList();
 
             _playerManager.PlayerListUpdated += PlayerManagerOnPlayerListUpdated;
             _gameTicker.InfoBlobUpdated += UpdateLobbyUi;
             _gameTicker.LobbyStatusUpdated += LobbyStatusUpdated;
-            _gameTicker.LobbyReadyUpdated += LobbyReadyUpdated;
             _gameTicker.LobbyLateJoinStatusUpdated += LobbyLateJoinStatusUpdated;
         }
 
@@ -118,7 +118,6 @@ namespace Content.Client.Lobby
             _playerManager.PlayerListUpdated -= PlayerManagerOnPlayerListUpdated;
             _gameTicker.InfoBlobUpdated -= UpdateLobbyUi;
             _gameTicker.LobbyStatusUpdated -= LobbyStatusUpdated;
-            _gameTicker.LobbyReadyUpdated -= LobbyReadyUpdated;
             _gameTicker.LobbyLateJoinStatusUpdated -= LobbyLateJoinStatusUpdated;
 
             _lobby?.Dispose();
@@ -176,14 +175,12 @@ namespace Content.Client.Lobby
                 }
             }
 
-            UpdatePlayerList();
         }
 
-        private void LobbyReadyUpdated() => UpdatePlayerList();
 
         private void LobbyStatusUpdated()
         {
-            UpdatePlayerList();
+            UpdateLobbyBackground();
             UpdateLobbyUi();
         }
 
@@ -222,35 +219,18 @@ namespace Content.Client.Lobby
             }
         }
 
-        private void UpdatePlayerList()
+        private void UpdateLobbyBackground()
         {
             if (_lobby == null) return;
-            _lobby.OnlinePlayerList.Clear();
-            var gameTicker = EntitySystem.Get<ClientGameTicker>();
-
-            foreach (var session in _playerManager.Sessions.OrderBy(s => s.Name))
+            if (_gameTicker.LobbyBackground != null)
             {
-                var readyState = string.Empty;
-                // Don't show ready state if we're ingame
-                if (!gameTicker.IsGameStarted)
-                {
-                    LobbyPlayerStatus status;
-                    if (session.UserId == _playerManager.LocalPlayer?.UserId)
-                        status = gameTicker.AreWeReady ? LobbyPlayerStatus.Ready : LobbyPlayerStatus.NotReady;
-                    else
-                        gameTicker.Status.TryGetValue(session.UserId, out status);
-
-                    readyState = status switch
-                    {
-                        LobbyPlayerStatus.NotReady => Loc.GetString("lobby-state-player-status-not-ready"),
-                        LobbyPlayerStatus.Ready => Loc.GetString("lobby-state-player-status-ready"),
-                        LobbyPlayerStatus.Observer => Loc.GetString("lobby-state-player-status-observer"),
-                        _ => string.Empty,
-                    };
-                }
-
-                _lobby.OnlinePlayerList.AddItem(session.Name, readyState);
+                _lobby.Background.Texture = _resourceCache.GetResource<TextureResource>(_gameTicker.LobbyBackground );
             }
+            else
+            {
+                _lobby.Background.Texture = null;
+            }
+
         }
 
         private void SetReady(bool newReady)
@@ -261,7 +241,6 @@ namespace Content.Client.Lobby
             }
 
             _consoleHost.ExecuteCommand($"toggleready {newReady}");
-            UpdatePlayerList();
         }
     }
 }
diff --git a/Content.Client/Lobby/UI/LobbyCharacterPreviewPanel.cs b/Content.Client/Lobby/UI/LobbyCharacterPreviewPanel.cs
index 4937ea34f8..7370a43546 100644
--- a/Content.Client/Lobby/UI/LobbyCharacterPreviewPanel.cs
+++ b/Content.Client/Lobby/UI/LobbyCharacterPreviewPanel.cs
@@ -2,6 +2,7 @@ using System.Linq;
 using Content.Client.HUD.UI;
 using Content.Client.Inventory;
 using Content.Client.Preferences;
+using Content.Client.UserInterface.Controls;
 using Content.Shared.CharacterAppearance.Systems;
 using Content.Shared.GameTicking;
 using Content.Shared.Inventory;
@@ -23,23 +24,20 @@ namespace Content.Client.Lobby.UI
 {
     public sealed class LobbyCharacterPreviewPanel : Control
     {
-        private readonly IEntityManager _entMan;
-        private readonly IClientPreferencesManager _preferencesManager;
-        private readonly IPrototypeManager _prototypeManager;
+        [Dependency] private readonly IEntityManager _entityManager = default!;
+        [Dependency] private readonly IClientPreferencesManager _preferencesManager = default!;
+        [Dependency] private readonly IPrototypeManager _prototypeManager = default!;
+
+
         private EntityUid? _previewDummy;
         private readonly Label _summaryLabel;
         private readonly BoxContainer _loaded;
         private readonly BoxContainer _viewBox;
         private readonly Label _unloaded;
 
-        public LobbyCharacterPreviewPanel(IEntityManager entityManager,
-            IClientPreferencesManager preferencesManager,
-            IPrototypeManager prototypeManager)
+        public LobbyCharacterPreviewPanel()
         {
-            _entMan = entityManager;
-            _preferencesManager = preferencesManager;
-            _prototypeManager = prototypeManager;
-
+            IoCManager.InjectDependencies(this);
             var header = new NanoHeading
             {
                 Text = Loc.GetString("lobby-character-preview-panel-header")
@@ -57,9 +55,6 @@ namespace Content.Client.Lobby.UI
             {
                 Orientation = LayoutOrientation.Vertical
             };
-
-            vBox.AddChild(header);
-
             _unloaded = new Label { Text = Loc.GetString("lobby-character-preview-panel-unloaded-preferences-label") };
 
             _loaded = new BoxContainer
@@ -67,17 +62,18 @@ namespace Content.Client.Lobby.UI
                 Orientation = LayoutOrientation.Vertical,
                 Visible = false
             };
-
-            _loaded.AddChild(CharacterSetupButton);
-            _loaded.AddChild(_summaryLabel);
-
             _viewBox = new BoxContainer
             {
                 Orientation = LayoutOrientation.Horizontal
             };
+            var _vSpacer = new VSpacer();
 
+            _loaded.AddChild(_summaryLabel);
             _loaded.AddChild(_viewBox);
+            _loaded.AddChild(_vSpacer);
+            _loaded.AddChild(CharacterSetupButton);
 
+            vBox.AddChild(header);
             vBox.AddChild(_loaded);
             vBox.AddChild(_unloaded);
             AddChild(vBox);
@@ -95,7 +91,7 @@ namespace Content.Client.Lobby.UI
             _preferencesManager.OnServerDataLoaded -= UpdateUI;
 
             if (!disposing) return;
-            if (_previewDummy != null) _entMan.DeleteEntity(_previewDummy.Value);
+            if (_previewDummy != null) _entityManager.DeleteEntity(_previewDummy.Value);
             _previewDummy = default;
         }
 
@@ -103,7 +99,7 @@ namespace Content.Client.Lobby.UI
         {
             return new()
             {
-                Sprite = _entMan.GetComponent<ISpriteComponent>(entity),
+                Sprite = _entityManager.GetComponent<ISpriteComponent>(entity),
                 OverrideDirection = direction,
                 Scale = (2, 2)
             };
@@ -126,7 +122,7 @@ namespace Content.Client.Lobby.UI
                 }
                 else
                 {
-                    _previewDummy = _entMan.SpawnEntity(_prototypeManager.Index<SpeciesPrototype>(selectedCharacter.Species).DollPrototype, MapCoordinates.Nullspace);
+                    _previewDummy = _entityManager.SpawnEntity(_prototypeManager.Index<SpeciesPrototype>(selectedCharacter.Species).DollPrototype, MapCoordinates.Nullspace);
                     var viewSouth = MakeSpriteView(_previewDummy.Value, Direction.South);
                     var viewNorth = MakeSpriteView(_previewDummy.Value, Direction.North);
                     var viewWest = MakeSpriteView(_previewDummy.Value, Direction.West);
diff --git a/Content.Client/Lobby/UI/LobbyGui.xaml b/Content.Client/Lobby/UI/LobbyGui.xaml
index 8bc9797a13..038c03b3db 100644
--- a/Content.Client/Lobby/UI/LobbyGui.xaml
+++ b/Content.Client/Lobby/UI/LobbyGui.xaml
@@ -1,10 +1,10 @@
 <Control xmlns="https://spacestation14.io"
          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-         xmlns:gfx="clr-namespace:Robust.Client.Graphics;assembly=Robust.Client"
          xmlns:maths="clr-namespace:Robust.Shared.Maths;assembly=Robust.Shared.Maths"
          xmlns:cc="clr-namespace:Content.Client.Administration.UI.CustomControls"
+         xmlns:ui="clr-namespace:Content.Client.UserInterface.Controls"
          xmlns:parallax="clr-namespace:Content.Client.Parallax"
-         xmlns:ui="clr-namespace:Content.Client.Voting.UI"
+         xmlns:vote="clr-namespace:Content.Client.Voting.UI"
          xmlns:style="clr-namespace:Content.Client.Stylesheets"
          xmlns:hudUi="clr-namespace:Content.Client.HUD.UI"
          xmlns:chatUi="clr-namespace:Content.Client.Chat.UI"
@@ -13,29 +13,12 @@
     <Control>
         <!-- Parallax background -->
         <parallax:ParallaxControl />
-
-        <Control Margin="20 20 20 20">
-            <PanelContainer StyleClasses="AngleRect" />
-            <BoxContainer Orientation="Vertical">
-                <!-- Top row -->
-                <BoxContainer Orientation="Horizontal" MinSize="0 40">
-                    <Label Margin="8 0 0 0" StyleClasses="LabelHeadingBigger" VAlign="Center" Text="{Loc 'ui-lobby-title'}" />
-                    <Label Name="ServerName" Access="Public" StyleClasses="LabelHeadingBigger" VAlign="Center" />
-                    <ui:VoteCallMenuButton Name="CallVoteButton" StyleClasses="ButtonBig" />
-                    <Button Name="OptionsButton" Access="Public" StyleClasses="ButtonBig" Text="{Loc 'ui-lobby-options-button'}" />
-                    <Button Name="LeaveButton" Access="Public" StyleClasses="ButtonBig" Text="{Loc 'ui-lobby-leave-button'}" />
-                </BoxContainer>
-                <!-- Gold line -->
-                <PanelContainer>
-                    <PanelContainer.PanelOverride>
-                        <gfx:StyleBoxFlat BackgroundColor="{x:Static style:StyleNano.NanoGold}"
-                                          ContentMarginTopOverride="2" />
-                    </PanelContainer.PanelOverride>
-                </PanelContainer>
-                <!-- Middle section with the two vertical panels -->
-                <BoxContainer Orientation="Horizontal" VerticalExpand="True">
-                    <!-- Left panel -->
-                    <BoxContainer Orientation="Vertical" Name="LeftPanelContainer" HorizontalExpand="True">
+        <TextureRect Access="Public" Name = "Background" Stretch="Scale"/>
+        <Control Margin="10 10 10 10" >
+            <!-- Left Top Panel -->
+                <PanelContainer StyleClasses="AngleRect" HorizontalAlignment="Left" Name = "LeftSideTop" VerticalExpand="True"  VerticalAlignment="Top" >
+                    <BoxContainer Orientation="Vertical" HorizontalAlignment="Center" MaxWidth="620">
+                        <info:LinkBanner Name="LinkBanner" VerticalExpand="false" HorizontalAlignment="Center" Margin="3 3 3 3"/>
                         <hudUi:StripeBack>
                             <BoxContainer Orientation="Horizontal" SeparationOverride="6" Margin="3 3 3 3">
                                 <cc:UICommandButton Command="observe" Name="ObserveButton" Access="Public" Text="{Loc 'ui-lobby-observe-button'}" StyleClasses="ButtonBig"  WindowType="{x:Type lobbyUi:ObserveWarningWindow}"/>
@@ -46,41 +29,45 @@
                                        StyleClasses="LabelBig" HorizontalExpand="True" />
                                 <Button Name="ReadyButton" Access="Public" ToggleMode="True" Text="{Loc 'ui-lobby-ready-up-button'}"
                                         StyleClasses="ButtonBig" />
-                            </BoxContainer>
-                        </hudUi:StripeBack>
-                        <chatUi:ChatBox Name="Chat" Access="Public" VerticalExpand="True" Margin="3 3 3 3"/>
+                            </BoxContainer></hudUi:StripeBack>
                     </BoxContainer>
-                    <!-- Gold line -->
-                    <PanelContainer MinSize="2 0">
-                        <PanelContainer.PanelOverride>
-                            <gfx:StyleBoxFlat BackgroundColor="{x:Static style:StyleNano.NanoGold}" />
-                        </PanelContainer.PanelOverride>
-                    </PanelContainer>
-                    <!-- Right panel -->
-                    <Control HorizontalExpand="True">
-                        <BoxContainer Orientation="Vertical">
-                            <!-- Player list -->
-                            <hudUi:NanoHeading Text="{Loc 'ui-lobby-online-players-block'}" />
-                            <lobbyUi:LobbyPlayerList Name="OnlinePlayerList"
-                                                     Access="Public"
-                                                     HorizontalExpand="True"
-                                                     VerticalExpand="True"
-                                                     Margin="3 3 3 3" />
-                            <!-- Server info -->
-                            <hudUi:NanoHeading Text="{Loc 'ui-lobby-server-info-block'}" />
-                            <info:ServerInfo Name="ServerInfo"
-                                             Access="Public"
-                                             VerticalExpand="True"
-                                             Margin="3 3 3 3"/>
-                        </BoxContainer>
-                        <BoxContainer Orientation="Vertical"
-                                      Name="VoteContainer"
-                                      Access="Public"
-                                      HorizontalAlignment="Right"
-                                      Margin="0 8 8 0" />
-                    </Control>
-                </BoxContainer>
+                </PanelContainer>
+            <!-- Left Bot Panel -->
+            <BoxContainer Orientation="Vertical" HorizontalAlignment="Left" VerticalAlignment="Bottom" MaxWidth="620">
+                <info:DevInfoBanner Name="DevInfoBanner" VerticalExpand="false" Margin="3 3 3 3"/>
             </BoxContainer>
+            <!-- RightPanel Panel -->
+            <PanelContainer Name="RightSide" StyleClasses="AngleRect" HorizontalAlignment= "Right" VerticalExpand="True" VerticalAlignment="Stretch">
+                <BoxContainer Orientation="Vertical">
+                <!-- Top row -->
+                <BoxContainer Orientation="Horizontal" MinSize="0 40" Name="HeaderContainer" Access="Public">
+                    <Label Margin="8 0 0 0" StyleClasses="LabelHeadingBigger" VAlign="Center" Text="{Loc 'ui-lobby-title'}" />
+                    <Label Name="ServerName" Access="Public" StyleClasses="LabelHeadingBigger" VAlign="Center" />
+                </BoxContainer>
+                <!-- Gold line -->
+                <ui:HLine Color="{x:Static style:StyleNano.NanoGold}" Thickness="2"/>
+                <ui:HSpacer Spacing="10"/>
+                <!-- Voting bar -->
+                <BoxContainer Orientation="Horizontal" MinSize="0 40" Name="VoteContainer" Access="Public" HorizontalAlignment="Right">
+                    <cc:CommandButton Name = "AHelpButton" Command="openahelp" Access="Public" Text = "{Loc 'ui-lobby-ahelp-button'}" StyleClasses="ButtonBig"/>
+                    <vote:VoteCallMenuButton Name="CallVoteButton" StyleClasses="ButtonBig" />
+                    <Button Name="OptionsButton" Access="Public" StyleClasses="ButtonBig" Text="{Loc 'ui-lobby-options-button'}" />
+                    <Button Name="LeaveButton" Access="Public" StyleClasses="ButtonBig" Text="{Loc 'ui-lobby-leave-button'}" />
+                </BoxContainer>
+                <ui:HSpacer Spacing="10"/>
+                <!-- Server info -->
+                <hudUi:NanoHeading Text="{Loc 'ui-lobby-server-info-block'}" />
+                <info:ServerInfo Name="ServerInfo" Access="Public" MinSize="0 30" VerticalExpand="false" Margin="3 3 3 3" MaxWidth="400"/>
+                <ui:HSpacer Spacing="5"/>
+                <lobbyUi:LobbyCharacterPreviewPanel Name="CharacterPreview" Access="Public"></lobbyUi:LobbyCharacterPreviewPanel>
+                <ui:HSpacer Spacing="5"/>
+                <BoxContainer MinHeight="10"/>
+                <!-- Gold line -->
+                <ui:HLine Color="{x:Static style:StyleNano.NanoGold}" Thickness="2" Access="Public"/>
+                <ui:HSpacer Spacing="10"/>
+                <chatUi:ChatBox Name="Chat" Access="Public" VerticalExpand="True" Margin="3 3 3 3" MinHeight="50"/>
+                </BoxContainer>
+            </PanelContainer>
         </Control>
     </Control>
 </Control>
diff --git a/Content.Client/Lobby/UI/LobbyGui.xaml.cs b/Content.Client/Lobby/UI/LobbyGui.xaml.cs
index 7b9e5b702b..b332809a79 100644
--- a/Content.Client/Lobby/UI/LobbyGui.xaml.cs
+++ b/Content.Client/Lobby/UI/LobbyGui.xaml.cs
@@ -17,108 +17,12 @@ namespace Content.Client.Lobby.UI
     [GenerateTypedNameReferences]
     internal sealed partial class LobbyGui : Control
     {
-        public LobbyCharacterPreviewPanel CharacterPreview { get; }
-
         public LobbyGui(IEntityManager entityManager,
             IClientPreferencesManager preferencesManager)
         {
             RobustXamlLoader.Load(this);
-
             ServerName.HorizontalExpand = true;
             ServerName.HorizontalAlignment = HAlignment.Center;
-
-            CharacterPreview = new LobbyCharacterPreviewPanel(
-                entityManager,
-                preferencesManager,
-                IoCManager.Resolve<IPrototypeManager>())
-            {
-                HorizontalAlignment = HAlignment.Left
-            };
-
-            LeftPanelContainer.AddChild(CharacterPreview);
-            CharacterPreview.SetPositionFirst();
-        }
-    }
-
-    public sealed class LobbyPlayerList : Control
-    {
-        private readonly ScrollContainer _scroll;
-        private readonly BoxContainer _vBox;
-
-        public LobbyPlayerList()
-        {
-            var panel = new PanelContainer()
-            {
-                PanelOverride = new StyleBoxFlat { BackgroundColor = Color.FromHex("#202028") },
-            };
-            _vBox = new BoxContainer
-            {
-                Orientation = LayoutOrientation.Vertical
-            };
-            _scroll = new ScrollContainer();
-            _scroll.AddChild(_vBox);
-            panel.AddChild(_scroll);
-            AddChild(panel);
-        }
-
-        // Adds a row
-        public void AddItem(string name, string status)
-        {
-            var hbox = new BoxContainer
-            {
-                Orientation = LayoutOrientation.Horizontal,
-                HorizontalExpand = true,
-            };
-
-            // Player Name
-            hbox.AddChild(new PanelContainer()
-            {
-                PanelOverride = new StyleBoxFlat
-                {
-                    BackgroundColor = Color.FromHex("#373744"),
-                    ContentMarginBottomOverride = 2,
-                    ContentMarginLeftOverride = 4,
-                    ContentMarginRightOverride = 4,
-                    ContentMarginTopOverride = 2
-                },
-                Children =
-                {
-                    new Label
-                    {
-                        Text = name
-                    }
-                },
-                HorizontalExpand = true
-            });
-            // Status
-            hbox.AddChild(new PanelContainer()
-            {
-                PanelOverride = new StyleBoxFlat
-                {
-                    BackgroundColor = Color.FromHex("#373744"),
-                    ContentMarginBottomOverride = 2,
-                    ContentMarginLeftOverride = 4,
-                    ContentMarginRightOverride = 4,
-                    ContentMarginTopOverride = 2
-                },
-                Children =
-                {
-                    new Label
-                    {
-                        Text = status
-                    }
-                },
-                HorizontalExpand = true,
-                SizeFlagsStretchRatio = 0.2f,
-            });
-
-            _vBox.AddChild(hbox);
-        }
-
-        // Deletes all rows
-        public void Clear()
-        {
-            _vBox.RemoveAllChildren();
         }
     }
 }
diff --git a/Content.Client/UserInterface/Controls/HLine.cs b/Content.Client/UserInterface/Controls/HLine.cs
new file mode 100644
index 0000000000..656768cd2b
--- /dev/null
+++ b/Content.Client/UserInterface/Controls/HLine.cs
@@ -0,0 +1,46 @@
+using Content.Client.Stylesheets;
+using Robust.Client.Graphics;
+using Robust.Client.UserInterface;
+using Robust.Client.UserInterface.Controls;
+using Robust.Shared.Maths;
+
+namespace Content.Client.UserInterface.Controls;
+
+public sealed class HLine : Container
+{
+    public Color? Color
+    {
+        get
+        {
+            if (_line.PanelOverride is StyleBoxFlat styleBox) return styleBox.BackgroundColor;
+            return null;
+        }
+        set
+        {
+            if (_line.PanelOverride is StyleBoxFlat styleBox) styleBox.BackgroundColor = value!.Value;
+        }
+    }
+
+    public float? Thickness {
+        get
+        {
+            if (_line.PanelOverride is StyleBoxFlat styleBox) return styleBox.ContentMarginTopOverride;
+            return null;
+        }
+        set
+        {
+            if (_line.PanelOverride is StyleBoxFlat styleBox) styleBox.ContentMarginTopOverride = value!.Value;
+        }
+    }
+
+    private readonly PanelContainer _line;
+
+    public HLine()
+    {
+        _line = new PanelContainer();
+        _line.PanelOverride = new StyleBoxFlat();
+        _line.PanelOverride.ContentMarginTopOverride = Thickness;
+        AddChild(_line);
+    }
+
+}
diff --git a/Content.Client/UserInterface/Controls/HSpacer.cs b/Content.Client/UserInterface/Controls/HSpacer.cs
new file mode 100644
index 0000000000..b9468ce6de
--- /dev/null
+++ b/Content.Client/UserInterface/Controls/HSpacer.cs
@@ -0,0 +1,21 @@
+using Robust.Client.Graphics;
+using Robust.Client.UserInterface;
+using Robust.Client.UserInterface.Controls;
+using Robust.Shared.Maths;
+using TerraFX.Interop.Windows;
+
+namespace Content.Client.UserInterface.Controls;
+
+public sealed class HSpacer : Control
+{
+    public float Spacing { get => MinHeight; set => MinHeight = value; }
+    public HSpacer()
+    {
+        MinHeight = Spacing;
+    }
+    public HSpacer(float height = 5)
+    {
+        Spacing = height;
+        MinHeight = height;
+    }
+}
diff --git a/Content.Client/UserInterface/Controls/VSpacer.cs b/Content.Client/UserInterface/Controls/VSpacer.cs
new file mode 100644
index 0000000000..346e5e4f16
--- /dev/null
+++ b/Content.Client/UserInterface/Controls/VSpacer.cs
@@ -0,0 +1,20 @@
+using Robust.Client.Graphics;
+using Robust.Client.UserInterface;
+using Robust.Client.UserInterface.Controls;
+using Robust.Shared.Maths;
+
+namespace Content.Client.UserInterface.Controls;
+
+public sealed class VSpacer : Control
+{
+    public float Spacing{ get => MinWidth; set => MinWidth = value; }
+    public VSpacer()
+    {
+        MinWidth = Spacing;
+    }
+    public VSpacer(float width = 5)
+    {
+        Spacing = width;
+        MinWidth = width;
+    }
+}
diff --git a/Content.Server/GameTicking/GameTicker.Lobby.cs b/Content.Server/GameTicking/GameTicker.Lobby.cs
index 6b1af86b3e..aae737ce76 100644
--- a/Content.Server/GameTicking/GameTicker.Lobby.cs
+++ b/Content.Server/GameTicking/GameTicker.Lobby.cs
@@ -71,7 +71,7 @@ namespace Content.Server.GameTicking
         private TickerLobbyStatusEvent GetStatusMsg(IPlayerSession session)
         {
             _playersInLobby.TryGetValue(session, out var status);
-            return new TickerLobbyStatusEvent(RunLevel != GameRunLevel.PreRoundLobby, LobbySong, status == LobbyPlayerStatus.Ready, _roundStartTime, Paused);
+            return new TickerLobbyStatusEvent(RunLevel != GameRunLevel.PreRoundLobby, LobbySong, LobbyBackground,status == LobbyPlayerStatus.Ready, _roundStartTime, Paused);
         }
 
         private void SendStatusToAll()
diff --git a/Content.Server/GameTicking/GameTicker.LobbyBackground.cs b/Content.Server/GameTicking/GameTicker.LobbyBackground.cs
new file mode 100644
index 0000000000..f0d2614b4d
--- /dev/null
+++ b/Content.Server/GameTicking/GameTicker.LobbyBackground.cs
@@ -0,0 +1,33 @@
+using System.IO;
+using System.Linq;
+using Content.Shared.Audio;
+using Robust.Shared.ContentPack;
+using Robust.Shared.Random;
+using Robust.Shared.Utility;
+using Robust.Shared.ViewVariables;
+
+
+namespace Content.Server.GameTicking;
+
+public sealed partial class GameTicker
+{
+    [Dependency] private readonly IResourceManager _resourceManager = default!;
+
+    [ViewVariables]
+    public string? LobbyBackground { get; private set; }
+
+    [ViewVariables]
+    private List<ResourcePath>? _lobbyBackgrounds;
+
+    private static readonly string[] WhitelistedBackgroundExtensions = new string[] {"png", "jpg", "jpeg"};
+
+    private const string LobbyScreenPath = "/Textures/LobbyScreens";
+
+    private void InitializeLobbyBackground()
+    {
+        _lobbyBackgrounds = _resourceManager.ContentFindFiles(new ResourcePath(LobbyScreenPath)).ToList();
+        _lobbyBackgrounds = _lobbyBackgrounds.FindAll(path => WhitelistedBackgroundExtensions.Contains((path.Extension)));
+        LobbyBackground = _lobbyBackgrounds.Any() ? _robustRandom.Pick(_lobbyBackgrounds).ToString() : null;
+    }
+
+}
diff --git a/Content.Server/GameTicking/GameTicker.cs b/Content.Server/GameTicking/GameTicker.cs
index 686f13fd12..9190d6f23d 100644
--- a/Content.Server/GameTicking/GameTicker.cs
+++ b/Content.Server/GameTicking/GameTicker.cs
@@ -50,6 +50,7 @@ namespace Content.Server.GameTicking
             InitializeCVars();
             InitializePlayer();
             InitializeLobbyMusic();
+            InitializeLobbyBackground();
             InitializeGamePreset();
             InitializeJobController();
             InitializeUpdates();
diff --git a/Content.Shared/GameTicking/SharedGameTicker.cs b/Content.Shared/GameTicking/SharedGameTicker.cs
index 52c5941ff3..ed7a6c7d74 100644
--- a/Content.Shared/GameTicking/SharedGameTicker.cs
+++ b/Content.Shared/GameTicking/SharedGameTicker.cs
@@ -44,15 +44,17 @@ namespace Content.Shared.GameTicking
     {
         public bool IsRoundStarted { get; }
         public string? LobbySong { get; }
+        public string? LobbyBackground { get; }
         public bool YouAreReady { get; }
         // UTC.
         public TimeSpan StartTime { get; }
         public bool Paused { get; }
 
-        public TickerLobbyStatusEvent(bool isRoundStarted, string? lobbySong, bool youAreReady, TimeSpan startTime, bool paused)
+        public TickerLobbyStatusEvent(bool isRoundStarted, string? lobbySong, string? lobbyBackground, bool youAreReady, TimeSpan startTime, bool paused)
         {
             IsRoundStarted = isRoundStarted;
             LobbySong = lobbySong;
+            LobbyBackground = lobbyBackground;
             YouAreReady = youAreReady;
             StartTime = startTime;
             Paused = paused;
diff --git a/Resources/Locale/en-US/lobby/lobby-gui.ftl b/Resources/Locale/en-US/lobby/lobby-gui.ftl
index 17c7039d7b..6407104163 100644
--- a/Resources/Locale/en-US/lobby/lobby-gui.ftl
+++ b/Resources/Locale/en-US/lobby/lobby-gui.ftl
@@ -1,4 +1,5 @@
 ui-lobby-title = Lobby
+ui-lobby-ahelp-button = AHelp
 ui-lobby-options-button = Options
 ui-lobby-leave-button = Leave
 ui-lobby-observe-button = Observe
diff --git a/Resources/Textures/LobbyScreens/PutLobbyScreensHere.txt b/Resources/Textures/LobbyScreens/PutLobbyScreensHere.txt
new file mode 100644
index 0000000000..d2cc2b8325
--- /dev/null
+++ b/Resources/Textures/LobbyScreens/PutLobbyScreensHere.txt
@@ -0,0 +1,2 @@
+Note:
+Only png and jpgs files are supported
\ No newline at end of file