Merge pull request #21448 from Feodor0090/comment-editor-1

Update comment editor component

osu.Game.Tests/Visual/UserInterface/TestSceneCommentEditor.cs

@@ -1,13 +1,16 @@
 // Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
 // See the LICENCE file in the repository root for full licence text.
 
-#nullable disable
+using System.Linq;
-
 using NUnit.Framework;
 using osu.Framework.Allocation;
 using osu.Framework.Bindables;
 using osu.Framework.Graphics;
 using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.UserInterface;
+using osu.Framework.Localisation;
+using osu.Framework.Testing;
+using osu.Game.Graphics.UserInterface;
 using osu.Game.Overlays;
 using osu.Game.Overlays.Comments;
 using osuTK;
@@ -20,8 +23,8 @@ namespace osu.Game.Tests.Visual.UserInterface
         [Cached]
         private readonly OverlayColourProvider colourProvider = new OverlayColourProvider(OverlayColourScheme.Blue);
 
-        private TestCommentEditor commentEditor;
+        private TestCommentEditor commentEditor = null!;
-        private TestCancellableCommentEditor cancellableCommentEditor;
+        private TestCancellableCommentEditor cancellableCommentEditor = null!;
 
         [SetUp]
         public void SetUp() => Schedule(() =>
@@ -45,15 +48,16 @@ namespace osu.Game.Tests.Visual.UserInterface
         {
             AddStep("click on text box", () =>
             {
-                InputManager.MoveMouseTo(commentEditor);
+                InputManager.MoveMouseTo(commentEditor.ChildrenOfType<TextBox>().Single());
                 InputManager.Click(MouseButton.Left);
             });
             AddStep("enter text", () => commentEditor.Current.Value = "text");
 
             AddStep("press Enter", () => InputManager.Key(Key.Enter));
 
+            AddUntilStep("button is loading", () => commentEditor.IsSpinnerShown);
             AddAssert("text committed", () => commentEditor.CommittedText == "text");
-            AddAssert("button is loading", () => commentEditor.IsLoading);
+            AddUntilStep("button is not loading", () => !commentEditor.IsSpinnerShown);
         }
 
         [Test]
@@ -61,14 +65,14 @@ namespace osu.Game.Tests.Visual.UserInterface
         {
             AddStep("click on text box", () =>
             {
-                InputManager.MoveMouseTo(commentEditor);
+                InputManager.MoveMouseTo(commentEditor.ChildrenOfType<TextBox>().Single());
                 InputManager.Click(MouseButton.Left);
             });
 
             AddStep("press Enter", () => InputManager.Key(Key.Enter));
 
-            AddAssert("no text committed", () => commentEditor.CommittedText == null);
+            AddAssert("button is not loading", () => !commentEditor.IsSpinnerShown);
-            AddAssert("button is not loading", () => !commentEditor.IsLoading);
+            AddAssert("no text committed", () => commentEditor.CommittedText.Length == 0);
         }
 
         [Test]
@@ -76,7 +80,7 @@ namespace osu.Game.Tests.Visual.UserInterface
         {
             AddStep("click on text box", () =>
             {
-                InputManager.MoveMouseTo(commentEditor);
+                InputManager.MoveMouseTo(commentEditor.ChildrenOfType<TextBox>().Single());
                 InputManager.Click(MouseButton.Left);
             });
             AddStep("enter text", () => commentEditor.Current.Value = "some other text");
@@ -87,8 +91,9 @@ namespace osu.Game.Tests.Visual.UserInterface
                 InputManager.Click(MouseButton.Left);
             });
 
+            AddUntilStep("button is loading", () => commentEditor.IsSpinnerShown);
             AddAssert("text committed", () => commentEditor.CommittedText == "some other text");
-            AddAssert("button is loading", () => commentEditor.IsLoading);
+            AddUntilStep("button is not loading", () => !commentEditor.IsSpinnerShown);
         }
 
         [Test]
@@ -96,7 +101,7 @@ namespace osu.Game.Tests.Visual.UserInterface
         {
             AddStep("click cancel button", () =>
             {
-                InputManager.MoveMouseTo(cancellableCommentEditor.ButtonsContainer);
+                InputManager.MoveMouseTo(cancellableCommentEditor.ButtonsContainer[1]);
                 InputManager.Click(MouseButton.Left);
             });
 
@@ -108,28 +113,27 @@ namespace osu.Game.Tests.Visual.UserInterface
             public new Bindable<string> Current => base.Current;
             public new FillFlowContainer ButtonsContainer => base.ButtonsContainer;
 
-            public string CommittedText { get; private set; }
+            public string CommittedText { get; private set; } = string.Empty;
 
-            public TestCommentEditor()
+            public bool IsSpinnerShown => this.ChildrenOfType<LoadingSpinner>().Single().IsPresent;
-            {
-                OnCommit = onCommit;
-            }
 
-            private void onCommit(string value)
+            protected override void OnCommit(string value)
             {
+                ShowLoadingSpinner = true;
                 CommittedText = value;
-                Scheduler.AddDelayed(() => IsLoading = false, 1000);
+                Scheduler.AddDelayed(() => ShowLoadingSpinner = false, 1000);
             }
 
-            protected override string FooterText => @"Footer text. And it is pretty long. Cool.";
+            protected override LocalisableString FooterText => @"Footer text. And it is pretty long. Cool.";
-            protected override string CommitButtonText => @"Commit";
+            protected override LocalisableString CommitButtonText => @"Commit";
-            protected override string TextBoxPlaceholder => @"This text box is empty";
+            protected override LocalisableString TextBoxPlaceholder => @"This text box is empty";
         }
 
         private partial class TestCancellableCommentEditor : CancellableCommentEditor
         {
             public new FillFlowContainer ButtonsContainer => base.ButtonsContainer;
-            protected override string FooterText => @"Wow, another one. Sicc";
+
+            protected override LocalisableString FooterText => @"Wow, another one. Sicc";
 
             public bool Cancelled { get; private set; }
 
@@ -138,8 +142,12 @@ namespace osu.Game.Tests.Visual.UserInterface
                 OnCancel = () => Cancelled = true;
             }
 
-            protected override string CommitButtonText => @"Save";
+            protected override void OnCommit(string text)
-            protected override string TextBoxPlaceholder => @"Multiline textboxes soon";
+            {
+            }
+
+            protected override LocalisableString CommitButtonText => @"Save";
+            protected override LocalisableString TextBoxPlaceholder => @"Multiline textboxes soon";
         }
     }
 }

osu.Game/Overlays/Comments/CancellableCommentEditor.cs

@@ -1,76 +1,24 @@
 // Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
 // See the LICENCE file in the repository root for full licence text.
 
-#nullable disable
-
 using System;
-using System.Collections.Generic;
 using osu.Framework.Allocation;
-using osu.Framework.Graphics;
-using osu.Framework.Graphics.Containers;
-using osu.Framework.Graphics.Shapes;
-using osu.Game.Graphics;
-using osu.Game.Graphics.Containers;
-using osu.Game.Graphics.Sprites;
-using osu.Game.Graphics.UserInterface;
 using osu.Game.Resources.Localisation.Web;
 
 namespace osu.Game.Overlays.Comments
 {
     public abstract partial class CancellableCommentEditor : CommentEditor
     {
-        public Action OnCancel;
+        public Action? OnCancel;
 
         [BackgroundDependencyLoader]
         private void load()
         {
-            ButtonsContainer.Add(new CancelButton
+            ButtonsContainer.Add(new EditorButton
             {
-                Anchor = Anchor.CentreRight,
+                Action = () => OnCancel?.Invoke(),
-                Origin = Anchor.CentreRight,
+                Text = CommonStrings.ButtonsCancel,
-                Action = () => OnCancel?.Invoke()
             });
         }
-
-        private partial class CancelButton : OsuHoverContainer
-        {
-            protected override IEnumerable<Drawable> EffectTargets => new[] { background };
-
-            private readonly Box background;
-
-            public CancelButton()
-                : base(HoverSampleSet.Button)
-            {
-                AutoSizeAxes = Axes.Both;
-                Child = new CircularContainer
-                {
-                    Masking = true,
-                    Height = 25,
-                    AutoSizeAxes = Axes.X,
-                    Children = new Drawable[]
-                    {
-                        background = new Box
-                        {
-                            RelativeSizeAxes = Axes.Both
-                        },
-                        new OsuSpriteText
-                        {
-                            Anchor = Anchor.Centre,
-                            Origin = Anchor.Centre,
-                            Font = OsuFont.GetFont(size: 12, weight: FontWeight.Bold),
-                            Margin = new MarginPadding { Horizontal = 20 },
-                            Text = CommonStrings.ButtonsCancel
-                        }
-                    }
-                };
-            }
-
-            [BackgroundDependencyLoader]
-            private void load(OverlayColourProvider colourProvider)
-            {
-                IdleColour = colourProvider.Light4;
-                HoverColour = colourProvider.Light3;
-            }
-        }
     }
 }

osu.Game/Overlays/Comments/CommentEditor.cs

@@ -1,22 +1,20 @@
 // Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
 // See the LICENCE file in the repository root for full licence text.
 
-#nullable disable
-
 using osu.Framework.Allocation;
-using osu.Framework.Graphics.Containers;
+using osu.Framework.Bindables;
 using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
 using osu.Framework.Graphics.Shapes;
+using osu.Framework.Graphics.Sprites;
+using osu.Framework.Graphics.UserInterface;
+using osu.Framework.Localisation;
 using osu.Game.Graphics;
 using osu.Game.Graphics.Sprites;
-using osu.Framework.Graphics.UserInterface;
-using osu.Framework.Graphics.Sprites;
-using osuTK.Graphics;
 using osu.Game.Graphics.UserInterface;
-using System.Collections.Generic;
+using osu.Game.Graphics.UserInterfaceV2;
-using System;
 using osuTK;
-using osu.Framework.Bindables;
+using osuTK.Graphics;
 
 namespace osu.Game.Overlays.Comments
 {
@@ -24,26 +22,32 @@ namespace osu.Game.Overlays.Comments
     {
         private const int side_padding = 8;
 
-        public Action<string> OnCommit;
+        protected abstract LocalisableString FooterText { get; }
 
-        public bool IsLoading
+        protected abstract LocalisableString CommitButtonText { get; }
+
+        protected abstract LocalisableString TextBoxPlaceholder { get; }
+
+        protected FillFlowContainer ButtonsContainer { get; private set; } = null!;
+
+        protected readonly Bindable<string> Current = new Bindable<string>(string.Empty);
+
+        private RoundedButton commitButton = null!;
+        private LoadingSpinner loadingSpinner = null!;
+
+        protected bool ShowLoadingSpinner
         {
-            get => commitButton.IsLoading;
+            set
-            set => commitButton.IsLoading = value;
+            {
+                if (value)
+                    loadingSpinner.Show();
+                else
+                    loadingSpinner.Hide();
+
+                updateCommitButtonState();
+            }
         }
 
-        protected abstract string FooterText { get; }
-
-        protected abstract string CommitButtonText { get; }
-
-        protected abstract string TextBoxPlaceholder { get; }
-
-        protected FillFlowContainer ButtonsContainer { get; private set; }
-
-        protected readonly Bindable<string> Current = new Bindable<string>();
-
-        private CommitButton commitButton;
-
         [BackgroundDependencyLoader]
         private void load(OverlayColourProvider colourProvider)
         {
@@ -79,7 +83,7 @@ namespace osu.Game.Overlays.Comments
                         },
                         new Container
                         {
-                            Name = "Footer",
+                            Name = @"Footer",
                             RelativeSizeAxes = Axes.X,
                             Height = 35,
                             Padding = new MarginPadding { Horizontal = side_padding },
@@ -92,54 +96,64 @@ namespace osu.Game.Overlays.Comments
                                     Font = OsuFont.GetFont(size: 12, weight: FontWeight.SemiBold),
                                     Text = FooterText
                                 },
-                                ButtonsContainer = new FillFlowContainer
+                                new FillFlowContainer
                                 {
-                                    Name = "Buttons",
                                     Anchor = Anchor.CentreRight,
                                     Origin = Anchor.CentreRight,
                                     AutoSizeAxes = Axes.Both,
                                     Direction = FillDirection.Horizontal,
                                     Spacing = new Vector2(5, 0),
-                                    Child = commitButton = new CommitButton(CommitButtonText)
+                                    Children = new Drawable[]
                                     {
-                                        Anchor = Anchor.CentreRight,
+                                        ButtonsContainer = new FillFlowContainer
-                                        Origin = Anchor.CentreRight,
-                                        Action = () =>
                                         {
-                                            OnCommit?.Invoke(Current.Value);
+                                            Name = @"Buttons",
-                                            Current.Value = string.Empty;
+                                            Anchor = Anchor.CentreRight,
-                                        }
+                                            Origin = Anchor.CentreRight,
+                                            AutoSizeAxes = Axes.Both,
+                                            Direction = FillDirection.Horizontal,
+                                            Spacing = new Vector2(5, 0),
+                                            Child = commitButton = new EditorButton
+                                            {
+                                                Text = CommitButtonText,
+                                                Action = () => OnCommit(Current.Value)
+                                            }
+                                        },
+                                        loadingSpinner = new LoadingSpinner
+                                        {
+                                            Anchor = Anchor.CentreRight,
+                                            Origin = Anchor.CentreRight,
+                                            Size = new Vector2(18),
+                                        },
                                     }
-                                }
+                                },
                             }
                         }
                     }
                 }
             });
 
-            textBox.OnCommit += (_, _) =>
+            textBox.OnCommit += (_, _) => commitButton.TriggerClick();
-            {
-                if (commitButton.IsBlocked.Value)
-                    return;
-
-                commitButton.TriggerClick();
-            };
         }
 
         protected override void LoadComplete()
         {
             base.LoadComplete();
-
+            Current.BindValueChanged(_ => updateCommitButtonState(), true);
-            Current.BindValueChanged(text => commitButton.IsBlocked.Value = string.IsNullOrEmpty(text.NewValue), true);
         }
 
+        protected abstract void OnCommit(string text);
+
+        private void updateCommitButtonState() =>
+            commitButton.Enabled.Value = loadingSpinner.State.Value == Visibility.Hidden && !string.IsNullOrEmpty(Current.Value);
+
         private partial class EditorTextBox : BasicTextBox
         {
             protected override float LeftRightPadding => side_padding;
 
             protected override Color4 SelectionColour => Color4.Gray;
 
-            private OsuSpriteText placeholder;
+            private OsuSpriteText placeholder = null!;
 
             public EditorTextBox()
             {
@@ -163,88 +177,26 @@ namespace osu.Game.Overlays.Comments
             protected override Drawable GetDrawableCharacter(char c) => new FallingDownContainer
             {
                 AutoSizeAxes = Axes.Both,
-                Child = new OsuSpriteText { Text = c.ToString(), Font = OsuFont.GetFont(size: CalculatedTextSize) },
+                Child = new OsuSpriteText { Text = c.ToString(), Font = OsuFont.GetFont(size: CalculatedTextSize) }
             };
         }
 
-        private partial class CommitButton : LoadingButton
+        protected partial class EditorButton : RoundedButton
         {
-            private const int duration = 200;
+            public EditorButton()
-
-            public readonly BindableBool IsBlocked = new BindableBool();
-
-            public override bool PropagatePositionalInputSubTree => !IsBlocked.Value && base.PropagatePositionalInputSubTree;
-
-            protected override IEnumerable<Drawable> EffectTargets => new[] { background };
-
-            private readonly string text;
-
-            [Resolved]
-            private OverlayColourProvider colourProvider { get; set; }
-
-            private OsuSpriteText drawableText;
-            private Box background;
-            private Box blockedBackground;
-
-            public CommitButton(string text)
             {
-                this.text = text;
+                Width = 80;
-
+                Height = 25;
-                AutoSizeAxes = Axes.Both;
+                Anchor = Anchor.CentreRight;
-                LoadingAnimationSize = new Vector2(10);
+                Origin = Anchor.CentreRight;
             }
 
-            [BackgroundDependencyLoader]
+            protected override SpriteText CreateText()
-            private void load()
             {
-                IdleColour = colourProvider.Light4;
+                var t = base.CreateText();
-                HoverColour = colourProvider.Light3;
+                t.Font = OsuFont.GetFont(weight: FontWeight.Bold, size: 12);
-                blockedBackground.Colour = colourProvider.Background5;
+                return t;
             }
-
-            protected override void LoadComplete()
-            {
-                base.LoadComplete();
-                IsBlocked.BindValueChanged(onBlockedStateChanged, true);
-            }
-
-            private void onBlockedStateChanged(ValueChangedEvent<bool> isBlocked)
-            {
-                drawableText.FadeColour(isBlocked.NewValue ? colourProvider.Foreground1 : Color4.White, duration, Easing.OutQuint);
-                background.FadeTo(isBlocked.NewValue ? 0 : 1, duration, Easing.OutQuint);
-            }
-
-            protected override Drawable CreateContent() => new CircularContainer
-            {
-                Masking = true,
-                Height = 25,
-                AutoSizeAxes = Axes.X,
-                Children = new Drawable[]
-                {
-                    blockedBackground = new Box
-                    {
-                        RelativeSizeAxes = Axes.Both
-                    },
-                    background = new Box
-                    {
-                        RelativeSizeAxes = Axes.Both,
-                        Alpha = 0
-                    },
-                    drawableText = new OsuSpriteText
-                    {
-                        AlwaysPresent = true,
-                        Anchor = Anchor.Centre,
-                        Origin = Anchor.Centre,
-                        Font = OsuFont.GetFont(size: 12, weight: FontWeight.Bold),
-                        Margin = new MarginPadding { Horizontal = 20 },
-                        Text = text,
-                    }
-                }
-            };
-
-            protected override void OnLoadStarted() => drawableText.FadeOut(duration, Easing.OutQuint);
-
-            protected override void OnLoadFinished() => drawableText.FadeIn(duration, Easing.OutQuint);
         }
     }
 }