Mirrors/overte-HifiExperiments
3
0
Fork 0
mirror of https://github.com/HifiExperiments/overte.git synced 2025-08-16 11:52:43 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

more wip

Browse source
This commit is contained in:
Wayne Chen 2018-10-25 14:11:55 -07:00
parent 75efc465b4
commit 5e73fe3e41
8 changed files with 217 additions and 237 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
interface/resources/qml/LoginDialog.qml
View file

@ -75,7 +75,6 @@ Windows.ModalWindow {
case Qt.Key_Escape:
case Qt.Key_Back:
event.accepted = true
destroy()
break
case Qt.Key_Enter:

36
interface/resources/qml/LoginDialog/CompleteProfileBody.qml
View file

@ -47,36 +47,6 @@ Item {
}
}
// timer to kill the dialog upon login success
Timer {
id: successTimer
interval: 500;
running: false;
repeat: false;
onTriggered: {
root.tryDestroy();
}
}
function hideContents(hide) {
additionalTextContainer.visible = !hide;
termsContainer.visible = !hide;
buttons.visible = !hide;
}
function loginSuccess(success) {
loginErrorMessage.visible = true;
loggedInGlyph.visible = success;
loginErrorMessage.text = success ? "You are now logged into Steam!" : "Error logging into Steam."
loginErrorMessage.color = success ? "white" : "red";
loginErrorMessage.font.pixelSize = success ? 24 : 12;
loginErrorMessage.anchors.leftMargin = (mainContainer.width - loginErrorMessageTextMetrics.width) / 2;
completeProfileBody.hideContents(success);
if (success) {
successTimer.start();
}
}
Item {
id: mainContainer
width: root.pane.width
@ -234,7 +204,7 @@ Item {
onLinkActivated: {
loginDialog.isLogIn = true;
bodyLoader.setSource("SignInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
bodyLoader.setSource("SignInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": "" });
}
}
@ -281,8 +251,8 @@ Item {
target: loginDialog
onHandleCreateCompleted: {
console.log("Create Succeeded")
loginDialog.loginThroughSteam()
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "withSteam": true, "fromBody": "CompleteProfileBody" })
}
onHandleCreateFailed: {
console.log("Create Failed: " + error)
@ -294,7 +264,7 @@ Item {
};
UserActivityLogger.logAction("encourageLoginDialog", data);
}
bodyLoader.setSource("UsernameCollisionBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
bodyLoader.setSource("UsernameCollisionBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": "" });
}
onHandleLoginCompleted: {
console.log("Login Succeeded")

23
interface/resources/qml/LoginDialog/LinkAccountBody.qml
View file

@ -28,6 +28,8 @@ Item {
property int fontSize: 24
property bool fontBold: true
property bool withSteam: false
property bool keyboardEnabled: false
property bool keyboardRaised: false
property bool punctuationMode: false
@ -63,7 +65,13 @@ Item {
function toggleSignIn(isLogIn) {
// going to/from sign in/up dialog.
loginDialog.isLogIn = isLogIn;
bodyLoader.setSource("SignInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
if (linkAccountBody.withSteam) {
loginDialog.loginThroughSteam();
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader,
"withSteam": linkAccountBody.withSteam, "fromBody": "LinkAccountBody" });
} else {
bodyLoader.setSource("SignInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": "" });
}
}
Item {
@ -142,6 +150,7 @@ Item {
leftMargin: (parent.width - d.minWidthButton) / 2
}
onClicked: {
linkAccountBody.withSteam = false;
toggleSignIn(false);
}
}
@ -187,12 +196,19 @@ Item {
}
onClicked: {
linkAccountBody.withSteam = false;
toggleSignIn(true);
}
}
TextMetrics {
id: steamLoginButtonTextMetrics
font: dismissText.font
text: qsTr("STEAM LOG IN")
}
HifiControlsUit.Button {
id: steamLoginButton;
width: d.minWidthButton
// textWidth + size of glyph + rightMargin
width: Math.max(d.minWidthButton, steamLoginButtonTextMetrics.width + 34 + buttonGlyphRightMargin + 2 * hifi.dimensions.contentSpacing.x);
height: d.minHeightButton
color: hifi.buttons.black;
anchors {
@ -209,8 +225,7 @@ Item {
buttonGlyphRightMargin: 10
onClicked: {
linkAccountBody.withSteam = true;
linkAccountBody.toggleLoading();
loginDialog.linkSteam();
toggleSignIn(true);
}
visible: loginDialog.isSteamRunning();
}

157
interface/resources/qml/LoginDialog/LoggingInBody.qml
View file

@ -7,8 +7,103 @@
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
//
import Hifi 1.0
import QtQuick 2.7
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4 as OriginalStyles
import "qrc:////qml//controls-uit" as HifiControlsUit
import "qrc:////qml//styles-uit" as HifiStylesUit
Item {
id: loggingInBody
property int textFieldHeight: 31
property int loggingInGlyphRightMargin: 10
property string fontFamily: "Cairo"
property int fontSize: 24
property bool fontBold: true
property bool withSteam: withSteam
property string fromBody: fromBody
QtObject {
id: d
readonly property int minWidth: 480
readonly property int minWidthButton: !root.isTablet ? 256 : 174
property int maxWidth: root.isTablet ? 1280 : Window.innerWidth
readonly property int minHeight: 120
readonly property int minHeightButton: !root.isTablet ? 56 : 42
property int maxHeight: root.isTablet ? 720 : Window.innerHeight
function resize() {
maxWidth = root.isTablet ? 1280 : Window.innerWidth;
maxHeight = root.isTablet ? 720 : Window.innerHeight;
var targetWidth = Math.max(titleWidth, mainContainer.width);
var targetHeight = hifi.dimensions.contentSpacing.y + mainContainer.height +
4 * hifi.dimensions.contentSpacing.y;
var newWidth = Math.max(d.minWidth, Math.min(d.maxWidth, targetWidth));
if (!isNaN(newWidth)) {
parent.width = root.pane.width = newWidth;
}
parent.height = root.pane.height = Math.max(d.minHeight, Math.min(d.maxHeight, targetHeight)) + hifi.dimensions.contentSpacing.y;
}
}
// timer to kill the dialog upon login success
Timer {
id: successTimer
interval: 1000;
running: false;
repeat: false;
onTriggered: {
root.tryDestroy();
}
}
// timer to kill the dialog upon login failure
Timer {
id: steamFailureTimer
interval: 2500;
running: false;
repeat: false;
onTriggered: {
// from linkaccount.
bodyLoader.setSource("LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader })
}
}
function init() {
// For the process of logging in.
loggingInText.wrapMode = Text.NoWrap;
if (loggingInBody.withSteam) {
loggingInGlyph.visible = true;
loggingInText.text = "Logging in to Steam";
loggingInText.x = loggingInHeader.width/2 - loggingInTextMetrics.width/2 + loggingInGlyphTextMetrics.width/2;
} else {
loggingInText.text = "Logging in";
loggingInText.anchors.bottom = loggingInHeader.bottom;
loggingInText.anchors.bottomMargin = hifi.dimensions.contentSpacing.y;
}
loggingInSpinner.visible = true;
}
function loadingSuccess() {
loggingInSpinner.visible = false;
if (loggingInBody.withSteam && !loginDialog.isLogIn) {
// reset the flag.
loggingInGlyph.visible = false;
loggingInText.text = "You are now logged into Steam!"
loggingInText.anchors.centerIn = loggingInHeader;
loggingInText.anchors.bottom = loggingInHeader.bottom;
loggedInGlyph.visible = true;
} else {
loggingInText.text = "You are now logged in!";
}
successTimer.start();
}
Item {
id: mainContainer
width: root.pane.width
@ -44,7 +139,6 @@ Item {
width: parent.width
height: parent.height
onHeightChanged: d.resize(); onWidthChanged: d.resize();
visible: false
Item {
id: loggingInHeader
@ -67,13 +161,13 @@ Item {
size: 31;
// Anchors
anchors.right: loggingInText.left;
anchors.rightMargin: signInBody.loggingInGlyphRightMargin
anchors.rightMargin: loggingInBody.loggingInGlyphRightMargin
anchors.bottom: parent.bottom;
anchors.bottomMargin: hifi.dimensions.contentSpacing.y
// Alignment
horizontalAlignment: Text.AlignHCenter;
verticalAlignment: Text.AlignVCenter;
visible: loginDialog.isSteamRunning();
visible: loggingInBody.withSteam;
}
TextMetrics {
@ -89,9 +183,10 @@ Item {
anchors.left: parent.left;
anchors.leftMargin: (parent.width - loggingInTextMetrics.width) / 2
color: "white";
font.family: signInBody.fontFamily
font.pixelSize: signInBody.fontSize
font.bold: signInBody.fontBold
font.family: loggingInBody.fontFamily
font.pixelSize: loggingInBody.fontSize
font.bold: loggingInBody.fontBold
wrapMode: Text.NoWrap
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
text: "Logging in"
@ -105,7 +200,7 @@ Item {
top: loggingInHeader.bottom
}
AnimatedImage {
id: linkAccountSpinner
id: loggingInSpinner
source: "../../icons/loader-snake-64-w.gif"
width: 128
height: width
@ -134,10 +229,54 @@ Item {
// Alignment
horizontalAlignment: Text.AlignHCenter;
verticalAlignment: Text.AlignVCenter;
visible: loginDialog.isSteamRunning();
visible: loggingInBody.withSteam;
}
}
}
}
Component.onCompleted: {
d.resize();
loggingInBody.init();
}
Connections {
target: loginDialog
onHandleSignupCompleted: {
console.log("SignUp completed!");
}
onHandleSignupFailed: {
console.log("SignUp failed!");
var errorStringEdited = errorString.replace(/[\n\r]+/g, ' ');
console.log(errorStringEdited);
bodyLoader.setSource("SignInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": errorStringEdited });
// bodyLoader.setSource("SignInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": "yellow" });
}
onHandleLoginCompleted: {
console.log("Login Succeeded")
loadingSuccess();
}
onHandleLoginFailed: {
console.log("Login Failed")
var errorString = "";
if (loggingInBody.withSteam && loggingInBody.fromBody === "LinkAccountBody") {
loggingInGlyph.visible = false;
loggingInText.text = "Your Steam authentication has failed. Please make sure you are logged into Steam and try again."
loggingInText.wrapMode = Text.WordWrap;
loggingInText.anchors.centerIn = loggingInHeader;
loggingInText.anchors.bottom = loggingInHeader.bottom;
steamFailureTimer.start();
} else if (loggingInBody.withSteam) {
errorString = "Your Steam authentication has failed. Please make sure you are logged into Steam and try again.";
bodyLoader.setSource("UsernameCollisionBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": errorString });
} else {
errorString = loginDialog.isLogIn ? "Username or password is incorrect." : "Failed to sign up. Please try again.";
bodyLoader.setSource("SignInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": errorString });
}
}
}
}

226
interface/resources/qml/LoginDialog/SignInBody.qml
View file

@ -24,7 +24,6 @@ Item {
height: root.pane.height
width: root.pane.width
property int textFieldHeight: 31
property bool failAfterSignUp: false
property string fontFamily: "Cairo"
property int fontSize: 24
property bool fontBold: true
@ -33,10 +32,10 @@ Item {
property bool keyboardRaised: false
property bool punctuationMode: false
property bool withSteam: loginDialog.isSteamRunning()
onKeyboardRaisedChanged: d.resize();
property string errorString: errorString
QtObject {
id: d
readonly property int minWidth: 480
@ -63,79 +62,13 @@ Item {
}
}
// timer to kill the dialog upon login success
Timer {
id: successTimer
interval: 500;
running: false;
repeat: false;
onTriggered: {
root.tryDestroy();
}
}
// timer to kill the dialog upon login failure
Timer {
id: failureTimer
interval: 1000;
running: false;
repeat: false;
onTriggered: {
resetContainers();
loginContainer.visible = true;
}
}
function login() {
signInBody.toggleLoading();
if (loginDialog.isLogIn) {
loginDialog.login(emailField.text, passwordField.text);
} else {
loginDialog.signup(usernameField.text, emailField.text, passwordField.text);
}
}
function resetContainers() {
loggingInContainer.visible = false;
loginContainer.visible = false;
}
function toggleLoading() {
// For the process of logging in.
signInBody.resetContainers();
loggingInContainer.visible = true;
if (loginDialog.isSteamRunning()) {
loggingInGlyph.visible = true;
loggingInText.text = "Logging in to Steam";
loggingInText.x = loggingInHeader.width/2 - loggingInTextMetrics.width/2 + loggingInGlyphTextMetrics.width/2;
} else {
loggingInText.text = "Logging in";
loggingInText.anchors.bottom = loggingInHeader.bottom;
loggingInText.anchors.bottomMargin = hifi.dimensions.contentSpacing.y;
}
linkAccountSpinner.visible = true;
}
function loadingSuccess(success, errorString) {
linkAccountSpinner.visible = false;
if (!success) {
loginErrorMessage.visible = true;
loginErrorMessage.text = errorString !== "" ? errorString : "unknown error.";
loginErrorMessage.anchors.bottom = loginDialog.isLogIn ? emailField.top : usernameField.top;
failureTimer.start();
return;
}
if (loginDialog.isSteamRunning() && !loginDialog.isLogIn) {
// reset the flag.
signInBody.withSteam = false;
loggingInGlyph.visible = false;
loggingInText.text = "You are now logged into Steam!"
loggingInText.anchors.centerIn = loggingInHeader;
loggingInText.anchors.bottom = loggingInHeader.bottom;
loggedInGlyph.visible = true;
} else {
loggingInText.text = "You are now logged in!";
}
successTimer.start();
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "withSteam": false, "fromBody": "" });
}
function init(isLogIn) {
@ -143,6 +76,12 @@ Item {
loginDialog.isLogIn = isLogIn;
usernameField.visible = !isLogIn;
cantAccessContainer.visible = isLogIn;
loginErrorMessage.visible = (signInBody.errorString !== "");
if (signInBody.errorString !== "") {
loginErrorMessage.text = signInBody.errorString;
errorContainer.anchors.bottom = loginDialog.isLogIn ? emailField.top : usernameField.top;
errorContainer.anchors.left = emailField.left;
}
if (isLogIn) {
loginButtonAtSignIn.text = "Log In";
loginButtonAtSignIn.color = hifi.buttons.black;
@ -152,9 +91,6 @@ Item {
emailField.anchors.top = loginContainer.top;
emailField.anchors.topMargin = !root.isTablet ? 0.2 * root.pane.height : 0.24 * root.pane.height;
cantAccessContainer.anchors.topMargin = !root.isTablet ? 3.5 * hifi.dimensions.contentSpacing.y : hifi.dimensions.contentSpacing.y;
} else if (loginDialog.isSteamRunning()) {
signInBody.toggleLoading();
loginDialog.loginWithSteam();
} else {
loginButtonAtSignIn.text = "Sign Up";
loginButtonAtSignIn.color = hifi.buttons.blue;
@ -164,8 +100,8 @@ Item {
emailField.anchors.topMargin = 1.5 * hifi.dimensions.contentSpacing.y;
passwordField.text = "";
}
loginErrorMessage.visible = false;
loginContainer.visible = true;
print(loginErrorMessage.visible);
}
Item {
@ -198,106 +134,6 @@ Item {
}
}
Item {
id: loggingInContainer
width: parent.width
height: parent.height
onHeightChanged: d.resize(); onWidthChanged: d.resize();
visible: false
Item {
id: loggingInHeader
width: parent.width
height: 0.5 * parent.height
anchors {
top: parent.top
}
TextMetrics {
id: loggingInGlyphTextMetrics;
font: loggingInGlyph.font;
text: loggingInGlyph.text;
}
HifiStylesUit.HiFiGlyphs {
id: loggingInGlyph;
text: hifi.glyphs.steamSquare;
// Color
color: "white";
// Size
size: 31;
// Anchors
anchors.right: loggingInText.left;
anchors.rightMargin: signInBody.loggingInGlyphRightMargin
anchors.bottom: parent.bottom;
anchors.bottomMargin: hifi.dimensions.contentSpacing.y
// Alignment
horizontalAlignment: Text.AlignHCenter;
verticalAlignment: Text.AlignVCenter;
visible: loginDialog.isSteamRunning();
}
TextMetrics {
id: loggingInTextMetrics;
font: loggingInText.font;
text: loggingInText.text;
}
Text {
id: loggingInText;
width: loggingInTextMetrics.width
anchors.bottom: parent.bottom;
anchors.bottomMargin: hifi.dimensions.contentSpacing.y
anchors.left: parent.left;
anchors.leftMargin: (parent.width - loggingInTextMetrics.width) / 2
color: "white";
font.family: signInBody.fontFamily
font.pixelSize: signInBody.fontSize
font.bold: signInBody.fontBold
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
text: "Logging in"
}
}
Item {
id: loggingInFooter
width: parent.width
height: 0.5 * parent.height
anchors {
top: loggingInHeader.bottom
}
AnimatedImage {
id: linkAccountSpinner
source: "../../icons/loader-snake-64-w.gif"
width: 128
height: width
anchors.left: parent.left;
anchors.leftMargin: (parent.width - width) / 2;
anchors.top: parent.top
anchors.topMargin: hifi.dimensions.contentSpacing.y
}
TextMetrics {
id: loggedInGlyphTextMetrics;
font: loggedInGlyph.font;
text: loggedInGlyph.text;
}
HifiStylesUit.HiFiGlyphs {
id: loggedInGlyph;
text: hifi.glyphs.steamSquare;
// color
color: "white"
// Size
size: 78;
// Anchors
anchors.left: parent.left;
anchors.leftMargin: (parent.width - loggedInGlyph.size) / 2;
anchors.top: parent.top
anchors.topMargin: hifi.dimensions.contentSpacing.y
// Alignment
horizontalAlignment: Text.AlignHCenter;
verticalAlignment: Text.AlignVCenter;
visible: loginDialog.isSteamRunning();
}
}
}
Item {
id: loginContainer
width: parent.width
@ -308,18 +144,30 @@ Item {
}
visible: true
Text {
id: loginErrorMessage;
anchors.bottom: emailField.top;
anchors.bottomMargin: 2
anchors.left: emailField.left;
color: "red";
font.family: signInBody.fontFamily
font.pixelSize: 12
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
text: ""
visible: false
Item {
id: errorContainer
width: loginErrorMessageTextMetrics.width
height: loginErrorMessageTextMetrics.height
anchors {
bottom: emailField.top;
bottomMargin: 2;
left: emailField.left;
}
TextMetrics {
id: loginErrorMessageTextMetrics
font: loginErrorMessage.font
text: loginErrorMessage.text
}
Text {
id: loginErrorMessage;
color: "red";
font.family: signInBody.fontFamily
font.pixelSize: 12
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
text: ""
visible: false
}
}
HifiControlsUit.TextField {
@ -464,7 +312,6 @@ Item {
anchors.fill: parent
acceptedButtons: Qt.LeftButton
onClicked: {
loginDialog.atSignIn = false;
bodyLoader.setSource("LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
}
}
@ -522,7 +369,8 @@ Item {
root.keyboardRaised = Qt.binding( function() { return keyboardRaised; })
}
d.resize();
init(loginDialog.isLogIn)
init(loginDialog.isLogIn);
print(signInBody.errorString);
}
Connections {
@ -594,6 +442,8 @@ Item {
}
switch (event.key) {
case Qt.Key_Escape:
break
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true

7
interface/resources/qml/LoginDialog/UsernameCollisionBody.qml
View file

@ -24,6 +24,8 @@ Item {
readonly property int fontSize: 24
readonly property bool fontBold: true
readonly property string errorString: errorString
function create() {
mainTextContainer.visible = false
loginDialog.createAccountFromStream(textField.text)
@ -236,6 +238,10 @@ Item {
}
d.resize();
if (usernameCollisionBody.errorString !== "") {
mainTextContainer.visible = true;
mainTextContainer.text = usernameCollisionBody.errorString;
}
}
Connections {
@ -243,6 +249,7 @@ Item {
onHandleCreateCompleted: {
console.log("Create Succeeded")
loginDialog.loginThroughSteam()
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "withSteam": true, "fromBody": "UsernameCollisionBody" })
}
onHandleCreateFailed: {
console.log("Create Failed: " + error)

2
interface/resources/qml/controls-uit/Button.qml
View file

@ -137,7 +137,7 @@ Original.Button {
text: control.text
Component.onCompleted: {
if (control.buttonGlyph !== "") {
buttonText.x = buttonContentItem.width/2 - buttonTextMetrics.width/2 + buttonGlyphTextMetrics.width/2;
buttonText.x = buttonContentItem.width/2 - buttonTextMetrics.width/2 + (buttonGlyphTextMetrics.width + control.buttonGlyphRightMargin)/2;
} else {
buttonText.anchors.centerIn = parent;
}

2
interface/src/ui/LoginDialog.h
View file

@ -55,7 +55,6 @@ public slots:
void signupCompleted(QNetworkReply* reply);
void signupFailed(QNetworkReply* reply);
protected slots:
Q_INVOKABLE bool isSteamRunning() const;
Q_INVOKABLE void login(const QString& username, const QString& password) const;
@ -66,6 +65,7 @@ protected slots:
Q_INVOKABLE void signup(const QString& email, const QString& username, const QString& password);
Q_INVOKABLE void openUrl(const QString& url) const;
private:
bool getIsLogIn() const { return _isLogIn; }
void setIsLogIn(const bool isLogIn) { _isLogIn = isLogIn; }