RepoMirrors
/
osu
mirror of https://github.com/ppy/osu
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add remaining steps to registration screen

This commit is contained in:
Dean Herbert 2018-12-06 11:58:09 +09:00
parent 0df9fa1e59
commit e56f4cc8a5
7 changed files with 407 additions and 174 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
osu.Game.Tests/Visual/TestCaseAccountCreationOverlay.cs
View File

@ -1,13 +1,26 @@
// Copyright (c) 2007-2018 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using System;
using System.Collections.Generic;
using osu.Framework.Graphics.Containers;
using osu.Game.Overlays;
using osu.Game.Overlays.AccountCreation;
namespace osu.Game.Tests.Visual
{
public class TestCaseAccountCreationOverlay : OsuTestCase
{
public override IReadOnlyList<Type> RequiredTypes => new[]
{
typeof(ErrorTextFlowContainer),
typeof(AccountCreationBackground),
typeof(ScreenEntry),
typeof(ScreenWarning),
typeof(ScreenWelcome),
typeof(AccountCreationScreen),
};
public TestCaseAccountCreationOverlay()
{
var accountCreation = new AccountCreationOverlay();

3
osu.Game/Overlays/AccountCreation/RegistrationBackground.cs → osu.Game/Overlays/AccountCreation/AccountCreationBackground.cs
View File

@ -1,3 +1,6 @@
// Copyright (c) 2007-2018 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Sprites;

28
osu.Game/Overlays/AccountCreation/AccountCreationScreen.cs Normal file
View File

@ -0,0 +1,28 @@
// Copyright (c) 2007-2018 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using osu.Framework.Graphics;
using osu.Framework.Screens;
namespace osu.Game.Overlays.AccountCreation
{
public abstract class AccountCreationScreen : Screen
{
protected AccountCreationScreen()
{
ValidForResume = false;
}
protected override void OnEntering(Screen last)
{
base.OnEntering(last);
Content.FadeOut().Delay(200).FadeIn(200);
}
protected override void OnSuspending(Screen next)
{
base.OnSuspending(next);
Content.FadeOut(200);
}
}
}

202
osu.Game/Overlays/AccountCreation/ScreenEntry.cs Normal file
View File

@ -0,0 +1,202 @@
// Copyright (c) 2007-2018 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using System;
using System.Collections.Generic;
using System.Threading.Tasks;
using osu.Framework.Allocation;
using osu.Framework.Extensions.IEnumerableExtensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Sprites;
using osu.Framework.MathUtils;
using osu.Framework.Screens;
using osu.Game.Graphics;
using osu.Game.Graphics.Containers;
using osu.Game.Graphics.Sprites;
using osu.Game.Graphics.UserInterface;
using osu.Game.Online.API;
using osu.Game.Overlays.Settings;
using osuTK;
using osuTK.Graphics;
namespace osu.Game.Overlays.AccountCreation
{
public class ScreenEntry : AccountCreationScreen
{
private ErrorTextFlowContainer usernameDescription;
private ErrorTextFlowContainer emailAddressDescription;
private ErrorTextFlowContainer passwordDescription;
private OsuTextBox usernameTextBox;
private OsuTextBox emailTextBox;
private OsuPasswordTextBox passwordTextBox;
private APIAccess api;
private ShakeContainer registerShake;
private IEnumerable<SpriteText> characterCheckText;
protected override void OnEntering(Screen last)
{
base.OnEntering(last);
var nextTextbox = nextUnfilledTextbox();
if (nextTextbox != null)
Schedule(() => GetContainingInputManager().ChangeFocus(nextTextbox));
}
[BackgroundDependencyLoader]
private void load(OsuColour colours, APIAccess api)
{
this.api = api;
Child = new FillFlowContainer
{
RelativeSizeAxes = Axes.Both,
Direction = FillDirection.Vertical,
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Padding = new MarginPadding(20),
Spacing = new Vector2(0, 10),
Children = new Drawable[]
{
new OsuSpriteText
{
TextSize = 20,
Margin = new MarginPadding { Vertical = 10 },
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Text = "Let's create an account!",
},
usernameTextBox = new OsuTextBox
{
PlaceholderText = "username",
RelativeSizeAxes = Axes.X,
TabbableContentContainer = this
},
usernameDescription = new ErrorTextFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y
},
emailTextBox = new OsuTextBox
{
PlaceholderText = "email address",
RelativeSizeAxes = Axes.X,
TabbableContentContainer = this
},
emailAddressDescription = new ErrorTextFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y
},
passwordTextBox = new OsuPasswordTextBox
{
PlaceholderText = "password",
RelativeSizeAxes = Axes.X,
TabbableContentContainer = this,
},
passwordDescription = new ErrorTextFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y
},
new Container
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Children = new Drawable[]
{
registerShake = new ShakeContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Child = new SettingsButton
{
Text = "Register",
Margin = new MarginPadding { Vertical = 20 },
Action = performRegistration
}
}
}
},
}
};
usernameDescription.AddText("This will be your public presence. No profanity, no impersonation. Avoid exposing your own personal details, too!");
emailAddressDescription.AddText("Will be used for notifications, account verification and in the case you forget your password. No spam, ever.");
emailAddressDescription.AddText(" Make sure to get it right!", cp => cp.Font = "Exo2.0-Bold");
passwordDescription.AddText("At least ");
characterCheckText = passwordDescription.AddText("8 characters long");
passwordDescription.AddText(". Choose something long but also something you will remember, like a line from your favourite song.");
passwordTextBox.Current.ValueChanged += text => { characterCheckText.ForEach(s => s.Colour = text.Length == 0 ? Color4.White : Interpolation.ValueAt(text.Length, Color4.OrangeRed, Color4.YellowGreen, 0, 8, Easing.In)); };
}
private void performRegistration()
{
var textbox = nextUnfilledTextbox();
if (textbox != null)
{
Schedule(() => GetContainingInputManager().ChangeFocus(textbox));
registerShake.Shake();
return;
}
usernameDescription.ClearErrors();
emailAddressDescription.ClearErrors();
passwordDescription.ClearErrors();
Task.Run(() =>
{
bool success;
RegistrationRequest.RegistrationRequestErrors errors = null;
try
{
errors = api.CreateAccount(emailTextBox.Text, usernameTextBox.Text, passwordTextBox.Text);
success = errors == null;
}
catch (Exception)
{
success = false;
}
Schedule(() =>
{
if (!success)
{
if (errors != null)
{
usernameDescription.AddErrors(errors.User.Username);
emailAddressDescription.AddErrors(errors.User.Email);
passwordDescription.AddErrors(errors.User.Password);
}
else
{
passwordDescription.AddErrors(new[] { "Something happened... but we're not sure what." });
}
registerShake.Shake();
return;
}
api.Login(emailTextBox.Text, passwordTextBox.Text);
});
});
}
private OsuTextBox nextUnfilledTextbox()
{
OsuTextBox textboxIfUsable(OsuTextBox textbox)
{
return !string.IsNullOrEmpty(textbox.Text) ? null : textbox;
}
return textboxIfUsable(usernameTextBox) ?? textboxIfUsable(emailTextBox) ?? textboxIfUsable(passwordTextBox);
}
}
}

95
osu.Game/Overlays/AccountCreation/ScreenWarning.cs Normal file
View File

@ -0,0 +1,95 @@
// Copyright (c) 2007-2018 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Game.Graphics;
using osu.Game.Graphics.Containers;
using osu.Game.Graphics.Sprites;
using osu.Game.Online.API;
using osu.Game.Overlays.Settings;
using osu.Game.Screens.Menu;
using osuTK;
using osuTK.Graphics;
namespace osu.Game.Overlays.AccountCreation
{
public class ScreenWarning : AccountCreationScreen
{
private OsuTextFlowContainer multiAccountExplanationText;
private LinkFlowContainer furtherAssistance;
private const string help_centre_url = "https://osu.ppy.sh/help/wiki/Help_Centre#login";
[BackgroundDependencyLoader(true)]
private void load(OsuColour colours, APIAccess api, OsuGame game)
{
Child = new FillFlowContainer
{
RelativeSizeAxes = Axes.Both,
Direction = FillDirection.Vertical,
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Padding = new MarginPadding(20),
Spacing = new Vector2(0, 5),
Children = new Drawable[]
{
new OsuLogo
{
Scale = new Vector2(0.1f),
Margin = new MarginPadding { Top = 500, Bottom = 300 },
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Triangles = false,
BeatMatching = false,
},
new OsuSpriteText
{
TextSize = 28,
Font = "Exo2.0-Light",
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Colour = Color4.Red,
Text = "Warning! 注意！",
},
multiAccountExplanationText = new OsuTextFlowContainer(cp => { cp.TextSize = 12; })
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y
},
new SettingsButton
{
Text = "Help, I can't access my account!",
Margin = new MarginPadding { Top = 50 },
Action = () => game?.OpenUrlExternally(help_centre_url)
},
new DangerousSettingsButton
{
Text = "I understand. This account isn't for me.",
Action = () => Push(new ScreenEntry())
},
furtherAssistance = new LinkFlowContainer(cp => { cp.TextSize = 12; })
{
Margin = new MarginPadding { Top = 20 },
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
AutoSizeAxes = Axes.Both
},
}
};
multiAccountExplanationText.AddText("Are you ");
multiAccountExplanationText.AddText(api.ProvidedUsername, cp => cp.Colour = colours.BlueLight);
multiAccountExplanationText.AddText("? osu! has a policy of ");
multiAccountExplanationText.AddText("one account per person!", cp => cp.Colour = colours.Yellow);
multiAccountExplanationText.AddText(" Please be aware that creating more than one account per person may result in ");
multiAccountExplanationText.AddText("permanent deactivation of accounts", cp => cp.Colour = colours.Yellow);
multiAccountExplanationText.AddText(".");
furtherAssistance.AddText("Need further assistance? Contact us via our ");
furtherAssistance.AddLink("support system", help_centre_url);
furtherAssistance.AddText(".");
}
}
}

63
osu.Game/Overlays/AccountCreation/ScreenWelcome.cs Normal file
View File

@ -0,0 +1,63 @@
// Copyright (c) 2007-2018 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Game.Graphics.Sprites;
using osu.Game.Overlays.Settings;
using osu.Game.Screens.Menu;
using osuTK;
namespace osu.Game.Overlays.AccountCreation
{
public class ScreenWelcome : AccountCreationScreen
{
[BackgroundDependencyLoader]
private void load()
{
Child = new FillFlowContainer
{
RelativeSizeAxes = Axes.Both,
Direction = FillDirection.Vertical,
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Padding = new MarginPadding(20),
Spacing = new Vector2(0, 5),
Children = new Drawable[]
{
new OsuLogo
{
Scale = new Vector2(0.1f),
Margin = new MarginPadding { Vertical = 500 },
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Triangles = false,
BeatMatching = false,
},
new OsuSpriteText
{
TextSize = 24,
Font = "Exo2.0-Light",
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Text = "New Player Registration",
},
new OsuSpriteText
{
TextSize = 12,
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Text = "let's get you started",
},
new SettingsButton
{
Text = "Let's create an account!",
Margin = new MarginPadding { Vertical = 120 },
Action = () => Push(new ScreenWarning())
}
}
};
}
}
}

177
osu.Game/Overlays/AccountCreationOverlay.cs
View File

@ -1,43 +1,22 @@
// Copyright (c) 2007-2018 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using System;
using System.Collections.Generic;
using System.Threading.Tasks;
using osu.Framework.Allocation;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Extensions.IEnumerableExtensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Game.Graphics;
using osuTK.Graphics;
using osu.Framework.Graphics.Shapes;
using osu.Framework.Graphics.Sprites;
using osu.Framework.MathUtils;
using osu.Game.Graphics;
using osu.Game.Graphics.Containers;
using osu.Game.Graphics.Sprites;
using osu.Game.Graphics.UserInterface;
using osu.Game.Online.API;
using osu.Game.Overlays.AccountCreation;
using osu.Game.Overlays.Settings;
using osuTK;
using osuTK.Graphics;
namespace osu.Game.Overlays
{
public class AccountCreationOverlay : OsuFocusedOverlayContainer, IOnlineComponent
{
private ErrorTextFlowContainer usernameDescription;
private ErrorTextFlowContainer emailAddressDescription;
private ErrorTextFlowContainer passwordDescription;
private OsuTextBox usernameTextBox;
private OsuTextBox emailTextBox;
private OsuPasswordTextBox passwordTextBox;
private APIAccess api;
private ShakeContainer registerShake;
private IEnumerable<SpriteText> characterCheckText;
private const float transition_time = 400;
public AccountCreationOverlay()
@ -50,8 +29,6 @@ public AccountCreationOverlay()
[BackgroundDependencyLoader]
private void load(OsuColour colours, APIAccess api)
{
this.api = api;
api.Register(this);
Children = new Drawable[]
@ -90,166 +67,18 @@ private void load(OsuColour colours, APIAccess api)
Colour = Color4.Black,
Alpha = 0.9f,
},
new FillFlowContainer
{
RelativeSizeAxes = Axes.Both,
Direction = FillDirection.Vertical,
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Padding = new MarginPadding(20),
Spacing = new Vector2(0, 10),
Children = new Drawable[]
{
new OsuSpriteText
{
TextSize = 20,
Margin = new MarginPadding { Vertical = 10 },
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Text = "Let's create an account!",
},
usernameTextBox = new OsuTextBox
{
PlaceholderText = "username",
RelativeSizeAxes = Axes.X,
TabbableContentContainer = this
},
usernameDescription = new ErrorTextFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y
},
emailTextBox = new OsuTextBox
{
PlaceholderText = "email address",
RelativeSizeAxes = Axes.X,
Text = api.ProvidedUsername ?? string.Empty,
TabbableContentContainer = this
},
emailAddressDescription = new ErrorTextFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y
},
passwordTextBox = new OsuPasswordTextBox
{
PlaceholderText = "password",
RelativeSizeAxes = Axes.X,
TabbableContentContainer = this,
},
passwordDescription = new ErrorTextFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y
},
new Container
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Children = new Drawable[]
{
registerShake = new ShakeContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Child = new SettingsButton
{
Text = "Register",
Margin = new MarginPadding { Vertical = 20 },
Action = performRegistration
}
}
}
},
}
},
new ScreenWelcome(),
}
}
}
}
};
usernameDescription.AddText("This will be your public presence. No profanity, no impersonation. Avoid exposing your own personal details, too!");
emailAddressDescription.AddText("Will be used for notifications, account verification and in the case you forget your password. No spam, ever.");
emailAddressDescription.AddText(" Make sure to get it right!", cp => cp.Font = "Exo2.0-Bold");
passwordDescription.AddText("At least ");
characterCheckText = passwordDescription.AddText("8 characters long");
passwordDescription.AddText(". Choose something long but also something you will remember, like a line from your favourite song.");
passwordTextBox.Current.ValueChanged += text => { characterCheckText.ForEach(s => s.Colour = text.Length == 0 ? Color4.White : Interpolation.ValueAt(text.Length, Color4.OrangeRed, Color4.YellowGreen, 0, 8, Easing.In)); };
}
private void performRegistration()
{
var textbox = nextUnfilledTextbox();
if (textbox != null)
{
Schedule(() => GetContainingInputManager().ChangeFocus(textbox));
registerShake.Shake();
return;
}
usernameDescription.ClearErrors();
emailAddressDescription.ClearErrors();
passwordDescription.ClearErrors();
Task.Run(() =>
{
bool success;
RegistrationRequest.RegistrationRequestErrors errors = null;
try
{
errors = api.CreateAccount(emailTextBox.Text, usernameTextBox.Text, passwordTextBox.Text);
success = errors == null;
}
catch (Exception)
{
success = false;
}
Schedule(() =>
{
if (!success)
{
if (errors != null)
{
usernameDescription.AddErrors(errors.User.Username);
emailAddressDescription.AddErrors(errors.User.Email);
passwordDescription.AddErrors(errors.User.Password);
}
else
{
passwordDescription.AddErrors(new[] { "Something happened... but we're not sure what." });
}
registerShake.Shake();
return;
}
api.Login(emailTextBox.Text, passwordTextBox.Text);
});
});
}
private OsuTextBox nextUnfilledTextbox()
{
OsuTextBox textboxIfUsable(OsuTextBox textbox) => !string.IsNullOrEmpty(textbox.Text) ? null : textbox;
return textboxIfUsable(usernameTextBox) ?? textboxIfUsable(emailTextBox) ?? textboxIfUsable(passwordTextBox);
}
protected override void PopIn()
{
base.PopIn();
this.FadeIn(transition_time, Easing.OutQuint);
var nextTextbox = nextUnfilledTextbox();
if (nextTextbox != null)
Schedule(() => GetContainingInputManager().ChangeFocus(nextTextbox));
}
protected override void PopOut()