tablet implementationWIP

This commit is contained in:
Wayne Chen 2018-10-24 10:47:32 -07:00
parent 331b09c8d1
commit fad147656b
7 changed files with 120 additions and 505 deletions

View file

@ -11,8 +11,8 @@
import Hifi 1.0
import QtQuick 2.4
import "qrc:///qml//controls-uit" as HifiControlsUit
import "qrc:///qml//styles-uit" as HifiStylesUit
import "qrc:////qml//controls-uit" as HifiControlsUit
import "qrc:////qml//styles-uit" as HifiStylesUit
import "windows" as Windows
import "LoginDialog"

View file

@ -1,8 +1,8 @@
//
// CompleteProfileBody.qml
//
// Created by Clement on 7/18/16
// Copyright 2015 High Fidelity, Inc.
// Created by Wayne Chen on 10/18/18
// Copyright 2018 High Fidelity, Inc.
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
@ -12,8 +12,8 @@ import Hifi 1.0
import QtQuick 2.4
import QtQuick.Controls.Styles 1.4 as OriginalStyles
import "qrc:///qml//controls-uit" as HifiControlsUit
import "qrc:///qml//styles-uit" as HifiStylesUit
import "qrc:////qml//controls-uit" as HifiControlsUit
import "qrc:////qml//styles-uit" as HifiStylesUit
Item {
id: completeProfileBody
@ -146,47 +146,84 @@ Item {
visible: false;
}
Row {
id: buttons
// Row {
// id: buttons
// anchors {
// top: parent.top
// topMargin: (parent.height - additionalTextContainer.height) / 2 - hifi.dimensions.contentSpacing.y
// horizontalCenter: parent.horizontalCenter
// margins: 0
// }
// spacing: hifi.dimensions.contentSpacing.x
// onHeightChanged: d.resize(); onWidthChanged: d.resize();
//
//
// HifiControlsUit.Button {
// id: cancelButton
// anchors.verticalCenter: parent.verticalCenter
// text: qsTr("Cancel")
// fontFamily: completeProfileBody.fontFamily
// fontSize: completeProfileBody.fontSize
// fontBold: completeProfileBody.fontBold
// onClicked: {
// bodyLoader.setSource("LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
// }
// }
// }
Item {
id: cancelContainer
width: cancelText.width
height: d.minHeightButton
anchors {
top: parent.top
topMargin: hifi.dimensions.contentSpacing.y
topMargin: (parent.height - additionalTextContainer.height) / 2 - hifi.dimensions.contentSpacing.y
horizontalCenter: parent.horizontalCenter
margins: 0
left: parent.left
leftMargin: (parent.width - banner.width) / 2
}
spacing: hifi.dimensions.contentSpacing.x
onHeightChanged: d.resize(); onWidthChanged: d.resize();
Text {
id: cancelText
anchors.centerIn: parent
text: qsTr("Cancel");
HifiControlsUit.Button {
id: profileButton
anchors.verticalCenter: parent.verticalCenter
width: 256
text: qsTr("Create your profile")
color: hifi.buttons.blue
fontFamily: completeProfileBody.fontFamily
fontSize: completeProfileBody.fontSize
fontBold: completeProfileBody.fontBold
onClicked: {
loginErrorMessage.visible = false;
loginDialog.createAccountFromStream()
}
lineHeight: 1
color: "white"
font.family: completeProfileBody.fontFamily
font.pixelSize: completeProfileBody.fontSize
font.capitalization: Font.AllUppercase;
font.bold: completeProfileBody.fontBold
lineHeightMode: Text.ProportionalHeight
}
HifiControlsUit.Button {
id: cancelButton
anchors.verticalCenter: parent.verticalCenter
text: qsTr("Cancel")
fontFamily: completeProfileBody.fontFamily
fontSize: completeProfileBody.fontSize
fontBold: completeProfileBody.fontBold
MouseArea {
id: cancelArea
anchors.fill: parent
acceptedButtons: Qt.LeftButton
onClicked: {
loginDialog.atSignIn = false;
bodyLoader.setSource("LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
}
}
}
HifiControlsUit.Button {
id: profileButton
anchors.verticalCenter: parent.verticalCenter
width: 256
text: qsTr("Create your profile")
color: hifi.buttons.blue
fontFamily: completeProfileBody.fontFamily
fontSize: completeProfileBody.fontSize
fontBold: completeProfileBody.fontBold
onClicked: {
loginErrorMessage.visible = false;
loginDialog.createAccountFromStream()
}
}
HifiStylesUit.ShortcutText {
id: additionalTextContainer
anchors {

View file

@ -13,8 +13,8 @@ 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
import "qrc:////qml//controls-uit" as HifiControlsUit
import "qrc:////qml//styles-uit" as HifiStylesUit
import TabletScriptingInterface 1.0
@ -60,84 +60,8 @@ 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() {
linkAccountBody.toggleLoading();
if (linkAccountBody.isLogIn) {
loginDialog.login(emailField.text, passwordField.text);
} else {
loginDialog.signup(usernameField.text, emailField.text, passwordField.text);
}
}
function resetContainers() {
splashContainer.visible = false;
loggingInContainer.visible = false;
loginContainer.visible = false;
}
function toggleLoading() {
// For the process of logging in.
linkAccountBody.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 : linkAccountBody.isLogIn ? "bad user/pass combo." : "unknown error.";
loginErrorMessage.anchors.bottom = linkAccountBody.isLogIn ? emailField.top : usernameField.top;
failureTimer.start();
return;
}
if (loginDialog.isSteamRunning()) {
// reset the flag.
linkAccountBody.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();
}
function toggleSignIn(signIn, isLogIn) {
function toggleSignIn(isLogIn) {
// going to/from sign in/up dialog.
loginDialog.atSignIn = signIn;
loginDialog.isLogIn = isLogIn;
bodyLoader.setSource("SignInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
@ -193,7 +117,7 @@ Item {
lineHeight: 0.5
color: "white"
font.family: linkAccountBody.fontFamily
font.pixelSize: 2 * linkAccountBody.fontSize
font.pixelSize: !root.isTablet ? 2 * linkAccountBody.fontSize : linkAccountBody.fontSize
font.bold: linkAccountBody.fontBold
lineHeightMode: Text.ProportionalHeight
horizontalAlignment: Text.AlignHCenter
@ -215,7 +139,7 @@ Item {
leftMargin: (parent.width - d.minWidthButton) / 2
}
onClicked: {
toggleSignIn(true, false);
toggleSignIn(false);
}
}
}
@ -256,7 +180,7 @@ Item {
}
onClicked: {
toggleSignIn(true, true);
toggleSignIn(true);
}
}
HifiControlsUit.Button {
@ -312,7 +236,6 @@ Item {
onClicked: {
var poppedUp = Settings.getValue("loginDialogPoppedUp", false);
if (poppedUp) {
console.log("[ENCOURAGELOGINDIALOG]: user dismissed login screen")
var data = {
"action": "user dismissed login screen"
@ -335,66 +258,4 @@ Item {
}
d.resize();
}
Connections {
target: loginDialog
onHandleCreateFailed: {
console.log("Create Failed")
}
onHandleCreateCompleted: {
console.log("Create Completed")
}
onHandleSignupFailed: {
console.log("Sign Up Failed")
loadingSuccess(false, errorString)
}
onHandleSignupCompleted: {
console.log("Sign Up Completed")
loadingSuccess(true)
}
onHandleLoginCompleted: {
console.log("Login Succeeded")
var poppedUp = Settings.getValue("loginDialogPoppedUp", false);
if (poppedUp) {
console.log("[ENCOURAGELOGINDIALOG]: logging in")
var data = {
"action": "user logged in"
};
UserActivityLogger.logAction("encourageLoginDialog", data);
Settings.setValue("loginDialogPoppedUp", false);
}
if (loginDialog.isSteamRunning()) {
loginDialog.linkSteam();
}
loadingSuccess(true)
}
onHandleLoginFailed: {
console.log("Login Failed")
var poppedUp = Settings.getValue("loginDialogPoppedUp", false);
if (poppedUp) {
console.log("[ENCOURAGELOGINDIALOG]: failed logging in")
var data = {
"action": "user failed logging in"
};
UserActivityLogger.logAction("encourageLoginDialog", data);
Settings.setValue("loginDialogPoppedUp", false);
}
loadingSuccess(false)
}
onHandleLinkCompleted: {
console.log("Link Succeeded")
loadingSuccess(true)
}
onHandleLinkFailed: {
console.log("Link Failed")
var error = "There was an unknown error while creating your account. Please try again later.";
loadingSuccess(false, error);
}
}
Keys.onPressed: {
if (!visible) {
return;
}
}
}

View file

@ -13,8 +13,8 @@ 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
import "qrc:////qml//controls-uit" as HifiControlsUit
import "qrc:////qml//styles-uit" as HifiStylesUit
import TabletScriptingInterface 1.0
@ -138,36 +138,34 @@ Item {
successTimer.start();
}
function toggleSignIn(signIn, isLogIn) {
function toggleSignIn(isLogIn) {
// going to/from sign in/up dialog.
loginDialog.atSignIn = signIn;
loginDialog.isLogIn = isLogIn;
if (signIn) {
usernameField.visible = !isLogIn;
cantAccessContainer.visible = isLogIn;
if (isLogIn) {
loginButtonAtSignIn.text = "Log In";
loginButtonAtSignIn.color = hifi.buttons.black;
emailField.placeholderText = "Username or Email";
var savedUsername = Settings.getValue("wallet/savedUsername", "");
emailField.text = savedUsername === "Unknown user" ? "" : savedUsername;
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;
emailField.placeholderText = "Email";
emailField.text = "";
emailField.anchors.top = usernameField.bottom;
emailField.anchors.topMargin = 1.5 * hifi.dimensions.contentSpacing.y;
passwordField.text = "";
}
loginErrorMessage.visible = false;
usernameField.visible = !isLogIn;
cantAccessContainer.visible = isLogIn;
if (isLogIn) {
loginButtonAtSignIn.text = "Log In";
loginButtonAtSignIn.color = hifi.buttons.black;
emailField.placeholderText = "Username or Email";
var savedUsername = Settings.getValue("wallet/savedUsername", "");
emailField.text = savedUsername === "Unknown user" ? "" : savedUsername;
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;
emailField.placeholderText = "Email";
emailField.text = "";
emailField.anchors.top = usernameField.bottom;
emailField.anchors.topMargin = 1.5 * hifi.dimensions.contentSpacing.y;
passwordField.text = "";
}
loginErrorMessage.visible = false;
}
loginContainer.visible = signIn;
@ -514,7 +512,6 @@ Item {
onLinkActivated: loginDialog.openUrl(link)
}
}
}
}
@ -527,8 +524,7 @@ Item {
root.keyboardRaised = Qt.binding( function() { return keyboardRaised; })
}
d.resize();
print(loginDialog.atSignIn, loginDialog.isLogIn)
toggleSignIn(loginDialog.atSignIn, loginDialog.isLogIn)
toggleSignIn(loginDialog.isLogIn)
}
Connections {
@ -595,7 +591,7 @@ Item {
}
Keys.onPressed: {
if (!visible && !loginDialog.atSignIn) {
if (!visible) {
return;
}

View file

@ -1,280 +0,0 @@
//
// SignUpBody.qml
//
// Created by Stephen Birarda on 7 Dec 2016
// Copyright 2016 High Fidelity, Inc.
//
// 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 "../controls-uit"
import "../styles-uit"
Item {
id: signupBody
clip: true
height: root.pane.height
width: root.pane.width
function signup() {
mainTextContainer.visible = false
toggleLoading(true)
loginDialog.signup(emailField.text, usernameField.text, passwordField.text)
}
property bool keyboardEnabled: false
property bool keyboardRaised: false
property bool punctuationMode: false
onKeyboardRaisedChanged: d.resize();
QtObject {
id: d
readonly property int minWidth: 480
readonly property int maxWidth: 1280
readonly property int minHeight: 120
readonly property int maxHeight: 720
function resize() {
var targetWidth = Math.max(titleWidth, form.contentWidth);
var targetHeight = hifi.dimensions.contentSpacing.y + mainTextContainer.height +
4 * hifi.dimensions.contentSpacing.y + form.height;
parent.width = root.width = Math.max(d.minWidth, Math.min(d.maxWidth, targetWidth));
parent.height = root.height = Math.max(d.minHeight, Math.min(d.maxHeight, targetHeight))
+ (keyboardEnabled && keyboardRaised ? (200 + 2 * hifi.dimensions.contentSpacing.y) : 0);
}
}
function toggleLoading(isLoading) {
linkAccountSpinner.visible = isLoading
form.visible = !isLoading
leftButton.visible = !isLoading
buttons.visible = !isLoading
}
BusyIndicator {
id: linkAccountSpinner
anchors {
top: parent.top
horizontalCenter: parent.horizontalCenter
topMargin: hifi.dimensions.contentSpacing.y
}
visible: false
running: true
width: 48
height: 48
}
ShortcutText {
id: mainTextContainer
anchors {
top: parent.top
left: parent.left
margins: 0
topMargin: hifi.dimensions.contentSpacing.y
}
visible: false
text: qsTr("There was an unknown error while creating your account.")
wrapMode: Text.WordWrap
color: hifi.colors.redAccent
horizontalAlignment: Text.AlignLeft
}
Column {
id: form
width: parent.width
onHeightChanged: d.resize(); onWidthChanged: d.resize();
anchors {
top: mainTextContainer.bottom
topMargin: 2 * hifi.dimensions.contentSpacing.y
}
spacing: 2 * hifi.dimensions.contentSpacing.y
TextField {
id: emailField
width: parent.width
label: "Email"
activeFocusOnPress: true
onFocusChanged: {
root.text = "";
}
}
TextField {
id: usernameField
width: parent.width
label: "Username"
activeFocusOnPress: true
ShortcutText {
anchors {
verticalCenter: parent.textFieldLabel.verticalCenter
left: parent.textFieldLabel.right
leftMargin: 10
}
text: qsTr("No spaces / special chars.")
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
color: hifi.colors.blueAccent
onFocusChanged: {
root.text = "";
}
}
}
TextField {
id: passwordField
width: parent.width
label: "Password"
echoMode: TextInput.Password
activeFocusOnPress: true
ShortcutText {
anchors {
verticalCenter: parent.textFieldLabel.verticalCenter
left: parent.textFieldLabel.right
leftMargin: 10
}
text: qsTr("At least 6 characters")
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
color: hifi.colors.blueAccent
}
onFocusChanged: {
root.text = "";
root.isPassword = focus
}
Keys.onReturnPressed: signupBody.signup()
}
Row {
id: leftButton
anchors.horizontalCenter: parent.horizontalCenter
spacing: hifi.dimensions.contentSpacing.x
onHeightChanged: d.resize(); onWidthChanged: d.resize();
Button {
anchors.verticalCenter: parent.verticalCenter
text: qsTr("Existing User")
onClicked: {
bodyLoader.setSource("LinkAccountBody.qml")
if (!root.isTablet) {
bodyLoader.item.width = root.pane.width
bodyLoader.item.height = root.pane.height
}
}
}
}
Row {
id: buttons
anchors.horizontalCenter: parent.horizontalCenter
spacing: hifi.dimensions.contentSpacing.x
onHeightChanged: d.resize(); onWidthChanged: d.resize();
Button {
id: linkAccountButton
anchors.verticalCenter: parent.verticalCenter
width: 200
text: qsTr("Sign Up")
color: hifi.buttons.blue
onClicked: signupBody.signup()
}
Button {
anchors.verticalCenter: parent.verticalCenter
text: qsTr("Cancel")
onClicked: root.tryDestroy()
}
}
}
Component.onCompleted: {
root.title = qsTr("Create an Account")
root.iconText = "<"
//dont rise local keyboard
keyboardEnabled = !root.isTablet && HMD.active;
//but rise Tablet's one instead for Tablet interface
if (root.isTablet) {
root.keyboardEnabled = HMD.active;
root.keyboardRaised = Qt.binding( function() { return keyboardRaised; })
}
d.resize();
emailField.forceActiveFocus();
}
Connections {
target: loginDialog
onHandleSignupCompleted: {
console.log("Sign Up Succeeded");
// now that we have an account, login with that username and password
loginDialog.login(usernameField.text, passwordField.text)
}
onHandleSignupFailed: {
console.log("Sign Up Failed")
toggleLoading(false)
mainTextContainer.text = errorString
mainTextContainer.visible = true
d.resize();
}
onHandleLoginCompleted: {
bodyLoader.setSource("WelcomeBody.qml", { "welcomeBack": false })
bodyLoader.item.width = root.pane.width
bodyLoader.item.height = root.pane.height
}
onHandleLoginFailed: {
// we failed to login, show the LoginDialog so the user will try again
bodyLoader.setSource("LinkAccountBody.qml", { "failAfterSignUp": true })
if (!root.isTablet) {
bodyLoader.item.width = root.pane.width
bodyLoader.item.height = root.pane.height
}
}
}
Keys.onPressed: {
if (!visible) {
return
}
switch (event.key) {
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true
signupBody.signup()
break
}
}
}

View file

@ -1,8 +1,8 @@
//
// UsernameCollisionBody.qml
//
// Created by Clement on 7/18/16
// Copyright 2015 High Fidelity, Inc.
// Created by Wayne Chen on 10/18/18
// Copyright 2018 High Fidelity, Inc.
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
@ -12,8 +12,8 @@ import Hifi 1.0
import QtQuick 2.4
import QtQuick.Controls 1.4
import "qrc:///qml//controls-uit" as HifiControlsUit
import "qrc:///qml//styles-uit" as HifiStylesUit
import "qrc:////qml//controls-uit" as HifiControlsUit
import "qrc:////qml//styles-uit" as HifiStylesUit
Item {
id: usernameCollisionBody

View file

@ -11,13 +11,13 @@
import Hifi 1.0
import QtQuick 2.5
import "../controls-uit"
import "../styles-uit"
import "../windows"
import "qrc:////qml//controls-uit" as HifiControlsUit
import "qrc:////qml//styles-uit" as HifiStylesUit
import "../windows" as Windows
import "../LoginDialog"
TabletModalWindow {
Windows.TabletModalWindow {
id: realRoot
objectName: "LoginDialog"
@ -81,7 +81,7 @@ TabletModalWindow {
property alias loginDialog: loginDialog
property alias hifi: hifi
HifiConstants { id: hifi }
HifiStylesUit.HifiConstants { id: hifi }
onCanceled: {
if (bodyLoader.active === true) {
@ -95,9 +95,10 @@ TabletModalWindow {
}
}
TabletModalFrame {
Item {
id: mfRoot
readonly property int frameMarginTop: hifi.dimensions.modalDialogMargin.y
width: root.width
height: root.height + frameMarginTop + hifi.dimensions.contentMargin.x
@ -126,7 +127,7 @@ TabletModalWindow {
}
}
Keyboard {
HifiControlsUit.Keyboard {
id: loginKeyboard
raised: root.keyboardEnabled && root.keyboardRaised
numeric: root.punctuationMode
@ -173,6 +174,6 @@ TabletModalWindow {
}
}
Component.onCompleted: {
bodyLoader.setSource("../LoginDialog/LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root });
bodyLoader.setSource("../LoginDialog/LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
}
}