UI improvements for holopads (#34055)

* Initial commit

* Minor update

Content.Client/Holopad/HolopadWindow.xaml

@@ -27,7 +27,11 @@
                 <!-- Header text -->
                 <BoxContainer MinHeight="60" Orientation="Vertical" VerticalAlignment="Center">
                     <Label Name="CallStatusText" Margin="10 5 10 0" ReservesSpace="False"/>
-                    <RichTextLabel Name="CallerIdText" HorizontalAlignment="Center" Margin="0 0 0 0" ReservesSpace="False"/>
+                    <BoxContainer Name="CallerIdContainer" Orientation="Vertical" ReservesSpace="False">
+                        <RichTextLabel Name="CallerIdText" HorizontalAlignment="Center" Margin="0 0 0 0"/>
+                        <Label Text="{Loc 'holopad-window-relay-label'}" Margin="10 5 10 0" ReservesSpace="False"/>
+                        <RichTextLabel Name="HolopadIdText" HorizontalAlignment="Center" Margin="0 0 0 10"/>
+                    </BoxContainer>
                 </BoxContainer>
 
                 <!-- Controls (the answer call button is absent when the phone is not ringing) -->
@@ -68,18 +72,25 @@
                     <PanelContainer Name="HolopadContactListHeaderPanel">
                         <Label Text="{Loc 'holopad-window-select-contact-from-list'}" HorizontalAlignment="Center" Margin="0 3 0 3"/>
                     </PanelContainer>
-                
+
                     <PanelContainer Name="HolopadContactListPanel">
-                        <ScrollContainer HorizontalExpand="True" VerticalExpand="True" Margin="8, 8, 8, 8" MinHeight="256">
+                        <BoxContainer Orientation="Vertical">
+
+                            <!-- Contact filter -->
+                            <LineEdit Name="SearchLineEdit" HorizontalExpand="True" Margin="4, 4, 4, 0"
+                                      PlaceHolder="{Loc holopad-window-filter-line-placeholder}" />
 
-                            <!-- If there is no data yet, this will be displayed -->
-                            <BoxContainer Name="FetchingAvailableHolopadsContainer" HorizontalAlignment="Center" HorizontalExpand="True" VerticalExpand="True" ReservesSpace="False">
-                                <Label Text="{Loc 'holopad-window-fetching-contacts-list'}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-                            </BoxContainer>
+                            <ScrollContainer HorizontalExpand="True" VerticalExpand="True" Margin="8, 8, 8, 8" MinHeight="256">
 
-                            <!-- Container for the contacts -->
-                            <BoxContainer Name="ContactsList" Orientation="Vertical" HorizontalExpand="True" VerticalExpand="True" Margin="10 0 10 0"/>
-                        </ScrollContainer>
+                                <!-- If there is no data yet, this will be displayed -->
+                                <BoxContainer Name="FetchingAvailableHolopadsContainer" HorizontalAlignment="Center" HorizontalExpand="True" VerticalExpand="True" ReservesSpace="False">
+                                    <Label Text="{Loc 'holopad-window-fetching-contacts-list'}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                                </BoxContainer>
+
+                                <!-- Container for the contacts -->
+                                <BoxContainer Name="ContactsList" Orientation="Vertical" HorizontalExpand="True" VerticalExpand="True" Margin="10 0 10 0"/>
+                            </ScrollContainer>
+                        </BoxContainer>
                     </PanelContainer>
                 </BoxContainer>
 

Content.Client/Holopad/HolopadWindow.xaml.cs

@@ -171,8 +171,10 @@ public void UpdateState(Dictionary<NetEntity, string> holopads)
 
         // Caller ID text
         var callerId = _telephoneSystem.GetFormattedCallerIdForEntity(telephone.LastCallerId.Item1, telephone.LastCallerId.Item2, Color.LightGray, "Default", 11);
+        var holoapdId = _telephoneSystem.GetFormattedDeviceIdForEntity(telephone.LastCallerId.Item3, Color.LightGray, "Default", 11);
 
         CallerIdText.SetMessage(FormattedMessage.FromMarkupOrThrow(callerId));
+        HolopadIdText.SetMessage(FormattedMessage.FromMarkupOrThrow(holoapdId));
         LockOutIdText.SetMessage(FormattedMessage.FromMarkupOrThrow(callerId));
 
         // Sort holopads alphabetically
@@ -236,10 +238,13 @@ private void UpdateAppearance()
         // Make / update required children
         foreach (var child in ContactsList.Children)
         {
-            if (child is not HolopadContactButton)
+            if (child is not HolopadContactButton contactButton)
                 continue;
 
-            var contactButton = (HolopadContactButton)child;
+            var passesFilter = string.IsNullOrEmpty(SearchLineEdit.Text) ||
+                               contactButton.Text?.Contains(SearchLineEdit.Text, StringComparison.CurrentCultureIgnoreCase) == true;
+
+            contactButton.Visible = passesFilter;
             contactButton.Disabled = (_currentState != TelephoneState.Idle || lockButtons);
         }
 
@@ -290,7 +295,7 @@ private void UpdateAppearance()
         FetchingAvailableHolopadsContainer.Visible = (ContactsList.ChildCount == 0);
         ActiveCallControlsContainer.Visible = (_currentState != TelephoneState.Idle || _currentUiKey == HolopadUiKey.AiRequestWindow);
         CallPlacementControlsContainer.Visible = !ActiveCallControlsContainer.Visible;
-        CallerIdText.Visible = (_currentState == TelephoneState.Ringing);
+        CallerIdContainer.Visible = (_currentState == TelephoneState.Ringing);
         AnswerCallButton.Visible = (_currentState == TelephoneState.Ringing);
     }
 
@@ -316,6 +321,7 @@ public HolopadContactButton()
             HorizontalExpand = true;
             SetHeight = 32;
             Margin = new Thickness(0f, 1f, 0f, 1f);
+            ReservesSpace = false;
         }
 
         public void UpdateValues(NetEntity netEntity, string label)

Content.Server/Telephone/TelephoneSystem.cs

@@ -151,7 +151,7 @@ public override void Update(float frameTime)
 
                     break;
 
-                // Try to hang up if their has been no recent in-call activity 
+                // Try to hang up if there has been no recent in-call activity
                 case TelephoneState.InCall:
                     if (_timing.CurTime > telephone.StateStartTime + TimeSpan.FromSeconds(telephone.IdlingTimeout))
                         EndTelephoneCalls(entity);
@@ -214,7 +214,8 @@ private bool TryCallTelephone(Entity<TelephoneComponent> source, Entity<Telephon
         source.Comp.LinkedTelephones.Add(receiver);
         source.Comp.Muted = options?.MuteSource == true;
 
-        receiver.Comp.LastCallerId = GetNameAndJobOfCallingEntity(user); // This will be networked when the state changes
+        var callerInfo = GetNameAndJobOfCallingEntity(user);
+        receiver.Comp.LastCallerId = (callerInfo.Item1, callerInfo.Item2, Name(source)); // This will be networked when the state changes
         receiver.Comp.LinkedTelephones.Add(source);
         receiver.Comp.Muted = options?.MuteReceiver == true;
 

Content.Shared/Telephone/SharedTelephoneSystem.cs

@@ -36,4 +36,21 @@ public string GetFormattedCallerIdForEntity(string? presumedName, string? presum
 
         return callerId;
     }
+
+    public string GetFormattedDeviceIdForEntity(string? deviceName, Color fontColor, string fontType = "Default", int fontSize = 12)
+    {
+        if (deviceName == null)
+        {
+            return Loc.GetString("chat-telephone-unknown-device",
+                ("color", fontColor),
+                ("fontType", fontType),
+                ("fontSize", fontSize));
+        }
+
+        return Loc.GetString("chat-telephone-device-id",
+            ("deviceName", deviceName),
+            ("color", fontColor),
+            ("fontType", fontType),
+            ("fontSize", fontSize));
+    }
 }

Content.Shared/Telephone/TelephoneComponent.cs

@@ -127,9 +127,10 @@ public sealed partial class TelephoneComponent : Component
 
     /// <summary>
     /// The presumed name and/or job of the last person to call this telephone
+    /// and the name of the device that they used to do so
     /// </summary>
     [ViewVariables, AutoNetworkedField]
-    public (string?, string?) LastCallerId;
+    public (string?, string?, string?) LastCallerId;
 }
 
 #region: Telephone events

Resources/Locale/en-US/holopad/holopad.ftl

@@ -6,6 +6,7 @@ holopad-window-options = [color=darkgray][font size=10][italic]Please select an
 # Call status
 holopad-window-no-calls-in-progress = No holo-calls in progress
 holopad-window-incoming-call = Incoming holo-call from:
+holopad-window-relay-label = Originating at:
 holopad-window-outgoing-call = Attempting to establish a connection...
 holopad-window-call-in-progress = Holo-call in progress
 holopad-window-call-ending = Disconnecting...
@@ -28,6 +29,7 @@ holopad-window-access-denied = Access denied
 holopad-window-select-contact-from-list = Select a contact to initiate a holo-call
 holopad-window-fetching-contacts-list = No holopads are currently contactable
 holopad-window-contact-label = {CAPITALIZE($label)}
+holopad-window-filter-line-placeholder = Search for a contact
 
 # Flavor
 holopad-window-flavor-left = ⚠ Do not enter while projector is active

Resources/Locale/en-US/telephone/telephone.ftl

@@ -5,4 +5,6 @@ chat-telephone-message-wrap-bold = [color={$color}][bold]{$name}[/bold] {$verb},
 # Caller ID
 chat-telephone-unknown-caller = [color={$color}][font={$fontType} size={$fontSize}][bolditalic]Unknown caller[/bolditalic][/font][/color]
 chat-telephone-caller-id-with-job = [color={$color}][font={$fontType} size={$fontSize}][bold]{CAPITALIZE($callerName)} ({CAPITALIZE($callerJob)})[/bold][/font][/color]
-chat-telephone-caller-id-without-job = [color={$color}][font={$fontType} size={$fontSize}][bold]{CAPITALIZE($callerName)}[/bold][/font][/color]
+chat-telephone-caller-id-without-job = [color={$color}][font={$fontType} size={$fontSize}][bold]{CAPITALIZE($callerName)}[/bold][/font][/color]
+chat-telephone-unknown-device = [color={$color}][font={$fontType} size={$fontSize}][bolditalic]Unknown device[/bolditalic][/font][/color]
+chat-telephone-device-id = [color={$color}][font={$fontType} size={$fontSize}][bold]{CAPITALIZE($deviceName)}[/bold][/font][/color]