From eb36abbff632e0f08e336bea3e9e7a14e0a0e0f2 Mon Sep 17 00:00:00 2001 From: Wayne Chen Date: Tue, 23 Oct 2018 23:10:16 -0700 Subject: [PATCH] more wip --- .../qml/LoginDialog/UsernameCollisionBody.qml | 230 +++++++++++------- .../resources/qml/LoginDialog/WelcomeBody.qml | 90 ------- 2 files changed, 142 insertions(+), 178 deletions(-) delete mode 100644 interface/resources/qml/LoginDialog/WelcomeBody.qml diff --git a/interface/resources/qml/LoginDialog/UsernameCollisionBody.qml b/interface/resources/qml/LoginDialog/UsernameCollisionBody.qml index 2a41353534..b38c6b1ad4 100644 --- a/interface/resources/qml/LoginDialog/UsernameCollisionBody.qml +++ b/interface/resources/qml/LoginDialog/UsernameCollisionBody.qml @@ -12,14 +12,17 @@ import Hifi 1.0 import QtQuick 2.4 import QtQuick.Controls 1.4 -import controlsUit 1.0 -import stylesUit 1.0 +import controlsUit 1.0 as HifiControlsUit +import stylesUit 1.0 as HifiStylesUit Item { id: usernameCollisionBody clip: true width: root.pane.width height: root.pane.height + readonly property string fontFamily: "Cairo" + readonly property int fontSize: 24 + readonly property bool fontBold: true function create() { mainTextContainer.visible = false @@ -36,98 +39,164 @@ Item { 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 : Window.innerWidth readonly property int minHeight: 120 - readonly property int maxHeight: 720 + readonly property int minHeightButton: !root.isTablet ? 56 : 42 + property int maxHeight: root.isTablet ? 720 : Window.innerHeight function resize() { - var targetWidth = Math.max(titleWidth, mainTextContainer.contentWidth) + maxWidth = root.isTablet ? 1280 : Window.innerWidth; + maxHeight = root.isTablet ? 720 : Window.innerHeight; + var targetWidth = Math.max(Math.max(titleWidth, mainTextContainer.contentWidth), mainContainer.width) var targetHeight = mainTextContainer.height + hifi.dimensions.contentSpacing.y + textField.height + hifi.dimensions.contentSpacing.y + buttons.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)) + parent.height = root.height = Math.max(Math.max(d.minHeight, Math.min(d.maxHeight, targetHeight)), mainContainer.height) + (keyboardEnabled && keyboardRaised ? (200 + 2 * hifi.dimensions.contentSpacing.y) : hifi.dimensions.contentSpacing.y) } } - ShortcutText { - id: mainTextContainer - anchors { - top: parent.top - left: parent.left - margins: 0 - topMargin: hifi.dimensions.contentSpacing.y - } - - text: qsTr("Your Steam username is not available.") - wrapMode: Text.WordWrap - color: hifi.colors.redAccent - lineHeight: 1 - lineHeightMode: Text.ProportionalHeight - horizontalAlignment: Text.AlignHCenter - } - - - TextField { - id: textField - anchors { - top: mainTextContainer.bottom - left: parent.left - margins: 0 - topMargin: hifi.dimensions.contentSpacing.y - } - width: parent.width - - placeholderText: "Choose your own" - } - - // Override ScrollingWindow's keyboard that would be at very bottom of dialog. - Keyboard { - raised: keyboardEnabled && keyboardRaised - numeric: punctuationMode - anchors { - left: parent.left - right: parent.right - bottom: buttons.top - bottomMargin: keyboardRaised ? 2 * hifi.dimensions.contentSpacing.y : 0 - } - } - - Row { - id: buttons - anchors { - bottom: parent.bottom - right: parent.right - margins: 0 - bottomMargin: hifi.dimensions.contentSpacing.y - } - spacing: hifi.dimensions.contentSpacing.x + Item { + id: mainContainer + width: root.pane.width + height: root.pane.height onHeightChanged: d.resize(); onWidthChanged: d.resize(); - Button { - anchors.verticalCenter: parent.verticalCenter - width: 200 - - text: qsTr("Create your profile") - color: hifi.buttons.blue - - onClicked: usernameCollisionBody.create() + Rectangle { + id: opaqueRect + height: parent.height + width: parent.width + opacity: 0.9 + color: "black" } - Button { - anchors.verticalCenter: parent.verticalCenter + 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 + } + } - text: qsTr("Cancel") + TextMetrics { + id: mainTextContainerTextMetrics + font: mainTextContainer.font + text: mainTextContainer.text + } - onClicked: root.tryDestroy() + Text { + id: mainTextContainer + anchors { + top: parent.top + left: parent.left + leftMargin: (parent.width - mainTextContainer.width) / 2 + topMargin: parent.height/2 - buttons.anchors.topMargin - textField.height - mainTextContainerTextMetrics.height + } + + font.family: usernameCollisionBody.fontFamily + font.pixelSize: usernameCollisionBody.fontSize - 10 + font.bold: usernameCollisionBody.fontBold + text: qsTr("Your Steam username is not available.") + wrapMode: Text.WordWrap + color: hifi.colors.redAccent + lineHeight: 1 + lineHeightMode: Text.ProportionalHeight + horizontalAlignment: Text.AlignHCenter + } + + + HifiControlsUit.TextField { + id: textField + anchors { + top: mainTextContainer.bottom + left: parent.left + leftMargin: (parent.width - width) / 2 + topMargin: hifi.dimensions.contentSpacing.y + } + font.family: usernameCollisionBody.fontFamily + font.pixelSize: usernameCollisionBody.fontSize - 10 + font.bold: usernameCollisionBody.fontBold + width: banner.width + + placeholderText: "Choose your own" + + Keys.onPressed: { + if (!visible) { + return; + } + + switch (event.key) { + case Qt.Key_Enter: + case Qt.Key_Return: + event.accepted = true; + usernameCollisionBody.create(); + break; + } + } + } + + // Override ScrollingWindow's keyboard that would be at very bottom of dialog. + HifiControlsUit.Keyboard { + raised: keyboardEnabled && keyboardRaised + numeric: punctuationMode + anchors { + left: parent.left + right: parent.right + bottom: buttons.top + bottomMargin: keyboardRaised ? 2 * hifi.dimensions.contentSpacing.y : 0 + } + } + Row { + id: buttons + anchors { + top: textField.bottom + topMargin: 5 * hifi.dimensions.contentSpacing.y + horizontalCenter: parent.horizontalCenter + margins: 0 + } + spacing: hifi.dimensions.contentSpacing.x + onHeightChanged: d.resize(); onWidthChanged: d.resize(); + HifiControlsUit.Button { + id: profileButton + anchors.verticalCenter: parent.verticalCenter + width: 256 + + text: qsTr("Create your profile") + color: hifi.buttons.blue + + fontFamily: usernameCollisionBody.fontFamily + fontSize: usernameCollisionBody.fontSize + fontBold: usernameCollisionBody.fontBold + onClicked: { + usernameCollisionBody.create() + } + } + HifiControlsUit.Button { + id: cancelButton + anchors.verticalCenter: parent.verticalCenter + text: qsTr("Cancel") + fontFamily: usernameCollisionBody.fontFamily + fontSize: usernameCollisionBody.fontSize + fontBold: usernameCollisionBody.fontBold + onClicked: { + bodyLoader.setSource("LinkAccountBody.qml", { "loginDialog": loginDialog, "root": root, "bodyLoader": bodyLoader }); + } + } } } Component.onCompleted: { - root.title = qsTr("Complete Your Profile") - root.iconText = "<" //dont rise local keyboard keyboardEnabled = !root.isTablet && HMD.active; //but rise Tablet's one instead for Tablet interface @@ -155,26 +224,11 @@ Item { onHandleLoginCompleted: { console.log("Login Succeeded") - bodyLoader.setSource("WelcomeBody.qml", { "welcomeBack" : false }) - bodyLoader.item.width = root.pane.width - bodyLoader.item.height = root.pane.height } + onHandleLoginFailed: { console.log("Login Failed") } } - Keys.onPressed: { - if (!visible) { - return - } - - switch (event.key) { - case Qt.Key_Enter: - case Qt.Key_Return: - event.accepted = true - usernameCollisionBody.create() - break - } - } } diff --git a/interface/resources/qml/LoginDialog/WelcomeBody.qml b/interface/resources/qml/LoginDialog/WelcomeBody.qml deleted file mode 100644 index 020e6db002..0000000000 --- a/interface/resources/qml/LoginDialog/WelcomeBody.qml +++ /dev/null @@ -1,90 +0,0 @@ -// -// WelcomeBody.qml -// -// Created by Clement on 7/18/16 -// Copyright 2015 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.4 - -import controlsUit 1.0 -import stylesUit 1.0 - -Item { - id: welcomeBody - clip: true - width: root.pane.width - height: root.pane.height - - property bool welcomeBack: false - - function setTitle() { - root.title = (welcomeBack ? qsTr("Welcome back ") : qsTr("Welcome ")) + Account.username + qsTr("!") - root.iconText = "" - 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, mainTextContainer.contentWidth) - var targetHeight = mainTextContainer.height + 3 * hifi.dimensions.contentSpacing.y + buttons.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)) - } - } - - InfoItem { - id: mainTextContainer - anchors { - top: parent.top - horizontalCenter: parent.horizontalCenter - margins: 0 - topMargin: hifi.dimensions.contentSpacing.y - } - - text: qsTr("You are now signed into High Fidelity") - wrapMode: Text.WordWrap - color: hifi.colors.baseGrayHighlight - lineHeight: 2 - lineHeightMode: Text.ProportionalHeight - horizontalAlignment: Text.AlignHCenter - } - - Row { - id: buttons - anchors { - top: mainTextContainer.bottom - horizontalCenter: parent.horizontalCenter - margins: 0 - topMargin: 2 * hifi.dimensions.contentSpacing.y - } - spacing: hifi.dimensions.contentSpacing.x - onHeightChanged: d.resize(); onWidthChanged: d.resize(); - - Button { - anchors.verticalCenter: parent.verticalCenter - - text: qsTr("Close"); - - onClicked: root.tryDestroy() - } - } - - Component.onCompleted: welcomeBody.setTitle() - - Connections { - target: Account - onUsernameChanged: welcomeBody.setTitle() - } -}