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

more wip

Browse source
This commit is contained in:
Wayne Chen 2018-10-22 17:38:12 -07:00
parent 9af164cb94
commit b33267a63a
2 changed files with 336 additions and 88 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -47,7 +47,6 @@ Windows.ModalWindow {
Loader { Loader {
id: bodyLoader id: bodyLoader
source: loginDialog.isSteamRunning() ? "LoginDialog/SignInBody.qml" : "LoginDialog/LinkAccountBody.qml"
} }
} }
@ -86,4 +85,8 @@ Windows.ModalWindow {
} }
} }
Component.onCompleted: {
bodyLoader.setSource("LoginDialog/LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root });
}
} }

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

@ -27,14 +27,17 @@ Item {
property bool keyboardRaised: false property bool keyboardRaised: false
property bool punctuationMode: false property bool punctuationMode: false
property bool withSteam: false
onKeyboardRaisedChanged: d.resize(); onKeyboardRaisedChanged: d.resize();
QtObject { QtObject {
id: d id: d
readonly property int minWidth: 480 readonly property int minWidth: 480
readonly property int minWidthButton: !root.isTablet ? 256 : 174
property int maxWidth: root.isTablet ? 1280 : Window.innerWidth property int maxWidth: root.isTablet ? 1280 : Window.innerWidth
readonly property int minHeight: 120 readonly property int minHeight: 120
readonly property int minHeightButton: !root.isTablet ? 56 : 42
property int maxHeight: root.isTablet ? 720 : Window.innerHeight property int maxHeight: root.isTablet ? 720 : Window.innerHeight
function resize() { function resize() {
@ -54,6 +57,42 @@ Item {
} }
} }
function toggleLoggingIn(loggingIn) {
// For the process of logging in.
if (withSteam) {
}
else {
}
}
function toggleSignIn(signIn, isLogIn) {
// going to/from sign in/up dialog.
if (signIn) {
usernameField.visible = !isLogIn;
cantAccessContainer.visible = isLogIn;
if (isLogIn) {
emailField.placeholderText = "Username or Email";
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 {
emailField.placeholderText = "Email";
emailField.anchors.top = usernameField.bottom;
emailField.anchors.topMargin = 1.5 * hifi.dimensions.contentSpacing.y;
}
}
splashContainer.visible = !signIn;
topContainer.height = signIn ? root.pane.height : 0.6 * topContainer.height;
bottomContainer.visible = !signIn;
dismissTextContainer.visible = !signIn;
topOpaqueRect.visible = signIn;
loginContainer.visible = signIn;
}
function toggleLoading(isLoading) { function toggleLoading(isLoading) {
linkAccountSpinner.visible = isLoading linkAccountSpinner.visible = isLoading
form.visible = !isLoading form.visible = !isLoading
@ -69,13 +108,22 @@ Item {
height: 0.6 * root.pane.height height: 0.6 * root.pane.height
onHeightChanged: d.resize(); onWidthChanged: d.resize(); onHeightChanged: d.resize(); onWidthChanged: d.resize();
Rectangle {
id: topOpaqueRect
height: parent.height
width: parent.width
opacity: 0.7
color: "black"
visible: false
}
Item { Item {
id: bannerContainer id: bannerContainer
width: parent.width width: parent.width
height: banner.height height: banner.height
anchors { anchors {
top: parent.top top: parent.top
topMargin: 0.17 * parent.height topMargin: 85
} }
Image { Image {
id: banner id: banner
@ -84,44 +132,251 @@ Item {
horizontalAlignment: Image.AlignHCenter horizontalAlignment: Image.AlignHCenter
} }
} }
Text { Item {
id: flavorText id: loginContainer
text: qsTr("BE ANYWHERE, WITH ANYONE RIGHT NOW") width: parent.width
width: 0.48 * parent.width height: parent.height - (bannerContainer.height + 1.5 * hifi.dimensions.contentSpacing.y)
anchors.centerIn: parent
anchors { anchors {
top: bannerContainer.bottom top: bannerContainer.bottom
topMargin: 0.1 * parent.height topMargin: 1.5 * hifi.dimensions.contentSpacing.y
} }
wrapMode: Text.WordWrap visible: false
lineHeight: 1
color: "white" HifiControlsUit.TextField {
font.family: "Raleway" id: usernameField
font.pixelSize: 55 width: 0.254 * parent.width
font.bold: true placeholderText: "Username"
lineHeightMode: Text.ProportionalHeight anchors {
horizontalAlignment: Text.AlignHCenter top: parent.top
topMargin: 0.2 * parent.height
left: parent.left
leftMargin: (parent.width - usernameField.width) / 2
}
visible: false
}
HifiControlsUit.TextField {
id: emailField
width: 0.254 * parent.width
text: Settings.getValue("wallet/savedUsername", "");
anchors {
top: parent.top
left: parent.left
leftMargin: (parent.width - emailField.width) / 2
}
focus: true
placeholderText: "Username or Email"
activeFocusOnPress: true
onHeightChanged: d.resize(); onWidthChanged: d.resize();
Component.onCompleted: {
var savedUsername = Settings.getValue("wallet/savedUsername", "");
emailField.text = savedUsername === "Unknown user" ? "" : savedUsername;
}
}
HifiControlsUit.TextField {
id: passwordField
width: 0.254 * parent.width
placeholderText: "Password"
activeFocusOnPress: true
echoMode: passwordFieldMouseArea.showPassword ? TextInput.Normal : TextInput.Password
anchors {
top: emailField.bottom
topMargin: 1.5 * hifi.dimensions.contentSpacing.y
left: parent.left
leftMargin: (parent.width - emailField.width) / 2
}
onFocusChanged: {
// root.text = "";
// root.isPassword = true;
}
Rectangle {
id: showPasswordHitbox
z: 10
x: passwordField.width - ((passwordField.height) * 31 / 23)
width: parent.width - (parent.width - (parent.height * 31/16))
height: parent.height
anchors {
right: parent.right
}
color: "transparent"
Image {
id: showPasswordImage
width: passwordField.height * 16 / 23
height: passwordField.height * 16 / 23
anchors {
right: parent.right
rightMargin: 8
top: parent.top
topMargin: passwordFieldMouseArea.showPassword ? 6 : 8
bottom: parent.bottom
bottomMargin: passwordFieldMouseArea.showPassword ? 5 : 8
}
source: passwordFieldMouseArea.showPassword ? "../../images/eyeClosed.svg" : "../../images/eyeOpen.svg"
MouseArea {
id: passwordFieldMouseArea
anchors.fill: parent
acceptedButtons: Qt.LeftButton
property bool showPassword: false
onClicked: {
showPassword = !showPassword;
}
}
}
}
Keys.onReturnPressed: {
signInBody.login()
}
}
HifiControlsUit.CheckBox {
id: autoLogoutCheckbox
checked: !Settings.getValue("wallet/autoLogout", true)
text: "Keep Me Logged In"
boxSize: 18;
labelFontSize: 18;
color: hifi.colors.white;
anchors {
top: passwordField.bottom
topMargin: hifi.dimensions.contentSpacing.y
right: passwordField.right
}
onCheckedChanged: {
Settings.setValue("wallet/autoLogout", !checked);
if (checked) {
Settings.setValue("wallet/savedUsername", Account.username);
} else {
Settings.setValue("wallet/savedUsername", "");
}
}
Component.onDestruction: {
Settings.setValue("wallet/autoLogout", !checked);
}
}
Item {
id: cancelContainer
width: cancelText.width
height: d.minHeightButton
anchors {
top: autoLogoutCheckbox.bottom
topMargin: hifi.dimensions.contentSpacing.y
left: parent.left
leftMargin: (parent.width - passwordField.width) / 2
}
Text {
id: cancelText
anchors.centerIn: parent
text: qsTr("Cancel");
lineHeight: 1
color: "white"
font.family: "Raleway"
font.pixelSize: 24
font.bold: true
lineHeightMode: Text.ProportionalHeight
// horizontalAlignment: Text.AlignHCenter
}
MouseArea {
id: cancelArea
anchors.fill: parent
acceptedButtons: Qt.LeftButton
onClicked: {
toggleSignIn(false, true);
}
}
}
HifiControlsUit.Button {
id: loginButtonAtSignIn
width: d.minWidthButton
height: d.minHeightButton
text: qsTr("Log In")
fontSize: signUpButton.fontSize
color: hifi.buttons.none
// background: Rectangle {
// radius: hifi.buttons.radius
//
// }
anchors {
top: cancelContainer.top
right: passwordField.right
}
onClicked: {
linkAccountBody.login()
}
}
Item {
id: cantAccessContainer
width: parent.width
height: cantAccessText.height
anchors {
top: cancelContainer.bottom
topMargin: 3.5 * hifi.dimensions.contentSpacing.y
}
visible: false
HifiStylesUit.ShortcutText {
id: cantAccessText
z: 10
text: "<a href='https://highfidelity.com/users/password/new'> Can't access your account?</a>"
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
linkColor: hifi.colors.blueAccent
onLinkActivated: loginDialog.openUrl(link)
}
}
} }
Item {
id: splashContainer
width: parent.width
anchors.fill: parent
HifiControlsUit.Button { visible: true
id: signUpButton
text: qsTr("Sign Up") Text {
width: 0.17 * parent.width id: flavorText
height: 0.068 * parent.height text: qsTr("BE ANYWHERE, WITH ANYONE RIGHT NOW")
color: hifi.buttons.blue width: 0.48 * parent.width
fontSize: 30 anchors.centerIn: parent
anchors { anchors {
top: flavorText.bottom top: bannerContainer.bottom
topMargin: 0.1 * parent.height topMargin: 0.1 * parent.height
left: parent.left }
leftMargin: (parent.width - signUpButton.width) / 2 wrapMode: Text.WordWrap
lineHeight: 1
color: "white"
font.family: "Raleway"
font.pixelSize: 48
font.bold: true
lineHeightMode: Text.ProportionalHeight
horizontalAlignment: Text.AlignHCenter
} }
onClicked: { HifiControlsUit.Button {
bodyLoader.setSource("SignUpBody.qml") id: signUpButton
if (!linkAccountBody.isTablet) { text: qsTr("Sign Up")
bodyLoader.item.width = root.pane.width width: d.minWidthButton
bodyLoader.item.height = root.pane.height height: d.minHeightButton
color: hifi.buttons.blue
fontSize: 30
anchors {
bottom: parent.bottom
bottomMargin: 0.1 * parent.height
left: parent.left
leftMargin: (parent.width - signUpButton.width) / 2
}
onClicked: {
toggleSignIn(true, false);
} }
} }
} }
@ -134,58 +389,57 @@ Item {
anchors.top: topContainer.bottom anchors.top: topContainer.bottom
Rectangle { Rectangle {
height: root.pane.height id: bottomOpaqueRect
width: root.pane.width height: parent.height
width: parent.width
opacity: 0.7 opacity: 0.7
color: "black" color: "black"
} }
Item {
id: bottomButtonsContainer
HifiControlsUit.Button { width: parent.width
id: loginButton height: parent.height
width: signUpButton.width
height: signUpButton.height
text: qsTr("Log In")
fontSize: signUpButton.fontSize
// background: Rectangle {
// radius: hifi.buttons.radius
//
// }
anchors {
top: parent.top
topMargin: 0.245 * parent.height
left: parent.left
leftMargin: (parent.width - loginButton.width) / 2
}
onClicked: { HifiControlsUit.Button {
bodyLoader.setSource("SignInBody.qml") id: loginButton
if (!linkAccountBody.isTablet) { width: signUpButton.width
loginDialog.bodyLoader.item.width = root.pane.width height: signUpButton.height
loginDialog.bodyLoader.item.height = root.pane.height text: qsTr("Log In")
fontSize: signUpButton.fontSize
// background: Rectangle {
// radius: hifi.buttons.radius
//
// }
anchors {
top: parent.top
topMargin: 0.245 * parent.height
left: parent.left
leftMargin: (parent.width - loginButton.width) / 2
}
onClicked: {
toggleSignIn(true, true);
} }
} }
} HifiControlsUit.Button {
HifiControlsUit.Button { id: steamLoginButton
id: steamLoginButton width: signUpButton.width
width: signUpButton.width height: signUpButton.height
height: signUpButton.height text: qsTr("Steam Log In")
text: qsTr("Link Account") fontSize: signUpButton.fontSize
fontSize: signUpButton.fontSize color: hifi.buttons.black
color: hifi.buttons.black anchors {
anchors { top: loginButton.bottom
top: loginButton.bottom topMargin: 0.04 * parent.height
topMargin: 0.04 * parent.height left: parent.left
left: parent.left leftMargin: (parent.width - steamLoginButton.width) / 2
leftMargin: (parent.width - steamLoginButton.width) / 2
}
onClicked: {
if (loginDialog.isSteamRunning()) {
loginDialog.linkSteam();
} }
if (!linkAccountBody.isTablet) {
bodyLoader.item.width = root.pane.width onClicked: {
bodyLoader.item.height = root.pane.height if (loginDialog.isSteamRunning()) {
loginDialog.linkSteam();
}
} }
} }
} }
@ -205,7 +459,7 @@ Item {
lineHeight: 1 lineHeight: 1
color: "white" color: "white"
font.family: "Raleway" font.family: "Raleway"
font.pixelSize: 20 font.pixelSize: 24
font.bold: true font.bold: true
lineHeightMode: Text.ProportionalHeight lineHeightMode: Text.ProportionalHeight
// horizontalAlignment: Text.AlignHCenter // horizontalAlignment: Text.AlignHCenter
@ -222,9 +476,6 @@ Item {
} }
Component.onCompleted: { Component.onCompleted: {
root.title = qsTr("Sign Into High Fidelity")
root.iconText = "<"
//dont rise local keyboard //dont rise local keyboard
keyboardEnabled = !root.isTablet && HMD.active; keyboardEnabled = !root.isTablet && HMD.active;
//but rise Tablet's one instead for Tablet interface //but rise Tablet's one instead for Tablet interface
@ -234,12 +485,6 @@ Item {
} }
d.resize(); d.resize();
// if (failAfterSignUp) {
// mainTextContainer.text = "Account created successfully."
// flavorText.visible = true
// mainTextContainer.visible = true
// }
} }
Connections { Connections {
@ -293,7 +538,7 @@ Item {
Keys.onPressed: { Keys.onPressed: {
if (!visible) { if (!visible) {
return return;
} }
switch (event.key) { switch (event.key) {