Implement scrolling to each section

osu.Game/Overlays/Options/OptionsSection.cs

@@ -25,7 +25,7 @@ namespace osu.Game.Overlays.Options
             {
                 new Box
                 {
-                    Colour = new Color4(3, 3, 3, 255),
+                    Colour = new Color4(30, 30, 30, 255),
                     RelativeSizeAxes = Axes.X,
                     Height = borderSize,
                 },

osu.Game/Overlays/Options/OptionsSideNav.cs

@@ -0,0 +1,120 @@
+using System;
+using OpenTK;
+using OpenTK.Graphics;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.Primitives;
+using osu.Framework.Graphics.Sprites;
+
+namespace osu.Game.Overlays.Options
+{
+    public class OptionsSideNav : Container
+    {
+        public Action GeneralAction;
+        public Action GraphicsAction;
+        public Action GameplayAction;
+        public Action AudioAction;
+        public Action SkinAction;
+        public Action InputAction;
+        public Action EditorAction;
+        public Action OnlineAction;
+        public Action MaintenanceAction;
+    
+        public OptionsSideNav()
+        {
+            RelativeSizeAxes = Axes.Y;
+            Children = new Drawable[]
+            {
+                new FlowContainer
+                {
+                    AutoSizeAxes = Axes.Y,
+                    RelativeSizeAxes = Axes.X,
+                    Origin = Anchor.CentreLeft,
+                    Anchor = Anchor.CentreLeft,
+                    Direction = FlowDirection.VerticalOnly,
+                    Children = new[]
+                    {
+                        new SidebarButton
+                        {
+                            Icon = Graphics.FontAwesome.gear,
+                            Action = () => GeneralAction(),
+                        },
+                        new SidebarButton
+                        {
+                            Icon = Graphics.FontAwesome.laptop,
+                            Action = () => GraphicsAction(),
+                        },
+                        new SidebarButton
+                        {
+                            Icon = Graphics.FontAwesome.circle_o,
+                            Action = () => GameplayAction(),
+                        },
+                        new SidebarButton
+                        {
+                            Icon = Graphics.FontAwesome.headphones,
+                            Action = () => AudioAction(),
+                        },
+                        new SidebarButton
+                        {
+                            Icon = Graphics.FontAwesome.fa_paint_brush,
+                            Action = () => SkinAction(),
+                        },
+                        new SidebarButton
+                        {
+                            Icon = Graphics.FontAwesome.keyboard_o,
+                            Action = () => InputAction(),
+                        },
+                        new SidebarButton
+                        {
+                            Icon = Graphics.FontAwesome.pencil,
+                            Action = () => EditorAction(),
+                        },
+                        new SidebarButton
+                        {
+                            Icon = Graphics.FontAwesome.globe,
+                            Action = () => {
+                                OnlineAction();
+                            }
+                        },
+                        new SidebarButton
+                        {
+                            Icon = Graphics.FontAwesome.wrench,
+                            Action = () => MaintenanceAction(),
+                        }
+                    }
+                },
+                new Box
+                {
+                    Colour = new Color4(30, 30, 30, 255),
+                    RelativeSizeAxes = Axes.Y,
+                    Width = 2,
+                    Origin = Anchor.TopRight,
+                    Anchor = Anchor.TopRight,
+                }
+            };
+        }
+
+        private class SidebarButton : Container
+        {
+            private ToolbarButton button;
+            
+            public Action Action
+            {
+                get { return button.Action; }
+                set { button.Action = value; }
+            }
+            
+            public Graphics.FontAwesome Icon
+            {
+                get { return button.Icon; }
+                set { button.Icon = value; }
+            }
+            
+            public SidebarButton()
+            {
+                Size = new Vector2(60);
+                Children = new[] { button = new ToolbarButton() };
+            }
+        }
+    }
+}

osu.Game/Overlays/OptionsOverlay.cs

@@ -24,6 +24,21 @@ namespace osu.Game.Overlays
     {
         internal const float SideMargins = 10;
         private const float width = 400;
+        private const float sideNavWidth = 60;
+        private const float sideNavPadding = 0;
+
+        private ScrollContainer scrollContainer;
+        private FlowContainer flowContainer;
+        
+        private GeneralOptions generalOptions;
+        private GraphicsOptions graphicsOptions;
+        private GameplayOptions gameplayOptions;
+        private AudioOptions audioOptions;
+        private SkinOptions skinOptions;
+        private InputOptions inputOptions;
+        private EditorOptions editorOptions;
+        private OnlineOptions onlineOptions;
+        private MaintenanceOptions maintenanceOptions;
 
         public OptionsOverlay()
         {
@@ -40,14 +55,16 @@ namespace osu.Game.Overlays
                     Colour = Color4.Black,
                     Alpha = 0.8f,
                 },
-                // TODO: Links on the side to jump to a section
-                new ScrollContainer
+                scrollContainer = new ScrollContainer
                 {
-                    RelativeSizeAxes = Axes.Both,
                     ScrollDraggerAnchor = Anchor.TopLeft,
+                    RelativeSizeAxes = Axes.Y,
+                    Width = width - (sideNavWidth + sideNavPadding * 2),
+                    Position = new Vector2(sideNavWidth + sideNavPadding * 2, 0),
+                    // Note: removing this comment causes... compiler bugs? It's weird.2
                     Children = new[]
                     {
-                        new FlowContainer
+                        flowContainer = new FlowContainer
                         {
                             AutoSizeAxes = Axes.Y,
                             RelativeSizeAxes = Axes.X,
@@ -67,18 +84,32 @@ namespace osu.Game.Overlays
                                     TextSize = 18,
                                     Margin = new MarginPadding { Left = SideMargins, Bottom = 30 },
                                 },
-                                new GeneralOptions(),
-                                new GraphicsOptions(),
-                                new GameplayOptions(),
-                                new AudioOptions(),
-                                new SkinOptions(),
-                                new InputOptions(),
-                                new EditorOptions(),
-                                new OnlineOptions(),
-                                new MaintenanceOptions(),
+                                generalOptions = new GeneralOptions(),
+                                graphicsOptions = new GraphicsOptions(),
+                                gameplayOptions = new GameplayOptions(),
+                                audioOptions = new AudioOptions(),
+                                skinOptions = new SkinOptions(),
+                                inputOptions = new InputOptions(),
+                                editorOptions = new EditorOptions(),
+                                onlineOptions = new OnlineOptions(),
+                                maintenanceOptions = new MaintenanceOptions(),
                             }
                         }
                     }
+                },
+                new OptionsSideNav
+                {
+                    Padding = new MarginPadding { Left = sideNavPadding, Right = sideNavPadding },
+                    Width = sideNavWidth + sideNavPadding * 2,
+                    GeneralAction = () => scrollContainer.ScrollIntoView(generalOptions),
+                    GraphicsAction = () => scrollContainer.ScrollIntoView(graphicsOptions),
+                    GameplayAction = () => scrollContainer.ScrollIntoView(gameplayOptions),
+                    AudioAction = () => scrollContainer.ScrollIntoView(audioOptions),
+                    SkinAction = () => scrollContainer.ScrollIntoView(skinOptions),
+                    InputAction = () => scrollContainer.ScrollIntoView(inputOptions),
+                    EditorAction = () => scrollContainer.ScrollIntoView(editorOptions),
+                    OnlineAction = () => scrollContainer.ScrollIntoView(onlineOptions),
+                    MaintenanceAction = () => scrollContainer.ScrollIntoView(maintenanceOptions),
                 }
             };
         }
@@ -91,8 +122,7 @@ namespace osu.Game.Overlays
             {
                 case Key.Escape:
                     if (State == Visibility.Hidden) return false;
-
-                    State = Visibility.Hidden;
+                    Hide();
                     return true;
             }
             return base.OnKeyDown(state, args);

osu.Game/Overlays/ToolbarButton.cs

@@ -102,7 +102,7 @@ namespace osu.Game.Overlays
                     Alpha = 0,
                     Children = new[]
                     {
-                        tooltip1 = new SpriteText()
+                        tooltip1 = new SpriteText
                         {
                             TextSize = 22,
                         },
@@ -126,7 +126,7 @@ namespace osu.Game.Overlays
             Size = new Vector2(WIDTH + (DrawableText.IsVisible ? DrawableText.DrawSize.X : 0), 1);
         }
 
-        protected override bool OnClick(InputState state)
+        protected override bool OnMouseDown(InputState state, MouseDownEventArgs e)
         {
             Action?.Invoke();
             HoverBackground.FlashColour(Color4.White, 400);

osu.Game/osu.Game.csproj

@@ -229,6 +229,7 @@
     <Compile Include="Overlays\Options\OptionsSection.cs" />
     <Compile Include="Overlays\Options\OptionsSubsection.cs" />
     <Compile Include="Graphics\UserInterface\LoadingAnimation.cs" />
+    <Compile Include="Overlays\Options\OptionsSideNav.cs" />
   </ItemGroup>
   <ItemGroup>
     <ProjectReference Include="$(SolutionDir)\osu-framework\osu.Framework\osu.Framework.csproj">