Make direct panel download and replay buttons share UI

osu.Game.Tests/Visual/Gameplay/TestSceneReplayDownloadButton.cs

@@ -9,6 +9,7 @@ using osu.Game.Rulesets.Osu;
 using osu.Game.Scoring;
 using osu.Game.Screens.Play;
 using osu.Game.Users;
+using osuTK;
 using System;
 using System.Collections.Generic;
 
@@ -41,6 +42,7 @@ namespace osu.Game.Tests.Visual.Gameplay
                 {
                     Anchor = Anchor.Centre,
                     Origin = Anchor.Centre,
+                    Size = new Vector2(80, 40),
                 };
             });
         }

osu.Game/Graphics/UserInterface/OsuDownloadButton.cs

@@ -0,0 +1,87 @@
+// 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.
+
+using osu.Framework.Allocation;
+using osu.Framework.Bindables;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Shapes;
+using osu.Framework.Graphics.Sprites;
+using osu.Game.Online;
+using osuTK;
+
+namespace osu.Game.Graphics.UserInterface
+{
+    public class OsuDownloadButton : OsuAnimatedButton
+    {
+        public readonly Bindable<DownloadState> State = new Bindable<DownloadState>();
+
+        private readonly SpriteIcon icon;
+        private readonly SpriteIcon checkmark;
+        private readonly Box background;
+
+        private OsuColour colours;
+
+        public OsuDownloadButton()
+        {
+            Children = new Drawable[]
+            {
+                background = new Box
+                {
+                    RelativeSizeAxes = Axes.Both,
+                    Depth = float.MaxValue
+                },
+                icon = new SpriteIcon
+                {
+                    Anchor = Anchor.Centre,
+                    Origin = Anchor.Centre,
+                    Size = new Vector2(13),
+                    Icon = FontAwesome.Solid.Download,
+                },
+                checkmark = new SpriteIcon
+                {
+                    Anchor = Anchor.Centre,
+                    Origin = Anchor.Centre,
+                    X = 8,
+                    Size = Vector2.Zero,
+                    Icon = FontAwesome.Solid.Check,
+                }
+            };
+        }
+
+        [BackgroundDependencyLoader]
+        private void load(OsuColour colours)
+        {
+            this.colours = colours;
+
+            State.BindValueChanged(updateState, true);
+        }
+
+        private void updateState(ValueChangedEvent<DownloadState> state)
+        {
+            switch (state.NewValue)
+            {
+                case DownloadState.NotDownloaded:
+                    background.FadeColour(colours.Gray4, 500, Easing.InOutExpo);
+                    icon.MoveToX(0, 500, Easing.InOutExpo);
+                    checkmark.ScaleTo(Vector2.Zero, 500, Easing.InOutExpo);
+                    break;
+
+                case DownloadState.Downloading:
+                    background.FadeColour(colours.Blue, 500, Easing.InOutExpo);
+                    icon.MoveToX(0, 500, Easing.InOutExpo);
+                    checkmark.ScaleTo(Vector2.Zero, 500, Easing.InOutExpo);
+                    break;
+
+                case DownloadState.Downloaded:
+                    background.FadeColour(colours.Yellow, 500, Easing.InOutExpo);
+                    break;
+
+                case DownloadState.LocallyAvailable:
+                    background.FadeColour(colours.Green, 500, Easing.InOutExpo);
+                    icon.MoveToX(-8, 500, Easing.InOutExpo);
+                    checkmark.ScaleTo(new Vector2(13), 500, Easing.InOutExpo);
+                    break;
+            }
+        }
+    }
+}

osu.Game/Overlays/Direct/DownloadButton.cs

@@ -1,4 +1,4 @@
-// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
+// 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.
 
 using osu.Framework.Allocation;
@@ -10,7 +10,6 @@ using osu.Game.Graphics;
 using osu.Game.Graphics.Containers;
 using osu.Game.Graphics.UserInterface;
 using osu.Game.Online;
-using osuTK;
 
 namespace osu.Game.Overlays.Direct
 {
@@ -25,7 +24,7 @@ namespace osu.Game.Overlays.Direct
 
         private OsuColour colours;
         private readonly ShakeContainer shakeContainer;
-        private readonly OsuAnimatedButton button;
+        private readonly OsuDownloadButton button;
 
         public DownloadButton(BeatmapSetInfo beatmapSet, bool noVideo = false)
             : base(beatmapSet)
@@ -35,33 +34,10 @@ namespace osu.Game.Overlays.Direct
             InternalChild = shakeContainer = new ShakeContainer
             {
                 RelativeSizeAxes = Axes.Both,
-                Child = button = new OsuAnimatedButton
+                Child = button = new OsuDownloadButton
                 {
                     RelativeSizeAxes = Axes.Both,
-                    Children = new Drawable[]
-                    {
-                        background = new Box
-                        {
-                            RelativeSizeAxes = Axes.Both,
-                            Depth = float.MaxValue
-                        },
-                        icon = new SpriteIcon
-                        {
-                            Anchor = Anchor.Centre,
-                            Origin = Anchor.Centre,
-                            Size = new Vector2(13),
-                            Icon = FontAwesome.Solid.Download,
-                        },
-                        checkmark = new SpriteIcon
-                        {
-                            Anchor = Anchor.Centre,
-                            Origin = Anchor.Centre,
-                            X = 8,
-                            Size = Vector2.Zero,
-                            Icon = FontAwesome.Solid.Check,
-                        }
-                    }
-                }
+                },
             };
         }
 
@@ -69,7 +45,7 @@ namespace osu.Game.Overlays.Direct
         {
             base.LoadComplete();
 
-            State.BindValueChanged(state => updateState(state.NewValue), true);
+            button.State.BindTo(State);
             FinishTransforms(true);
         }
 
@@ -105,32 +81,11 @@ namespace osu.Game.Overlays.Direct
             };
         }
 
-        private void updateState(DownloadState state)
+        protected override void Dispose(bool isDisposing)
         {
-            switch (state)
-            {
-                case DownloadState.NotDownloaded:
-                    background.FadeColour(colours.Gray4, 500, Easing.InOutExpo);
-                    icon.MoveToX(0, 500, Easing.InOutExpo);
-                    checkmark.ScaleTo(Vector2.Zero, 500, Easing.InOutExpo);
-                    break;
+            base.Dispose(isDisposing);
 
-                case DownloadState.Downloading:
-                    background.FadeColour(colours.Blue, 500, Easing.InOutExpo);
-                    icon.MoveToX(0, 500, Easing.InOutExpo);
-                    checkmark.ScaleTo(Vector2.Zero, 500, Easing.InOutExpo);
-                    break;
-
-                case DownloadState.Downloaded:
-                    background.FadeColour(colours.Yellow, 500, Easing.InOutExpo);
-                    break;
-
-                case DownloadState.LocallyAvailable:
-                    background.FadeColour(colours.Green, 500, Easing.InOutExpo);
-                    icon.MoveToX(-8, 500, Easing.InOutExpo);
-                    checkmark.ScaleTo(new Vector2(13), 500, Easing.InOutExpo);
-                    break;
-            }
+            button?.State.UnbindAll();
         }
     }
 }

osu.Game/Screens/Play/ReplayDownloadButton.cs

@@ -2,57 +2,28 @@
 // See the LICENCE file in the repository root for full licence text.
 
 using osu.Framework.Allocation;
-using osu.Framework.Graphics.Cursor;
-using osu.Framework.Graphics.Shapes;
 using osu.Framework.Graphics;
-using osu.Game.Graphics;
 using osu.Game.Graphics.Containers;
 using osu.Game.Online;
 using osu.Game.Scoring;
-using osuTK;
-using osu.Framework.Graphics.Sprites;
 using osu.Game.Online.API.Requests.Responses;
-using osu.Framework.Graphics.Effects;
-using osuTK.Graphics;
-using osu.Framework.Extensions.Color4Extensions;
-using osu.Framework.Graphics.Containers;
+using osu.Game.Graphics.UserInterface;
 
 namespace osu.Game.Screens.Play
 {
-    public class ReplayDownloadButton : DownloadTrackingComposite<ScoreInfo, ScoreManager>, IHasTooltip
+    public class ReplayDownloadButton : DownloadTrackingComposite<ScoreInfo, ScoreManager>
     {
         [Resolved]
         private ScoreManager scores { get; set; }
 
-        private OsuClickableContainer button;
-        private SpriteIcon downloadIcon;
-        private SpriteIcon playIcon;
+        private OsuDownloadButton button;
         private ShakeContainer shakeContainer;
-        private CircularContainer circle;
-
-        public string TooltipText
-        {
-            get
-            {
-                switch (replayAvailability)
-                {
-                    case ReplayAvailability.Local:
-                        return @"Watch replay";
-
-                    case ReplayAvailability.Online:
-                        return @"Download replay";
-
-                    default:
-                        return @"Replay unavailable";
-                }
-            }
-        }
 
         private ReplayAvailability replayAvailability
         {
             get
             {
-                if (scores.IsAvailableLocally(Model.Value))
+                if (State.Value == DownloadState.LocallyAvailable)
                     return ReplayAvailability.Local;
 
                 if (Model.Value is APILegacyScoreInfo apiScore && apiScore.Replay)
@@ -65,54 +36,18 @@ namespace osu.Game.Screens.Play
         public ReplayDownloadButton(ScoreInfo score)
             : base(score)
         {
-            AutoSizeAxes = Axes.Both;
         }
 
         [BackgroundDependencyLoader(true)]
-        private void load(OsuGame game, OsuColour colours)
+        private void load(OsuGame game)
         {
             InternalChild = shakeContainer = new ShakeContainer
             {
-                AutoSizeAxes = Axes.Both,
-                Child = circle = new CircularContainer
+                RelativeSizeAxes = Axes.Both,
+                Child = button = new OsuDownloadButton
                 {
-                    Masking = true,
-                    Size = new Vector2(40),
-                    EdgeEffect = new EdgeEffectParameters
-                    {
-                        Colour = Color4.Black.Opacity(0.4f),
-                        Type = EdgeEffectType.Shadow,
-                        Radius = 5,
-                    },
-                    Child = button = new OsuClickableContainer
-                    {
-                        RelativeSizeAxes = Axes.Both,
-                        Children = new Drawable[]
-                        {
-                            new Box
-                            {
-                                RelativeSizeAxes = Axes.Both,
-                                Colour = colours.GrayF,
-                            },
-                            playIcon = new SpriteIcon
-                            {
-                                Icon = FontAwesome.Solid.Play,
-                                Size = Vector2.Zero,
-                                Colour = colours.Gray3,
-                                Anchor = Anchor.Centre,
-                                Origin = Anchor.Centre,
-                            },
-                            downloadIcon = new SpriteIcon
-                            {
-                                Icon = FontAwesome.Solid.FileDownload,
-                                Size = Vector2.Zero,
-                                Colour = colours.Gray3,
-                                Anchor = Anchor.Centre,
-                                Origin = Anchor.Centre,
-                            },
-                        },
-                    }
-                },
+                    RelativeSizeAxes = Axes.Both,
+                }
             };
 
             button.Action = () =>
@@ -127,32 +62,29 @@ namespace osu.Game.Screens.Play
                         scores.Download(Model.Value);
                         break;
 
+                    case DownloadState.Downloaded:
                     case DownloadState.Downloading:
                         shakeContainer.Shake();
                         break;
                 }
             };
 
-            State.BindValueChanged(state =>
+            State.BindValueChanged((state) =>
             {
-                switch (state.NewValue)
+                button.State.Value = state.NewValue;
+
+                switch (replayAvailability)
                 {
-                    case DownloadState.Downloading:
-                        playIcon.ResizeTo(Vector2.Zero, 400, Easing.OutQuint);
-                        downloadIcon.ResizeTo(13, 400, Easing.OutQuint);
-                        circle.FadeEdgeEffectTo(colours.Yellow, 400, Easing.OutQuint);
+                    case ReplayAvailability.Local:
+                        button.TooltipText = @"Watch replay";
                         break;
 
-                    case DownloadState.LocallyAvailable:
-                        playIcon.ResizeTo(13, 400, Easing.OutQuint);
-                        downloadIcon.ResizeTo(Vector2.Zero, 400, Easing.OutQuint);
-                        circle.FadeEdgeEffectTo(Color4.Black.Opacity(0.4f), 400, Easing.OutQuint);
+                    case ReplayAvailability.Online:
+                        button.TooltipText = @"Download replay";
                         break;
 
-                    case DownloadState.NotDownloaded:
-                        playIcon.ResizeTo(Vector2.Zero, 400, Easing.OutQuint);
-                        downloadIcon.ResizeTo(13, 400, Easing.OutQuint);
-                        circle.FadeEdgeEffectTo(Color4.Black.Opacity(0.4f), 400, Easing.OutQuint);
+                    default:
+                        button.TooltipText = @"Replay unavailable";
                         break;
                 }
             }, true);

osu.Game/Screens/Ranking/Pages/ScoreResultsPage.cs

@@ -173,7 +173,8 @@ namespace osu.Game.Screens.Ranking.Pages
                 {
                     Anchor = Anchor.BottomCentre,
                     Origin = Anchor.BottomCentre,
-                    Margin = new MarginPadding { Bottom = 5 },
+                    Margin = new MarginPadding { Bottom = 10 },
+                    Size = new Vector2(50, 30),
                 },
             };