Mirrors/overte-AleziaKurdis
3
0
Fork 0
mirror of https://github.com/AleziaKurdis/overte.git synced 2025-04-07 12:12:39 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

adding oculus to login dialog/adding focus wip

Browse source
This commit is contained in:
Wayne Chen 2018-11-26 15:10:04 -08:00
parent 68834cb29f
commit c53febceac
17 changed files with 826 additions and 941 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
interface/resources/fonts/hifi-glyphs-1.33/fonts/hifi-glyphs.woff
View file

Binary file not shown.

BIN
interface/resources/fonts/hifi-glyphs-1.33/fonts/hifi-glyphs.eot → interface/resources/fonts/hifi-glyphs-1.34/fonts/hifi-glyphs.eot
View file

Binary file not shown.

1
interface/resources/fonts/hifi-glyphs-1.33/fonts/hifi-glyphs.svg → interface/resources/fonts/hifi-glyphs-1.34/fonts/hifi-glyphs.svg
View file

@ -155,4 +155,5 @@
<glyph glyph-name="forward" unicode="&#68;" d="M330 278l-95 70c-5 4-12 5-18 2-5-3-9-9-9-16l0-150c0-7 4-13 10-16 2-1 5-2 7-2 4 0 8 2 11 5l95 79c4 4 6 9 6 14-1 5-3 10-7 14"/>
<glyph glyph-name="avatar-1" unicode="&#84;" d="M396 344l-2 2c-4 4-9 5-15 5-1 0-88-13-124-14-1 0-2 0-3 0-37 0-126 15-127 15-7 1-14-2-18-8l-2-4c-3-4-3-9-2-14 2-5 5-9 10-11 16-7 69-22 85-29 3-1 10-4 10-14 1-11-4-67-10-93-7-26-18-60-19-60-3-9 2-19 11-22l11-4c4-2 9-1 13 1 5 2 8 6 9 10l31 94 28-96c2-5 5-9 9-11 3-1 5-2 8-2 2 0 4 0 7 1l10 4c8 3 12 12 10 20 0 1-8 36-16 65-4 17-6 43-7 64-1 13-1 21-3 30 0 1 2 11 10 14 10 4 81 29 80 28 6 2 10 7 11 13 1 6-1 12-5 16z m-98 54c0-24-19-43-43-43-24 0-43 19-43 43 0 23 19 42 43 42 24 0 43-19 43-42z"/>
<glyph glyph-name="steam-square" unicode="&#57397;" d="M391 327c0 15-5 28-16 39-11 11-24 16-39 16-15 0-28-5-39-16-11-11-16-24-16-39 0-15 5-28 16-39 11-11 24-16 39-16 15 0 28 5 39 16 11 11 16 24 16 39z m-174-168c0-16-5-29-16-40-11-11-25-16-40-16-11 0-21 2-30 8-9 5-16 13-20 22 9-4 19-8 28-12 11-4 22-4 34 1 11 5 19 13 24 25 5 11 5 22 0 34-5 11-13 19-25 24l-23 9c4 1 8 2 12 2 15 0 29-6 40-17 11-11 16-24 16-40z m258 234l0-274c0-23-8-42-24-58-16-16-35-24-58-24l-274 0c-23 0-42 8-58 24-16 16-24 35-24 58l0 44 49-20c4-18 12-32 26-44 14-11 30-17 49-17 19 0 37 7 51 20 15 14 23 30 25 50l99 72c28 0 53 10 73 30 20 20 30 44 30 73 0 28-10 52-30 73-20 20-45 30-73 30-28 0-53-10-73-30-20-20-30-44-30-72l-64-92c-2 0-5 0-8 0-15 0-28-4-40-11l-84 34 0 134c0 23 8 42 24 58 16 16 35 24 58 24l274 0c23 0 42-8 58-24 16-16 24-35 24-58z m-70-66c0-19-7-36-20-49-14-14-30-20-49-20-19 0-36 6-49 20-13 13-20 30-20 49 0 19 7 35 20 48 13 14 30 21 49 21 19 0 35-7 49-20 13-14 20-30 20-49z"/>
<glyph glyph-name="oculus" unicode="&#57398;" d="M431 363c-16 13-34 22-54 26-11 3-23 4-34 5-9 0-18 0-26 0-41 0-82 0-123 0-9 0-18 0-26 0-12-1-24-2-35-5-20-4-38-13-54-26-32-26-51-65-51-106 0-41 19-80 51-106 16-13 34-22 54-27 12-2 23-3 35-4 8 0 17 0 26 0 41 0 82 0 123 0 8 0 17 0 26 0 11 0 23 2 34 4 20 5 38 14 54 27 32 26 51 65 51 106 0 41-19 80-51 106z m-60-143c-6-4-13-7-20-8-7-1-14-1-22-1-49 0-99 0-148 0-8 0-15 0-22 1-7 1-14 4-20 8-12 8-19 22-19 37 0 15 7 29 19 37 6 4 13 7 20 8 7 1 14 1 22 1 49 0 99 0 148 0 8 0 15 0 22-1 7-1 14-4 20-8 12-8 19-22 19-37 0-15-7-29-19-37z"/>
</font></defs></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 84 KiB

After

Width:  |  Height:  |  Size: 84 KiB

BIN
interface/resources/fonts/hifi-glyphs-1.33/fonts/hifi-glyphs.ttf → interface/resources/fonts/hifi-glyphs-1.34/fonts/hifi-glyphs.ttf
View file

Binary file not shown.

BIN
interface/resources/fonts/hifi-glyphs-1.34/fonts/hifi-glyphs.woff Normal file
View file

Binary file not shown.

8
interface/resources/fonts/hifi-glyphs-1.33/icons-reference.html → interface/resources/fonts/hifi-glyphs-1.34/icons-reference.html
View file

@ -607,6 +607,10 @@
<div class="icon icon-steam-square"></div>
<input type="text" readonly="readonly" value="steam-square">
</li>
<li>
<div class="icon icon-oculus"></div>
<input type="text" readonly="readonly" value="oculus">
</li>
</ul>
<h2>Character mapping</h2>
<ul class="glyphs character-mapping">
@ -1202,6 +1206,10 @@
<div data-icon="&#xe035;" class="icon"></div>
<input type="text" readonly="readonly" value="&amp;#xe035;">
</li>
<li>
<div data-icon="&#xe036;" class="icon"></div>
<input type="text" readonly="readonly" value="&amp;#xe036;">
</li>
</ul>
</div>
<script>(function() {

3
interface/resources/fonts/hifi-glyphs-1.33/styles.css → interface/resources/fonts/hifi-glyphs-1.34/styles.css
View file

@ -482,3 +482,6 @@
.icon-steam-square:before {
content: "\e035";
}
.icon-oculus:before {
content: "\e036";
}

BIN
interface/resources/fonts/hifi-glyphs.ttf
View file

Binary file not shown.

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

@ -22,8 +22,8 @@ Item {
width: root.width
height: root.height
readonly property string termsContainerText: qsTr("By creating this user profile, you agree to High Fidelity's Terms of Service")
readonly property string fontFamily: "Cairo"
readonly property int fontSize: 24
readonly property string fontFamily: "Raleway"
readonly property int fontSize: 15
readonly property bool fontBold: true
QtObject {

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

@ -1,5 +1,5 @@
//
// LinkAccountBody.qml
// linkAccountBody.qml
//
// Created by Wayne Chen on 10/18/18
// Copyright 2018 High Fidelity, Inc.
@ -22,12 +22,20 @@ Item {
clip: true
height: root.height
width: root.width
property bool failAfterSignUp: false
property string fontFamily: "Cairo"
property int fontSize: 24
property int textFieldHeight: 31
property string fontFamily: "Raleway"
property int fontSize: 15
property bool fontBold: true
property bool keyboardEnabled: false
property bool keyboardRaised: false
property bool punctuationMode: false
onKeyboardRaisedChanged: d.resize();
property bool withSteam: false
property bool withOculus: false
property string errorString: errorString
QtObject {
id: d
@ -41,8 +49,8 @@ Item {
function resize() {
maxWidth = root.isTablet ? 1280 : root.width;
maxHeight = root.isTablet ? 720 : root.height;
var targetWidth = Math.max(titleWidth, topContainer.width);
var targetHeight = hifi.dimensions.contentSpacing.y + topContainer.height + bottomContainer.height +
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));
@ -50,233 +58,439 @@ Item {
parent.width = root.width = newWidth;
}
parent.height = root.height = Math.max(d.minHeight, Math.min(d.maxHeight, targetHeight)) + hifi.dimensions.contentSpacing.y;
parent.height = root.height = Math.max(d.minHeight, Math.min(d.maxHeight, targetHeight))
+ (keyboardEnabled && keyboardRaised ? (200 + 2 * hifi.dimensions.contentSpacing.y) : hifi.dimensions.contentSpacing.y);
}
}
function toggleSignIn(isLogIn) {
// going to/from sign in/up dialog.
loginDialog.isLogIn = isLogIn;
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": "" });
}
function login() {
loginDialog.login(emailField.text, passwordField.text);
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "withSteam": false, "withOculus": false, "fromBody": "" });
}
function init() {
// going to/from sign in/up dialog.
loginDialog.isLogIn = true;
loginErrorMessage.visible = (linkAccountBody.errorString !== "");
if (linkAccountBody.errorString !== "") {
loginErrorMessage.text = linkAccountBody.errorString;
errorContainer.anchors.bottom = emailField.top;
errorContainer.anchors.left = emailField.left;
}
loginButton.text = "Log In";
loginButton.color = hifi.buttons.blue;
emailField.placeholderText = "Username or Email";
var savedUsername = Settings.getValue("keepMeLoggedIn/savedUsername", "");
emailField.text = keepMeLoggedInCheckbox.checked ? savedUsername === "Unknown user" ? "" : savedUsername : "";
emailField.anchors.top = loginContainer.top;
emailField.anchors.topMargin = !root.isTablet ? 0.2 * root.height : 0.24 * root.height;
loginContainer.visible = true;
}
Item {
id: mainContainer
anchors.fill: parent
width: root.width
height: root.height
onHeightChanged: d.resize(); onWidthChanged: d.resize();
Rectangle {
id: opaqueRect
height: parent.height
width: parent.width
opacity: 0.9
color: "black"
}
Item {
id: topContainer
width: root.width
height: 0.6 * root.height
id: bannerContainer
width: parent.width
height: banner.height
anchors {
top: parent.top
left: parent.left
right: parent.right
topMargin: 85
}
Image {
id: banner
anchors.centerIn: parent
source: "../../images/high-fidelity-banner.svg"
horizontalAlignment: Image.AlignHCenter
}
}
Item {
id: loginContainer
width: parent.width
height: parent.height - (bannerContainer.height + 1.5 * hifi.dimensions.contentSpacing.y)
anchors {
top: bannerContainer.bottom
topMargin: 1.5 * hifi.dimensions.contentSpacing.y
}
Rectangle {
id: topOpaqueRect
height: parent.height
width: parent.width
opacity: 0.9
color: "black"
visible: false
}
Item {
id: bannerContainer
width: parent.width
height: banner.height
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: linkAccountBody.fontFamily
font.pixelSize: 12
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
text: ""
visible: false
}
}
HifiControlsUit.TextField {
id: emailField
width: banner.width
height: linkAccountBody.textFieldHeight
font.family: linkAccountBody.fontFamily
anchors {
top: parent.top
topMargin: 85
left: parent.left
leftMargin: (parent.width - emailField.width) / 2
}
Image {
id: banner
anchors.centerIn: parent
source: "../../images/high-fidelity-banner.svg"
horizontalAlignment: Image.AlignHCenter
placeholderText: "Username or Email"
activeFocusOnPress: true
Keys.onPressed: {
switch (event.key) {
case Qt.Key_Tab:
event.accepted = true;
passwordField.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 = "";
root.isPassword = !focus;
}
}
Text {
id: flavorText
text: qsTr("BE ANYWHERE, WITH ANYONE RIGHT NOW")
width: 0.48 * parent.width
anchors.centerIn: parent
anchors {
top: bannerContainer.bottom
topMargin: 0.1 * parent.height
}
wrapMode: Text.WordWrap
lineHeight: 0.5
color: "white"
HifiControlsUit.TextField {
id: passwordField
width: banner.width
height: linkAccountBody.textFieldHeight
font.family: linkAccountBody.fontFamily
font.pixelSize: !root.isTablet ? 2 * linkAccountBody.fontSize : linkAccountBody.fontSize
font.bold: linkAccountBody.fontBold
lineHeightMode: Text.ProportionalHeight
horizontalAlignment: Text.AlignHCenter
}
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 = focus;
}
Item {
id: showPasswordContainer
z: 10
// width + image's rightMargin
width: showPasswordImage.width + 8
height: parent.height
anchors {
right: parent.right
}
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.onPressed: {
switch (event.key) {
case Qt.Key_Tab:
case Qt.Key_Backtab:
event.accepted = true;
emailField.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;
}
}
}
HifiControlsUit.CheckBox {
id: keepMeLoggedInCheckbox
checked: Settings.getValue("keepMeLoggedIn", false);
text: qsTr("Keep Me Logged In");
boxSize: 18;
labelFontFamily: linkAccountBody.fontFamily
labelFontSize: 18;
color: hifi.colors.white;
anchors {
top: passwordField.bottom;
topMargin: hifi.dimensions.contentSpacing.y;
left: passwordField.left;
}
onCheckedChanged: {
Settings.setValue("keepMeLoggedIn", checked);
if (checked) {
Settings.setValue("keepMeLoggedIn/savedUsername", Account.username);
var savedUsername = Settings.getValue("keepMeLoggedIn/savedUsername", "");
emailField.text = savedUsername === "Unknown user" ? "" : savedUsername;
} else {
Settings.setValue("keepMeLoggedIn/savedUsername", "");
}
}
Component.onDestruction: {
Settings.setValue("keepMeLoggedIn", checked);
}
}
HifiControlsUit.Button {
id: signUpButton
text: qsTr("Sign Up")
width: d.minWidthButton
id: loginButton
width: passwordField.width
height: d.minHeightButton
color: hifi.buttons.blue
text: qsTr("Log In")
fontFamily: linkAccountBody.fontFamily
fontSize: linkAccountBody.fontSize
fontBold: linkAccountBody.fontBold
anchors {
bottom: parent.bottom
bottomMargin: 0.1 * parent.height
left: parent.left
leftMargin: (parent.width - d.minWidthButton) / 2
top: keepMeLoggedInCheckbox.bottom
topMargin: hifi.dimensions.contentSpacing.y
left: emailField.left
}
onClicked: {
linkAccountBody.withSteam = false;
toggleSignIn(false);
linkAccountBody.login()
}
}
Item {
id: cantAccessContainer
width: parent.width
height: emailField.height
anchors {
top: loginButton.bottom
topMargin: hifi.dimensions.contentSpacing.y
}
HifiStylesUit.ShortcutText {
id: cantAccessText
z: 10
anchors.centerIn: parent
font.family: linkAccountBody.fontFamily
font.pixelSize: 18
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: {
Tablet.playSound(TabletEnums.ButtonClick);
loginDialog.openUrl(link)
}
}
}
HifiControlsUit.Button {
id: continueButton;
width: emailField.width;
height: d.minHeightButton
color: hifi.buttons.none;
anchors {
top: cantAccessContainer.bottom
topMargin: hifi.dimensions.contentSpacing.y
left: emailField.left
}
text: qsTr("CONTINUE WITH STEAM")
fontFamily: linkAccountBody.fontFamily
fontSize: linkAccountBody.fontSize
fontBold: linkAccountBody.fontBold
buttonGlyph: hifi.glyphs.steamSquare
buttonGlyphRightMargin: 10
onClicked: {
if (loginDialog.isOculusStoreRunning()) {
linkAccountBody.withOculus = true;
loginDialog.loginThroughSteam();
} else if (loginDialog.isSteamRunning()) {
linkAccountBody.withSteam = true;
loginDialog.loginThroughSteam();
}
print("withSteam " + linkAccountBody.withSteam);
print("withOculus " + linkAccountBody.withOculus);
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader,
"withSteam": linkAccountBody.withSteam, "withOculus": linkAccountBody.withOculus, "fromBody": "LinkAccountBody" });
}
Component.onCompleted: {
if (loginDialog.isOculusStoreRunning()) {
continueButton.text = qsTr("CONTINUE WITH OCULUS");
continueButton.buttonGlyph = hifi.glyphs.oculus;
} else if (loginDialog.isSteamRunning()) {
continueButton.text = qsTr("CONTINUE WITH STEAM");
continueButton.buttonGlyph = hifi.glyphs.steamSquare;
} else {
continueButton.visible = false;
}
}
}
Item {
id: signUpContainer
width: emailField.width
height: emailField.height
anchors {
left: emailField.left
top: cantAccessContainer.bottom
topMargin: 7 * hifi.dimensions.contentSpacing.y + d.minHeightButton
}
TextMetrics {
id: signUpTextMetrics
font: signUpText.font
text: signUpText.text
}
Text {
id: signUpText
text: qsTr("Don't have an account?")
anchors {
left: parent.left
}
lineHeight: 1
color: "white"
font.family: linkAccountBody.fontFamily
font.pixelSize: 18
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
}
HifiStylesUit.ShortcutText {
id: signUpShortcutText
z: 10
font.family: linkAccountBody.fontFamily
font.pixelSize: 18
anchors {
left: signUpText.right
leftMargin: hifi.dimensions.contentSpacing.x
}
text: "<a href='https://highfidelity.com'>Sign Up</a>"
linkColor: hifi.colors.blueAccent
onLinkActivated: {
Tablet.playSound(TabletEnums.ButtonClick);
bodyLoader.setSource("SignUpBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader,
"errorString": "" });
}
}
}
}
Item {
id: bottomContainer
width: root.width
height: 0.4 * root.height
id: dismissTextContainer
width: dismissText.width
height: dismissText.height
anchors {
top: topContainer.bottom
left: parent.left
bottom: parent.bottom
right: parent.right
margins: 3 * hifi.dimensions.contentSpacing.y
}
Text {
id: dismissText
text: qsTr("No thanks, take me in-world! >")
Rectangle {
id: bottomOpaqueRect
height: parent.height
width: parent.width
opacity: 0.9
color: "black"
lineHeight: 1
color: "white"
font.family: linkAccountBody.fontFamily
font.pixelSize: 20
font.bold: linkAccountBody.fontBold
lineHeightMode: Text.ProportionalHeight
horizontalAlignment: Text.AlignHCenter
}
Item {
id: bottomButtonsContainer
width: parent.width
height: parent.height
HifiControlsUit.Button {
id: loginButton
width: d.minWidthButton
height: d.minHeightButton
text: qsTr("Log In")
fontFamily: linkAccountBody.fontFamily
fontSize: linkAccountBody.fontSize
fontBold: linkAccountBody.fontBold
anchors {
top: parent.top
topMargin: (parent.height / 2) - loginButton.height
left: parent.left
leftMargin: (parent.width - loginButton.width) / 2
}
onClicked: {
linkAccountBody.withSteam = false;
toggleSignIn(true);
}
MouseArea {
id: dismissMouseArea
anchors.fill: parent
acceptedButtons: Qt.LeftButton
hoverEnabled: true
onEntered: {
Tablet.playSound(TabletEnums.ButtonHover);
}
TextMetrics {
id: steamLoginButtonTextMetrics
font: dismissText.font
text: qsTr("STEAM LOG IN")
}
HifiControlsUit.Button {
id: steamLoginButton;
// 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 {
top: loginButton.bottom
topMargin: hifi.dimensions.contentSpacing.y
left: parent.left
leftMargin: (parent.width - steamLoginButton.width) / 2
}
text: qsTr("Steam Log In")
fontFamily: linkAccountBody.fontFamily
fontSize: linkAccountBody.fontSize
fontBold: linkAccountBody.fontBold
buttonGlyph: hifi.glyphs.steamSquare
buttonGlyphRightMargin: 10
onClicked: {
linkAccountBody.withSteam = true;
toggleSignIn(true);
}
visible: loginDialog.isSteamRunning();
}
}
Item {
id: dismissTextContainer
width: dismissText.width
height: dismissText.height
anchors {
bottom: parent.bottom
right: parent.right
margins: 10
}
visible: !root.isTablet
Text {
id: dismissText
text: qsTr("No thanks, take me in-world! >")
lineHeight: 1
color: "white"
font.family: linkAccountBody.fontFamily
font.pixelSize: linkAccountBody.fontSize
font.bold: linkAccountBody.fontBold
lineHeightMode: Text.ProportionalHeight
horizontalAlignment: Text.AlignHCenter
}
MouseArea {
id: dismissMouseArea
anchors.fill: parent
acceptedButtons: Qt.LeftButton
hoverEnabled: true
onEntered: {
Tablet.playSound(TabletEnums.ButtonHover);
}
onClicked: {
Tablet.playSound(TabletEnums.ButtonClick);
if (loginDialog.getLoginDialogPoppedUp()) {
console.log("[ENCOURAGELOGINDIALOG]: user dismissed login screen")
var data = {
"action": "user dismissed login screen"
};
UserActivityLogger.logAction("encourageLoginDialog", data);
loginDialog.dismissLoginDialog();
}
root.tryDestroy();
onClicked: {
Tablet.playSound(TabletEnums.ButtonClick);
if (loginDialog.getLoginDialogPoppedUp()) {
console.log("[ENCOURAGELOGINDIALOG]: user dismissed login screen")
var data = {
"action": "user dismissed login screen"
};
UserActivityLogger.logAction("encourageLoginDialog", data);
loginDialog.dismissLoginDialog();
}
root.tryDestroy();
}
}
}
}
Component.onCompleted: {
root.keyboardEnabled = false;
root.keyboardRaised = false;
KeyboardScriptingInterface.raised = false;
//but rise Tablet's one instead for Tablet interface
root.keyboardEnabled = HMD.active;
root.keyboardRaised = Qt.binding( function() { return keyboardRaised; })
root.text = "";
d.resize();
init();
emailField.focus = true;
}
Component.onDestruction: {
if (loginDialog.getLoginDialogPoppedUp() && root.isTablet) {
// it popped up and was clicked with the X
console.log("[ENCOURAGELOGINDIALOG]: user closed login screen")
var data = {
"action": "user dismissed login screen"
};
UserActivityLogger.logAction("encourageLoginDialog", data);
loginDialog.dismissLoginDialog();
Keys.onPressed: {
if (!visible) {
return;
}
switch (event.key) {
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true;
Settings.setValue("keepMeLoggedIn/savedUsername", emailField.text);
linkAccountBody.login();
break;
}
}
}

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

@ -21,10 +21,11 @@ Item {
id: loggingInBody
property int textFieldHeight: 31
property int loggingInGlyphRightMargin: 10
property string fontFamily: "Cairo"
property int fontSize: 24
property string fontFamily: "Raleway"
property int fontSize: 15
property bool fontBold: true
property bool withSteam: withSteam
property bool withOculus: withOculus
property string fromBody: fromBody
QtObject {
@ -64,25 +65,21 @@ Item {
}
}
// 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;
print("withSteam " + loggingInBody.withSteam);
print("withOculus " + loggingInBody.withOculus);
if (loggingInBody.withSteam) {
loggingInGlyph.visible = true;
loggingInText.text = "Logging in to Steam";
loggingInText.x = loggingInHeader.width/2 - loggingInTextMetrics.width/2 + loggingInGlyphTextMetrics.width/2;
} else if (loggingInBody.withOculus) {
loggingInGlyph.visible = true;
loggingInGlyph.text = hifi.glyphs.oculus;
loggingInText.text = "Logging in to Oculus";
loggingInText.x = loggingInHeader.width/2 - loggingInTextMetrics.width/2 + loggingInGlyphTextMetrics.width/2;
} else {
loggingInText.text = "Logging in";
loggingInText.anchors.bottom = loggingInHeader.bottom;
@ -92,13 +89,21 @@ Item {
}
function loadingSuccess() {
loggingInSpinner.visible = false;
if (loggingInBody.withSteam && !loginDialog.isLogIn) {
if (loggingInBody.withSteam) {
// 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 if (loggingInBody.withOculus) {
// reset the flag.
loggingInGlyph.visible = false;
loggingInText.text = "You are now logged into Oculus!"
loggingInText.anchors.centerIn = loggingInHeader;
loggingInText.anchors.bottom = loggingInHeader.bottom;
loggedInGlyph.text = hifi.glyphs.oculus;
loggedInGlyph.visible = true;
} else {
loggingInText.text = "You are now logged in!";
}
@ -244,17 +249,6 @@ Item {
Connections {
target: loginDialog
onHandleSignupCompleted: {
console.log("SignUp completed!");
successTimer.start();
}
onHandleSignupFailed: {
console.log("SignUp failed!");
var errorStringEdited = errorString.replace(/[\n\r]+/g, ' ');
bodyLoader.setSource("SignInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": errorStringEdited });
}
onHandleLoginCompleted: {
console.log("Login Succeeded")
loadingSuccess();
@ -264,22 +258,21 @@ Item {
console.log("Login Failed")
loggingInSpinner.visible = false;
var errorString = "";
if (loggingInBody.withSteam && loggingInBody.fromBody === "LinkAccountBody") {
if (loggingInBody.withSteam) {
loggingInGlyph.visible = false;
loggingInText.text = "Your Steam authentication has failed. Please make sure you are logged into Steam and try again."
loggingInText.width = loggingInBody.width;
loggingInText.wrapMode = Text.WordWrap;
loggingInText.anchors.centerIn = loggingInHeader;
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 = "Your Steam authentication has failed. Please make sure you are logged into Steam and try again."
bodyLoader.setSource("LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": errorString });
} else if (loggingInBody.withOculus) {
loggingInGlyph.visible = false;
errorString = "Your Oculus authentication has failed. Please make sure you are logged into Oculus and try again."
bodyLoader.setSource("LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": errorString });
}
else {
errorString = "Username or password is incorrect.";
if (loginDialog.isLogIn && loginDialog.isSteamRunning()) {
if (loginDialog.isLogIn && loggingInBody.withSteam) {
bodyLoader.setSource("CompleteProfileBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
} else {
bodyLoader.setSource("SignInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": errorString });
bodyLoader.setSource("LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "errorString": errorString });
}
}
}

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

@ -1,514 +0,0 @@
//
// SignInBody.qml
//
// 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
//
import Hifi 1.0
import QtQuick 2.7
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4 as OriginalStyles
import controlsUit 1.0 as HifiControlsUit
import stylesUit 1.0 as HifiStylesUit
import TabletScriptingInterface 1.0
Item {
id: signInBody
clip: true
height: root.height
width: root.width
property int textFieldHeight: 31
property string fontFamily: "Cairo"
property int fontSize: 24
property bool fontBold: true
property bool keyboardEnabled: false
property bool keyboardRaised: false
property bool punctuationMode: false
onKeyboardRaisedChanged: d.resize();
property string errorString: errorString
QtObject {
id: d
readonly property int minWidth: 480
readonly property int minWidthButton: !root.isTablet ? 256 : 174
property int maxWidth: root.isTablet ? 1280 : root.width
readonly property int minHeight: 120
readonly property int minHeightButton: !root.isTablet ? 56 : 42
property int maxHeight: root.isTablet ? 720 : root.height
function resize() {
maxWidth = root.isTablet ? 1280 : root.width;
maxHeight = root.isTablet ? 720 : root.height;
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.width = newWidth;
}
parent.height = root.height = Math.max(d.minHeight, Math.min(d.maxHeight, targetHeight))
+ (keyboardEnabled && keyboardRaised ? (200 + 2 * hifi.dimensions.contentSpacing.y) : hifi.dimensions.contentSpacing.y);
}
}
function login() {
if (loginDialog.isLogIn) {
loginDialog.login(emailField.text, passwordField.text);
} else {
loginDialog.signup(emailField.text, usernameField.text, passwordField.text);
return;
}
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "withSteam": false, "fromBody": "" });
}
function init(isLogIn) {
// going to/from sign in/up dialog.
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;
emailField.placeholderText = "Username or Email";
var savedUsername = Settings.getValue("keepMeLoggedIn/savedUsername", "");
emailField.text = keepMeLoggedInCheckbox.checked ? savedUsername === "Unknown user" ? "" : savedUsername : "";
emailField.anchors.top = loginContainer.top;
emailField.anchors.topMargin = !root.isTablet ? 0.2 * root.height : 0.24 * root.height;
cantAccessContainer.anchors.topMargin = !root.isTablet ? 3.5 * hifi.dimensions.contentSpacing.y : hifi.dimensions.contentSpacing.y;
emailField.focus = true;
} 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 = "";
usernameField.focus = true;
}
loginContainer.visible = true;
}
Item {
id: mainContainer
width: root.width
height: root.height
onHeightChanged: d.resize(); onWidthChanged: d.resize();
Rectangle {
id: opaqueRect
height: parent.height
width: parent.width
opacity: 0.9
color: "black"
}
Item {
id: bannerContainer
width: parent.width
height: banner.height
anchors {
top: parent.top
topMargin: 85
}
Image {
id: banner
anchors.centerIn: parent
source: "../../images/high-fidelity-banner.svg"
horizontalAlignment: Image.AlignHCenter
}
}
Item {
id: loginContainer
width: parent.width
height: parent.height - (bannerContainer.height + 1.5 * hifi.dimensions.contentSpacing.y)
anchors {
top: bannerContainer.bottom
topMargin: 1.5 * hifi.dimensions.contentSpacing.y
}
visible: true
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 {
id: usernameField
width: banner.width
height: signInBody.textFieldHeight
font.family: signInBody.fontFamily
placeholderText: "Username"
anchors {
top: parent.top
topMargin: 0.2 * parent.height
left: parent.left
leftMargin: (parent.width - usernameField.width) / 2
}
focus: !loginDialog.isLogIn
visible: false
Keys.onPressed: {
if (!usernameField.visible) {
return;
}
switch (event.key) {
case Qt.Key_Tab:
event.accepted = true;
if (event.modifiers === Qt.ShiftModifier) {
passwordField.focus = true;
} else {
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) {
if (loginDialog.isLogIn) {
Settings.setValue("keepMeLoggedIn/savedUsername", emailField.text);
} else {
Settings.setValue("keepMeLoggedIn/savedUsername", usernameField.text);
}
}
signInBody.login();
break;
}
}
onFocusChanged: {
root.text = "";
root.isPassword = !focus;
}
}
HifiControlsUit.TextField {
id: emailField
width: banner.width
height: signInBody.textFieldHeight
font.family: signInBody.fontFamily
anchors {
top: parent.top
left: parent.left
leftMargin: (parent.width - emailField.width) / 2
}
focus: loginDialog.isLogIn
placeholderText: "Username or Email"
activeFocusOnPress: true
Keys.onPressed: {
switch (event.key) {
case Qt.Key_Tab:
event.accepted = true;
if (event.modifiers === Qt.ShiftModifier) {
if (usernameField.visible) {
usernameField.focus = true;
break;
}
}
passwordField.focus = true;
break;
case Qt.Key_Backtab:
event.accepted = true;
usernameField.focus = true;
break;
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true;
if (keepMeLoggedInCheckbox.checked) {
if (loginDialog.isLogIn) {
Settings.setValue("keepMeLoggedIn/savedUsername", emailField.text);
} else {
Settings.setValue("keepMeLoggedIn/savedUsername", usernameField.text);
}
}
signInBody.login();
break;
}
}
onFocusChanged: {
root.text = "";
root.isPassword = !focus;
}
}
HifiControlsUit.TextField {
id: passwordField
width: banner.width
height: signInBody.textFieldHeight
font.family: signInBody.fontFamily
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 = focus;
}
Item {
id: showPasswordContainer
z: 10
// width + image's rightMargin
width: showPasswordImage.width + 8
height: parent.height
anchors {
right: parent.right
}
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.onPressed: {
switch (event.key) {
case Qt.Key_Tab:
event.accepted = true;
if (event.modifiers === Qt.ShiftModifier) {
emailField.focus = true;
} else if (usernameField.visible) {
usernameField.focus = true;
} else {
emailField.focus = true;
}
break;
case Qt.Key_Backtab:
event.accepted = true;
emailField.focus = true;
break;
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true;
if (keepMeLoggedInCheckbox.checked) {
if (loginDialog.isLogIn) {
Settings.setValue("keepMeLoggedIn/savedUsername", emailField.text);
} else {
Settings.setValue("keepMeLoggedIn/savedUsername", usernameField.text);
}
}
signInBody.login();
break;
}
}
}
HifiControlsUit.CheckBox {
id: keepMeLoggedInCheckbox
checked: Settings.getValue("keepMeLoggedIn", false);
text: qsTr("Keep Me Logged In");
boxSize: 18;
labelFontFamily: signInBody.fontFamily
labelFontSize: 18;
color: hifi.colors.white;
anchors {
top: passwordField.bottom;
topMargin: hifi.dimensions.contentSpacing.y;
right: passwordField.right;
}
onCheckedChanged: {
Settings.setValue("keepMeLoggedIn", checked);
if (checked) {
Settings.setValue("keepMeLoggedIn/savedUsername", Account.username);
var savedUsername = Settings.getValue("keepMeLoggedIn/savedUsername", "");
usernameField.text = savedUsername === "Unknown user" ? "" : savedUsername;
} else {
Settings.setValue("keepMeLoggedIn/savedUsername", "");
}
}
Component.onDestruction: {
Settings.setValue("keepMeLoggedIn", checked);
}
}
Item {
id: cancelContainer
width: cancelText.width
height: d.minHeightButton
anchors {
top: keepMeLoggedInCheckbox.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: signInBody.fontFamily
font.pixelSize: signInBody.fontSize
font.capitalization: Font.AllUppercase;
font.bold: signInBody.fontBold
lineHeightMode: Text.ProportionalHeight
}
MouseArea {
id: cancelArea
anchors.fill: parent
acceptedButtons: Qt.LeftButton
hoverEnabled: true
onEntered: {
Tablet.playSound(TabletEnums.ButtonHover);
}
onClicked: {
Tablet.playSound(TabletEnums.ButtonClick);
bodyLoader.setSource("LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
}
}
}
HifiControlsUit.Button {
id: loginButtonAtSignIn
width: d.minWidthButton
height: d.minHeightButton
text: qsTr("Log In")
fontFamily: signInBody.fontFamily
fontSize: signInBody.fontSize
fontBold: signInBody.fontBold
anchors {
top: cancelContainer.top
right: passwordField.right
}
onClicked: {
signInBody.login()
}
}
Item {
id: cantAccessContainer
width: parent.width
y: usernameField.height
anchors {
top: cancelContainer.bottom
topMargin: 3.5 * hifi.dimensions.contentSpacing.y
}
visible: false
HifiStylesUit.ShortcutText {
id: cantAccessText
z: 10
anchors.centerIn: parent
font.family: signInBody.fontFamily
font.pixelSize: 14
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)
}
}
}
}
Component.onCompleted: {
//but rise Tablet's one instead for Tablet interface
root.keyboardEnabled = HMD.active;
root.keyboardRaised = Qt.binding( function() { return keyboardRaised; })
root.text = "";
d.resize();
init(loginDialog.isLogIn);
}
Keys.onPressed: {
if (!visible) {
return;
}
switch (event.key) {
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true;
if (loginDialog.isLogIn) {
Settings.setValue("keepMeLoggedIn/savedUsername", emailField.text);
} else {
Settings.setValue("keepMeLoggedIn/savedUsername", usernameField.text);
}
signInBody.login();
break;
}
}
Connections {
target: loginDialog
onHandleSignupCompleted: {
console.log("Sign Up Completed");
loginDialog.login(usernameField.text, passwordField.text);
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "withSteam": false, "fromBody": "" });
}
onHandleSignupFailed: {
console.log("Sign Up Failed")
loginErrorMessage.visible = (errorString !== "");
if (errorString !== "") {
loginErrorMessage.text = errorString;
errorContainer.anchors.bottom = loginDialog.isLogIn ? emailField.top : usernameField.top;
errorContainer.anchors.left = emailField.left;
}
}
}
}

571
interface/resources/qml/LoginDialog/SignUpBody.qml
View file

@ -1,8 +1,8 @@
//
// SignUpBody.qml
// SignInBody.qml
//
// Created by Stephen Birarda on 7 Dec 2016
// Copyright 2016 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
@ -11,21 +11,21 @@
import Hifi 1.0
import QtQuick 2.7
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4 as OriginalStyles
import controlsUit 1.0
import stylesUit 1.0
import controlsUit 1.0 as HifiControlsUit
import stylesUit 1.0 as HifiStylesUit
import TabletScriptingInterface 1.0
Item {
id: signupBody
id: signInBody
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)
}
height: root.height
width: root.width
property int textFieldHeight: 31
property string fontFamily: "Raleway"
property int fontSize: 15
property bool fontBold: true
property bool keyboardEnabled: false
property bool keyboardRaised: false
@ -33,248 +33,421 @@ Item {
onKeyboardRaisedChanged: d.resize();
property string errorString: errorString
QtObject {
id: d
readonly property int minWidth: 480
readonly property int maxWidth: 1280
readonly property int minWidthButton: !root.isTablet ? 256 : 174
property int maxWidth: root.isTablet ? 1280 : root.width
readonly property int minHeight: 120
readonly property int maxHeight: 720
readonly property int minHeightButton: !root.isTablet ? 56 : 42
property int maxHeight: root.isTablet ? 720 : root.height
function resize() {
var targetWidth = Math.max(titleWidth, form.contentWidth);
var targetHeight = hifi.dimensions.contentSpacing.y + mainTextContainer.height +
4 * hifi.dimensions.contentSpacing.y + form.height;
maxWidth = root.isTablet ? 1280 : root.width;
maxHeight = root.isTablet ? 720 : root.height;
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.width = newWidth;
}
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);
+ (keyboardEnabled && keyboardRaised ? (200 + 2 * hifi.dimensions.contentSpacing.y) : hifi.dimensions.contentSpacing.y);
}
}
function toggleLoading(isLoading) {
linkAccountSpinner.visible = isLoading
form.visible = !isLoading
leftButton.visible = !isLoading
buttons.visible = !isLoading
function login() {
loginDialog.signup(emailField.text, usernameField.text, passwordField.text);
return;
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "withSteam": false, "withOculus": false, "fromBody": "" });
}
BusyIndicator {
id: linkAccountSpinner
anchors {
top: parent.top
horizontalCenter: parent.horizontalCenter
topMargin: hifi.dimensions.contentSpacing.y
function init() {
// going to/from sign in/up dialog.
loginDialog.isLogIn = false;
loginErrorMessage.visible = (signInBody.errorString !== "");
if (signInBody.errorString !== "") {
loginErrorMessage.text = signInBody.errorString;
errorContainer.anchors.bottom = usernameField.top;
errorContainer.anchors.left = usernameField.left;
}
visible: false
running: true
width: 48
height: 48
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 = "";
usernameField.focus = true;
loginContainer.visible = true;
}
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
Item {
id: mainContainer
width: root.width
height: root.height
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
Rectangle {
id: opaqueRect
height: parent.height
width: parent.width
label: "Email"
activeFocusOnPress: true
onFocusChanged: {
root.text = "";
opacity: 0.9
color: "black"
}
Item {
id: bannerContainer
width: parent.width
height: banner.height
anchors {
top: parent.top
topMargin: 85
}
Image {
id: banner
anchors.centerIn: parent
source: "../../images/high-fidelity-banner.svg"
horizontalAlignment: Image.AlignHCenter
}
}
TextField {
id: usernameField
Item {
id: loginContainer
width: parent.width
label: "Username"
activeFocusOnPress: true
height: parent.height - (bannerContainer.height + 1.5 * hifi.dimensions.contentSpacing.y)
anchors {
top: bannerContainer.bottom
topMargin: 1.5 * hifi.dimensions.contentSpacing.y
}
visible: true
ShortcutText {
Item {
id: errorContainer
width: loginErrorMessageTextMetrics.width
height: loginErrorMessageTextMetrics.height
anchors {
verticalCenter: parent.textFieldLabel.verticalCenter
left: parent.textFieldLabel.right
leftMargin: 10
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
}
}
text: qsTr("No spaces / special chars.")
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
color: hifi.colors.blueAccent
HifiControlsUit.TextField {
id: usernameField
width: banner.width
height: signInBody.textFieldHeight
font.family: signInBody.fontFamily
placeholderText: "Username"
anchors {
top: parent.top
topMargin: 0.2 * parent.height
left: parent.left
leftMargin: (parent.width - usernameField.width) / 2
}
focus: true
Keys.onPressed: {
if (!usernameField.visible) {
return;
}
switch (event.key) {
case Qt.Key_Tab:
event.accepted = true;
if (event.modifiers === Qt.ShiftModifier) {
passwordField.focus = true;
} else {
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", usernameField.text);
}
signInBody.login();
break;
}
}
onFocusChanged: {
root.text = "";
root.isPassword = !focus;
}
}
}
TextField {
id: passwordField
width: parent.width
label: "Password"
echoMode: TextInput.Password
activeFocusOnPress: true
ShortcutText {
HifiControlsUit.TextField {
id: emailField
width: banner.width
height: signInBody.textFieldHeight
font.family: signInBody.fontFamily
anchors {
verticalCenter: parent.textFieldLabel.verticalCenter
left: parent.textFieldLabel.right
leftMargin: 10
top: parent.top
left: parent.left
leftMargin: (parent.width - emailField.width) / 2
}
placeholderText: "Username or Email"
activeFocusOnPress: true
Keys.onPressed: {
switch (event.key) {
case Qt.Key_Tab:
event.accepted = true;
if (event.modifiers === Qt.ShiftModifier) {
if (usernameField.visible) {
usernameField.focus = true;
break;
}
}
passwordField.focus = true;
break;
case Qt.Key_Backtab:
event.accepted = true;
usernameField.focus = true;
break;
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true;
if (keepMeLoggedInCheckbox.checked) {
Settings.setValue("keepMeLoggedIn/savedUsername", usernameField.text);
}
signInBody.login();
break;
}
}
onFocusChanged: {
root.text = "";
root.isPassword = !focus;
}
}
HifiControlsUit.TextField {
id: passwordField
width: banner.width
height: signInBody.textFieldHeight
font.family: signInBody.fontFamily
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
}
text: qsTr("At least 6 characters")
onFocusChanged: {
root.text = "";
root.isPassword = focus;
}
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
Item {
id: showPasswordContainer
z: 10
// width + image's rightMargin
width: showPasswordImage.width + 8
height: parent.height
anchors {
right: parent.right
}
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
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.onPressed: {
switch (event.key) {
case Qt.Key_Tab:
event.accepted = true;
if (event.modifiers === Qt.ShiftModifier) {
emailField.focus = true;
} else if (usernameField.visible) {
usernameField.focus = true;
} else {
emailField.focus = true;
}
break;
case Qt.Key_Backtab:
event.accepted = true;
emailField.focus = true;
break;
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true;
if (keepMeLoggedInCheckbox.checked) {
Settings.setValue("keepMeLoggedIn/savedUsername", usernameField.text);
}
signInBody.login();
break;
}
}
}
}
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()
HifiControlsUit.CheckBox {
id: keepMeLoggedInCheckbox
checked: Settings.getValue("keepMeLoggedIn", false);
text: qsTr("Keep Me Logged In");
boxSize: 18;
labelFontFamily: signInBody.fontFamily
labelFontSize: 18;
color: hifi.colors.white;
anchors {
top: passwordField.bottom;
topMargin: hifi.dimensions.contentSpacing.y;
left: passwordField.left;
}
onCheckedChanged: {
Settings.setValue("keepMeLoggedIn", checked);
if (checked) {
Settings.setValue("keepMeLoggedIn/savedUsername", Account.username);
var savedUsername = Settings.getValue("keepMeLoggedIn/savedUsername", "");
usernameField.text = savedUsername === "Unknown user" ? "" : savedUsername;
} else {
Settings.setValue("keepMeLoggedIn/savedUsername", "");
}
}
Component.onDestruction: {
Settings.setValue("keepMeLoggedIn", checked);
}
}
Item {
id: cancelContainer
width: cancelText.width
height: d.minHeightButton
anchors {
top: keepMeLoggedInCheckbox.bottom
topMargin: hifi.dimensions.contentSpacing.y
left: parent.left
leftMargin: (parent.width - passwordField.width) / 2
}
Text {
id: cancelText
anchors.centerIn: parent
text: qsTr("Cancel");
Button {
anchors.verticalCenter: parent.verticalCenter
lineHeight: 1
color: "white"
font.family: signInBody.fontFamily
font.pixelSize: signInBody.fontSize
font.capitalization: Font.AllUppercase;
font.bold: signInBody.fontBold
lineHeightMode: Text.ProportionalHeight
}
MouseArea {
id: cancelArea
anchors.fill: parent
acceptedButtons: Qt.LeftButton
hoverEnabled: true
onEntered: {
Tablet.playSound(TabletEnums.ButtonHover);
}
onClicked: {
Tablet.playSound(TabletEnums.ButtonClick);
bodyLoader.setSource("LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader });
}
}
}
HifiControlsUit.Button {
id: loginButtonAtSignIn
width: d.minWidthButton
height: d.minHeightButton
text: qsTr("Log In")
fontFamily: signInBody.fontFamily
fontSize: signInBody.fontSize
fontBold: signInBody.fontBold
anchors {
top: cancelContainer.top
right: passwordField.right
}
text: qsTr("Cancel")
onClicked: root.tryDestroy()
onClicked: {
signInBody.login()
}
}
}
}
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; })
}
root.keyboardEnabled = HMD.active;
root.keyboardRaised = Qt.binding( function() { return keyboardRaised; })
root.text = "";
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
}
}
init();
}
Keys.onPressed: {
if (!visible) {
return
return;
}
switch (event.key) {
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true
signupBody.signup()
break
case Qt.Key_Enter:
case Qt.Key_Return:
event.accepted = true;
Settings.setValue("keepMeLoggedIn/savedUsername", usernameField.text);
signInBody.login();
break;
}
}
Connections {
target: loginDialog
onHandleSignupCompleted: {
console.log("Sign Up Completed");
loginDialog.login(usernameField.text, passwordField.text);
bodyLoader.setSource("LoggingInBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader, "withSteam": false, "fromBody": "" });
}
onHandleSignupFailed: {
console.log("Sign Up Failed")
var errorStringEdited = errorString.replace(/[\n\r]+/g, ' ');
loginErrorMessage.visible = (errorStringEdited !== "");
if (errorStringEdited !== "") {
loginErrorMessage.text = errorStringEdited;
errorContainer.anchors.bottom = usernameField.top;
errorContainer.anchors.left = usernameField.left;
}
}
}
}

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

@ -21,8 +21,8 @@ Item {
clip: true
width: root.width
height: root.height
readonly property string fontFamily: "Cairo"
readonly property int fontSize: 24
readonly property string fontFamily: "Raleway"
readonly property int fontSize: 15
readonly property bool fontBold: true
readonly property string errorString: errorString

1
interface/resources/qml/stylesUit/HifiConstants.qml
View file

@ -350,5 +350,6 @@ QtObject {
readonly property string uninstall: "\ue033"
readonly property string verticalEllipsis: "\ue034"
readonly property string steamSquare: "\ue035"
readonly property string oculus: "\ue036"
}
}

5
interface/src/ui/LoginDialog.cpp
View file

@ -18,6 +18,7 @@
#include <plugins/PluginManager.h>
#include <plugins/SteamClientPlugin.h>
#include <shared/GlobalAppProperties.h>
#include <ui/TabletScriptingInterface.h>
#include <UserActivityLogger.h>
@ -100,6 +101,10 @@ bool LoginDialog::isSteamRunning() const {
return steamClient && steamClient->isRunning();
}
bool LoginDialog::isOculusStoreRunning() const {
return qApp->property(hifi::properties::OCULUS_STORE).toBool();
}
void LoginDialog::dismissLoginDialog() {
// it'll only pop up once.
qDebug() << "LoginDialog::dismissLoginDialog";

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

@ -62,6 +62,7 @@ protected slots:
Q_INVOKABLE void dismissLoginDialog();
Q_INVOKABLE bool isSteamRunning() const;
Q_INVOKABLE bool isOculusStoreRunning() const;
Q_INVOKABLE void login(const QString& username, const QString& password) const;
Q_INVOKABLE void loginThroughSteam();