Add display name field to the log in screen.

This commit is contained in:
Saracen 2019-04-05 20:10:17 +01:00
parent d321ae9b79
commit 282fcf20ec
2 changed files with 68 additions and 18 deletions

View file

@ -85,27 +85,31 @@ Item {
UserActivityLogger.logAction("encourageLoginDialog", data); UserActivityLogger.logAction("encourageLoginDialog", data);
} }
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "withSteam": linkAccountBody.withSteam, bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "withSteam": linkAccountBody.withSteam,
"withOculus": linkAccountBody.withOculus, "linkSteam": linkAccountBody.linkSteam, "linkOculus": linkAccountBody.linkOculus }); "withOculus": linkAccountBody.withOculus, "linkSteam": linkAccountBody.linkSteam, "linkOculus": linkAccountBody.linkOculus,
"displayName":displayNameField.text });
} }
function init() { function init() {
// going to/from sign in/up dialog. // going to/from sign in/up dialog.
loginErrorMessage.text = linkAccountBody.errorString; loginErrorMessage.text = linkAccountBody.errorString;
loginErrorMessage.visible = (linkAccountBody.errorString !== ""); loginErrorMessage.visible = (linkAccountBody.errorString !== "");
if (loginErrorMessageTextMetrics.width > emailField.width) { if (loginErrorMessageTextMetrics.width > displayNameField.width) {
loginErrorMessage.wrapMode = Text.WordWrap; loginErrorMessage.wrapMode = Text.WordWrap;
errorContainer.height = (loginErrorMessageTextMetrics.width / emailField.width) * loginErrorMessageTextMetrics.height; errorContainer.height = (loginErrorMessageTextMetrics.width / displayNameField.width) * loginErrorMessageTextMetrics.height;
} }
loginButton.text = (!linkAccountBody.linkSteam && !linkAccountBody.linkOculus) ? "Log In" : "Link Account"; loginButton.text = (!linkAccountBody.linkSteam && !linkAccountBody.linkOculus) ? "Log In" : "Link Account";
loginButton.color = hifi.buttons.blue; loginButton.color = hifi.buttons.blue;
displayNameField.placeholderText = "Display Name (optional)";
var savedDisplayName = Settings.getValue("Avatar/displayName", "");
displayNameField.text = savedDisplayName;
emailField.placeholderText = "Username or Email"; emailField.placeholderText = "Username or Email";
var savedUsername = Settings.getValue("keepMeLoggedIn/savedUsername", ""); var savedUsername = Settings.getValue("keepMeLoggedIn/savedUsername", "");
emailField.text = keepMeLoggedInCheckbox.checked ? savedUsername === "Unknown user" ? "" : savedUsername : ""; emailField.text = keepMeLoggedInCheckbox.checked ? savedUsername === "Unknown user" ? "" : savedUsername : "";
if (linkAccountBody.linkSteam || linkAccountBody.linkOculus) { if (linkAccountBody.linkSteam || linkAccountBody.linkOculus) {
loginButton.width = (passwordField.width - hifi.dimensions.contentSpacing.x) / 2; loginButton.width = (passwordField.width - hifi.dimensions.contentSpacing.x) / 2;
loginButton.anchors.right = emailField.right; loginButton.anchors.right = displayName.right;
} else { } else {
loginButton.anchors.left = emailField.left; loginButton.anchors.left = displayName.left;
} }
loginContainer.visible = true; loginContainer.visible = true;
} }
@ -125,14 +129,14 @@ Item {
Item { Item {
id: loginContainer id: loginContainer
width: emailField.width width: displayNameField.width
height: errorContainer.height + emailField.height + passwordField.height + 5.5 * hifi.dimensions.contentSpacing.y + height: errorContainer.height + displayNameField.height + emailField.height + passwordField.height + 5.5 * hifi.dimensions.contentSpacing.y +
keepMeLoggedInCheckbox.height + loginButton.height + cantAccessTextMetrics.height + continueButton.height keepMeLoggedInCheckbox.height + loginButton.height + cantAccessTextMetrics.height + continueButton.height
anchors { anchors {
top: parent.top top: parent.top
topMargin: root.bannerHeight + 0.25 * parent.height topMargin: root.bannerHeight + 0.25 * parent.height
left: parent.left left: parent.left
leftMargin: (parent.width - emailField.width) / 2 leftMargin: (parent.width - displayNameField.width) / 2
} }
Item { Item {
@ -140,9 +144,9 @@ Item {
width: parent.width width: parent.width
height: loginErrorMessageTextMetrics.height height: loginErrorMessageTextMetrics.height
anchors { anchors {
bottom: emailField.top; bottom: displayNameField.top;
bottomMargin: hifi.dimensions.contentSpacing.y; bottomMargin: hifi.dimensions.contentSpacing.y;
left: emailField.left; left: displayNameField.left;
} }
TextMetrics { TextMetrics {
id: loginErrorMessageTextMetrics id: loginErrorMessageTextMetrics
@ -163,7 +167,7 @@ Item {
} }
HifiControlsUit.TextField { HifiControlsUit.TextField {
id: emailField id: displayNameField
width: root.bannerWidth width: root.bannerWidth
height: linkAccountBody.textFieldHeight height: linkAccountBody.textFieldHeight
font.pixelSize: linkAccountBody.textFieldFontSize font.pixelSize: linkAccountBody.textFieldFontSize
@ -172,6 +176,45 @@ Item {
top: parent.top top: parent.top
topMargin: errorContainer.height topMargin: errorContainer.height
} }
placeholderText: "Display Name (optional)"
activeFocusOnPress: true
Keys.onPressed: {
switch (event.key) {
case Qt.Key_Tab:
event.accepted = true;
emailField.focus = true;
break;
case Qt.Key_Backtab:
event.accepted = true;
passwordField.focus = true;
break;
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true;
if (keepMeLoggedInCheckbox.checked) {
Settings.setValue("keepMeLoggedIn/savedUsername", emailField.text);
}
linkAccountBody.login();
break;
}
}
onFocusChanged: {
root.text = "";
if (focus) {
root.isPassword = false;
}
}
}
HifiControlsUit.TextField {
id: emailField
width: root.bannerWidth
height: linkAccountBody.textFieldHeight
font.pixelSize: linkAccountBody.textFieldFontSize
styleRenderType: Text.QtRendering
anchors {
top: displayNameField.bottom
topMargin: 1.5 * hifi.dimensions.contentSpacing.y
}
placeholderText: "Username or Email" placeholderText: "Username or Email"
activeFocusOnPress: true activeFocusOnPress: true
Keys.onPressed: { Keys.onPressed: {
@ -182,7 +225,7 @@ Item {
break; break;
case Qt.Key_Backtab: case Qt.Key_Backtab:
event.accepted = true; event.accepted = true;
passwordField.focus = true; displayNameField.focus = true;
break; break;
case Qt.Key_Enter: case Qt.Key_Enter:
case Qt.Key_Return: case Qt.Key_Return:
@ -257,6 +300,9 @@ Item {
Keys.onPressed: { Keys.onPressed: {
switch (event.key) { switch (event.key) {
case Qt.Key_Tab: case Qt.Key_Tab:
event.accepted = true;
displayNameField.focus = true;
break;
case Qt.Key_Backtab: case Qt.Key_Backtab:
event.accepted = true; event.accepted = true;
emailField.focus = true; emailField.focus = true;
@ -350,7 +396,7 @@ Item {
anchors { anchors {
top: loginButton.bottom top: loginButton.bottom
topMargin: hifi.dimensions.contentSpacing.y topMargin: hifi.dimensions.contentSpacing.y
left: emailField.left left: displayName.left
} }
font.family: linkAccountBody.fontFamily font.family: linkAccountBody.fontFamily
font.pixelSize: linkAccountBody.textFieldFontSize font.pixelSize: linkAccountBody.textFieldFontSize
@ -381,13 +427,13 @@ Item {
} }
HifiControlsUit.Button { HifiControlsUit.Button {
id: continueButton; id: continueButton;
width: emailField.width; width: displayName.width;
height: d.minHeightButton height: d.minHeightButton
color: hifi.buttons.none; color: hifi.buttons.none;
anchors { anchors {
top: cantAccessText.bottom top: cantAccessText.bottom
topMargin: hifi.dimensions.contentSpacing.y topMargin: hifi.dimensions.contentSpacing.y
left: emailField.left left: displayName.left
} }
text: qsTr("CONTINUE WITH STEAM") text: qsTr("CONTINUE WITH STEAM")
fontFamily: linkAccountBody.fontFamily fontFamily: linkAccountBody.fontFamily
@ -420,7 +466,8 @@ Item {
} }
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader,
"withSteam": linkAccountBody.withSteam, "withOculus": linkAccountBody.withOculus, "linkSteam": linkAccountBody.linkSteam, "linkOculus": linkAccountBody.linkOculus }); "withSteam": linkAccountBody.withSteam, "withOculus": linkAccountBody.withOculus, "linkSteam": linkAccountBody.linkSteam, "linkOculus": linkAccountBody.linkOculus,
"displayName":displayNameField.text});
} }
Component.onCompleted: { Component.onCompleted: {
if (linkAccountBody.linkSteam || linkAccountBody.linkOculus) { if (linkAccountBody.linkSteam || linkAccountBody.linkOculus) {
@ -535,7 +582,7 @@ Item {
onFocusEnabled: { onFocusEnabled: {
if (!linkAccountBody.lostFocus) { if (!linkAccountBody.lostFocus) {
Qt.callLater(function() { Qt.callLater(function() {
emailField.forceActiveFocus(); displayName.forceActiveFocus();
}); });
} }
} }
@ -543,6 +590,7 @@ Item {
linkAccountBody.lostFocus = !root.isTablet && !root.isOverlay; linkAccountBody.lostFocus = !root.isTablet && !root.isOverlay;
if (linkAccountBody.lostFocus) { if (linkAccountBody.lostFocus) {
Qt.callLater(function() { Qt.callLater(function() {
displayName.focus = false;
emailField.focus = false; emailField.focus = false;
passwordField.focus = false; passwordField.focus = false;
}); });
@ -558,7 +606,7 @@ Item {
d.resize(); d.resize();
init(); init();
Qt.callLater(function() { Qt.callLater(function() {
emailField.forceActiveFocus(); displayName.forceActiveFocus();
}); });
} }

View file

@ -31,6 +31,7 @@ Item {
property bool linkSteam: linkSteam property bool linkSteam: linkSteam
property bool linkOculus: linkOculus property bool linkOculus: linkOculus
property bool createOculus: createOculus property bool createOculus: createOculus
property string displayName: ""
readonly property bool loginDialogPoppedUp: loginDialog.getLoginDialogPoppedUp() readonly property bool loginDialogPoppedUp: loginDialog.getLoginDialogPoppedUp()
@ -161,6 +162,7 @@ Item {
} }
} }
MyAvatar.displayName = displayName;
successTimer.start(); successTimer.start();
} }