diff --git a/interface/resources/qml/hifi/simplifiedUI/topBar/SimplifiedTopBar.qml b/interface/resources/qml/hifi/simplifiedUI/topBar/SimplifiedTopBar.qml index a16fb9b82d..f7e34035bb 100644 --- a/interface/resources/qml/hifi/simplifiedUI/topBar/SimplifiedTopBar.qml +++ b/interface/resources/qml/hifi/simplifiedUI/topBar/SimplifiedTopBar.qml @@ -128,6 +128,10 @@ Rectangle { // If we have never auto-selected and the user is still using a default avatar or if the current avatar is not valid (fst), or if // the current avatar is the old default (Woody), use top avatar from inventory or one of the new defaults. + // ZRF REMOVE ME! + currentAvatarURLContainsDefaultAvatar = true; + userHasValidAvatarInInventory = false; + // If the current avatar URL is invalid, OR the user is using the "default avatar" (Woody)... if (!currentAvatarURLContainsFST || currentAvatarURLContainsDefaultAvatar) { // If the user has a valid avatar in their inventory... diff --git a/scripts/simplifiedUI/ui/simplifiedFTUE/InitialLaunchWindow.qml b/scripts/simplifiedUI/ui/simplifiedFTUE/InitialLaunchWindow.qml index ec7effe4a5..da69b319fa 100644 --- a/scripts/simplifiedUI/ui/simplifiedFTUE/InitialLaunchWindow.qml +++ b/scripts/simplifiedUI/ui/simplifiedFTUE/InitialLaunchWindow.qml @@ -34,6 +34,283 @@ Rectangle { } } + Item { + id: tempAvatarPageContainer + anchors.fill: parent + + Flickable { + id: tempAvatarPageFlickable + anchors.top: parent.top + anchors.left: parent.left + anchors.leftMargin: 16 + anchors.right: parent.right + anchors.rightMargin: 16 + anchors.bottom: continueLink.top + clip: true + contentWidth: parent.width + contentHeight: tempAvatarPageGrid.heights + interactive: contentHeight > height + + RowLayout { + id: tempAvatarPageGrid + width: parent.width + + Image { + Layout.preferredWidth: 428 + Layout.minimumHeight: 240 + Layout.maximumHeight: 800 + Layout.fillHeight: true + source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/" + + MyAvatar.skeletonModelURL.substring(MyAvatar.skeletonModelURL.indexOf("simplifiedAvatar"), MyAvatar.skeletonModelURL.lastIndexOf("/")) + ".png" + mipmap: true + fillMode: Image.PreserveAspectFit + } + + Item { + id: textAndQRContainer + Layout.minimumWidth: 300 + Layout.maximumWidth: 1680 + Layout.fillWidth: true + Layout.preferredHeight: childrenRect.height + + HifiStylesUit.RalewayBold { + id: headerText + text: "We know this isn't you..." + color: simplifiedUI.colors.text.black + size: 48 + height: paintedHeight + wrapMode: Text.Wrap + anchors.top: parent.top + anchors.topMargin: 120 + anchors.left: parent.left + anchors.right: parent.right + } + + HifiStylesUit.RalewayRegular { + id: descriptionText + anchors.top: headerText.bottom + anchors.topMargin: 10 + anchors.left: parent.left + anchors.right: parent.right + height: paintedHeight + text: "but we've given you this temporary avatar to use " + + "for today. If you see this avatar in-world, walk up and " + + "say hello to other new users!

" + + "We want you to be you so we've built an Avatar Creator " + + "App that's as easy as taking a selfie and picking your " + + "outfits! Available now on iOS and Android." + color: simplifiedUI.colors.text.black + size: 22 + wrapMode: Text.Wrap + } + + Item { + id: qrAndInstructionsContainer + anchors.top: descriptionText.bottom + anchors.topMargin: 50 + anchors.left: parent.left + anchors.right: parent.right + height: avatarAppQRCodeImage.height + + Image { + id: avatarAppQRCodeImage + source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/qrCode.jpg" + height: 190 + width: 190 + mipmap: true + fillMode: Image.PreserveAspectFit + } + + HifiStylesUit.RalewayBold { + id: instructionText + anchors.top: avatarAppQRCodeImage.top + anchors.bottom: avatarAppQRCodeImage.bottom + anchors.left: avatarAppQRCodeImage.right + anchors.leftMargin: 30 + anchors.right: parent.right + text: "Use your mobile phone to scan this QR code." + color: simplifiedUI.colors.text.black + size: 22 + wrapMode: Text.Wrap + } + } + } + } + } + + + HifiStylesUit.RalewayBold { + id: continueLink + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.leftMargin: 16 + anchors.right: parent.right + anchors.rightMargin: 16 + height: 96 + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + text: "Continue >" + color: simplifiedUI.colors.text.lightBlue + opacity: continueMouseArea.containsMouse ? 1.0 : 0.7 + size: 36 + + MouseArea { + id: continueMouseArea + hoverEnabled: true + anchors.fill: parent + + onClicked: { + Tablet.playSound(TabletEnums.ButtonClick); + tempAvatarPageContainer.visible = false; + Settings.setValue("simplifiedUI/closedAvatarPageOfInitialLaunchWindow", true); + controlsContainer.visible = true; + } + } + } + + SimplifiedControls.VerticalScrollBar { + parent: tempAvatarPageFlickable + } + } + + Item { + id: controlsContainer + visible: false + anchors.fill: parent + + HifiStylesUit.RalewayRegular { + id: controlsDescriptionText + text: "Use these avatar controls to interact with and move around in your new HQ." + anchors.top: parent.top + anchors.topMargin: 48 + anchors.left: parent.left + anchors.leftMargin: 32 + anchors.right: parent.right + anchors.rightMargin: 32 + horizontalAlignment: Text.AlignHCenter + height: paintedHeight + color: simplifiedUI.colors.text.black + size: 36 + wrapMode: Text.Wrap + } + + Item { + anchors.top: controlsDescriptionText.bottom + anchors.topMargin: 16 + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: bottomBarContainer.top + + GridView { + id: controlsGrid + property int maxColumns: 2 + property int idealCellWidth: 361 + anchors.fill: parent + clip: true + cellWidth: width / Math.min(Math.floor(width / idealCellWidth), maxColumns) + cellHeight: 225 + model: ListModel { + ListElement { + imageHeight: 198 + imageSource: "images/walkingControls.png" + } + ListElement { + imageHeight: 193 + imageSource: "images/mouseControls.png" + } + ListElement { + imageHeight: 146 + imageSource: "images/runJumpControls.png" + } + ListElement { + imageHeight: 96 + imageSource: "images/cameraControls.png" + } + } + delegate: Rectangle { + height: GridView.view.cellHeight + width: GridView.view.cellWidth + Image { + anchors.centerIn: parent + width: parent.GridView.view.idealCellWidth + height: model.imageHeight + source: model.imageSource + fillMode: Image.PreserveAspectFit + } + } + } + + SimplifiedControls.VerticalScrollBar { + parent: controlsGrid + anchors.topMargin: 96 + anchors.bottomMargin: anchors.topMargin + } + } + + Item { + id: bottomBarContainer + anchors.left: parent.left + anchors.leftMargin: 32 + anchors.right: parent.right + anchors.rightMargin: 32 + anchors.bottom: parent.bottom + height: iHaveAGoodGrip.height + learnMoreLink.height + 48 + + HifiStylesUit.RalewayBold { + id: iHaveAGoodGrip + anchors.centerIn: parent + text: "I've got a good grip on the controls." + width: parent.width + height: paintedHeight + color: simplifiedUI.colors.text.lightBlue + opacity: goodGripMouseArea.containsMouse ? 1.0 : 0.7 + size: 36 + wrapMode: Text.Wrap + horizontalAlignment: Text.AlignHCenter + + MouseArea { + id: goodGripMouseArea + hoverEnabled: true + anchors.fill: parent + + onClicked: { + Tablet.playSound(TabletEnums.ButtonClick); + sendToScript({ + "source": "InitialLaunchWindow.qml", + "method": "closeInitialLaunchWindow" + }); + } + } + } + + HifiStylesUit.RalewayBold { + id: learnMoreLink + anchors.left: parent.left + anchors.leftMargin: 16 + anchors.top: iHaveAGoodGrip.bottom + anchors.topMargin: 8 + text: "Learn more about our controls." + width: paintedWidth + height: paintedHeight + color: simplifiedUI.colors.text.lightBlue + opacity: learnMoreAboutControlsMouseArea.containsMouse ? 1.0 : 0.7 + size: 14 + wrapMode: Text.Wrap + + MouseArea { + id: learnMoreAboutControlsMouseArea + hoverEnabled: true + anchors.fill: parent + + onClicked: { + Tablet.playSound(TabletEnums.ButtonClick); + Qt.openUrlExternally("https://www.highfidelity.com/knowledge/get-around"); + } + } + } + } + } + Image { id: topLeftAccentImage width: 400 @@ -52,252 +329,5 @@ Rectangle { source: "images/defaultBottomRight.png" } - Flickable { - id: tempAvatarPageContainer - visible: true - anchors.fill: parent - clip: true - contentWidth: parent.width - contentHeight: tempAvatarPageGrid.height - - GridLayout { - id: tempAvatarPageGrid - width: parent.width - columns: 2 - rows: 1 - - Image { - Layout.preferredWidth: 428 - Layout.minimumHeight: 240 - Layout.maximumHeight: 800 - Layout.fillHeight: true - source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/" + - MyAvatar.skeletonModelURL.substring(MyAvatar.skeletonModelURL.indexOf("simplifiedAvatar"), MyAvatar.skeletonModelURL.lastIndexOf("/")) + ".png" - mipmap: true - fillMode: Image.PreserveAspectFit - } - - Item { - id: textAndQRContainer - Layout.minimumWidth: 300 - Layout.maximumWidth: 1680 - Layout.fillWidth: true - Layout.preferredHeight: childrenRect.height - - HifiStylesUit.RalewayBold { - id: headerText - text: "We know this isn't you..." - color: simplifiedUI.colors.text.black - size: 48 - height: paintedHeight - wrapMode: Text.Wrap - anchors.top: parent.top - anchors.topMargin: 120 - anchors.left: parent.left - anchors.right: parent.right - } - - HifiStylesUit.RalewayRegular { - id: descriptionText - anchors.top: headerText.bottom - anchors.topMargin: 10 - anchors.left: parent.left - anchors.right: parent.right - height: paintedHeight - text: "but we've given you this temporary avatar to use " + - "for today. If you see this avatar in-world, walk up and " + - "say hello to other new users!

" + - "We want you to be you so we've built an Avatar Creator " + - "App that's as easy as taking a selfie and picking your " + - "outfits! Available now on iOS and Android." - color: simplifiedUI.colors.text.black - size: 22 - wrapMode: Text.Wrap - } - - Item { - id: qrAndInstructionsContainer - anchors.top: descriptionText.bottom - anchors.topMargin: 50 - anchors.left: parent.left - anchors.right: parent.right - height: avatarAppQRCodeImage.height - - Image { - id: avatarAppQRCodeImage - source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/qrCode.jpg" - height: 190 - width: 190 - mipmap: true - fillMode: Image.PreserveAspectFit - } - - HifiStylesUit.RalewayBold { - id: instructionText - anchors.top: avatarAppQRCodeImage.top - anchors.bottom: avatarAppQRCodeImage.bottom - anchors.left: avatarAppQRCodeImage.right - anchors.leftMargin: 30 - anchors.right: parent.right - text: "Use your mobile phone to scan this QR code." - color: simplifiedUI.colors.text.black - size: 22 - wrapMode: Text.Wrap - } - } - - HifiStylesUit.RalewayBold { - anchors.top: qrAndInstructionsContainer.bottom - anchors.topMargin: 50 - anchors.left: parent.left - anchors.right: parent.right - horizontalAlignment: Text.AlignLeft - text: "Continue >" - color: simplifiedUI.colors.text.lightBlue - opacity: continueMouseArea.containsMouse ? 1.0 : 0.7 - size: 36 - height: paintedHeight - z: 1 - - MouseArea { - id: continueMouseArea - hoverEnabled: true - anchors.fill: parent - - onClicked: { - Tablet.playSound(TabletEnums.ButtonClick); - tempAvatarPageContainer.visible = false; - Settings.setValue("simplifiedUI/closedAvatarPageOfInitialLaunchWindow", true); - controlsContainer.visible = true; - } - } - } - } - } - } - - Flickable { - id: controlsContainer - visible: false - anchors.fill: parent - clip: true - contentWidth: parent.width - contentHeight: contentItem.childrenRect.height - - HifiStylesUit.RalewayRegular { - id: controlsDescriptionText - text: "These are your avatar controls to interact with and move around in your new HQ." - anchors.top: parent.top - anchors.topMargin: 100 - anchors.horizontalCenter: parent.horizontalCenter - horizontalAlignment: Text.AlignHCenter - height: paintedHeight - width: 850 - color: simplifiedUI.colors.text.black - size: 36 - wrapMode: Text.Wrap - } - - GridLayout { - id: controlsPageGrid - anchors.top: controlsDescriptionText.bottom - anchors.topMargin: 60 - anchors.horizontalCenter: parent.horizontalCenter - width: controlsDescriptionText.width - columnSpacing: 50 - rowSpacing: 40 - columns: 2 - rows: 2 - - Image { - Layout.preferredWidth: 360 - Layout.preferredHeight: 225 - id: walkingControls - source: "images/walkingControls.png" - } - - Image { - Layout.preferredWidth: 360 - Layout.preferredHeight: 200 - id: mouseControls - source: "images/mouseControls.png" - } - - Image { - Layout.preferredWidth: 240 - Layout.preferredHeight: 160 - Layout.alignment: Qt.AlignHCenter - id: runJumpControls - source: "images/runJumpControls.png" - } - - Image { - Layout.preferredWidth: 160 - Layout.preferredHeight: 100 - Layout.alignment: Qt.AlignHCenter - id: cameraControls - source: "images/cameraControls.png" - } - } - - HifiStylesUit.RalewayBold { - id: iHaveAGoodGrip - anchors.top: controlsPageGrid.bottom - anchors.horizontalCenter: parent.horizontalCenter - anchors.topMargin: 50 - text: "I've got a good grip on the controls." - width: 650 - height: paintedHeight - color: simplifiedUI.colors.text.lightBlue - opacity: goodGripMouseArea.containsMouse ? 1.0 : 0.7 - size: 36 - wrapMode: Text.Wrap - - MouseArea { - id: goodGripMouseArea - hoverEnabled: true - anchors.fill: parent - - onClicked: { - Tablet.playSound(TabletEnums.ButtonClick); - sendToScript({ - "source": "InitialLaunchWindow.qml", - "method": "closeInitialLaunchWindow" - }); - } - } - } - - HifiStylesUit.RalewayBold { - anchors.top: iHaveAGoodGrip.bottom - anchors.topMargin: 50 - anchors.left: parent.left - anchors.leftMargin: 50 - text: "Learn more about our controls." - width: 200 - height: paintedHeight - color: simplifiedUI.colors.text.lightBlue - opacity: learnMoreAboutControlsMouseArea.containsMouse ? 1.0 : 0.7 - size: 14 - wrapMode: Text.Wrap - - MouseArea { - id: learnMoreAboutControlsMouseArea - hoverEnabled: true - anchors.fill: parent - - onClicked: { - Tablet.playSound(TabletEnums.ButtonClick); - Qt.openUrlExternally("https://www.highfidelity.com/knowledge/get-around"); - } - } - } - } - - SimplifiedControls.VerticalScrollBar { - parent: controlsContainer.visible ? controlsContainer : tempAvatarPageContainer - z: 2 - } - signal sendToScript(var message); } diff --git a/scripts/simplifiedUI/ui/simplifiedFTUE/SecondLaunchWindow.qml b/scripts/simplifiedUI/ui/simplifiedFTUE/SecondLaunchWindow.qml index 258249f567..24ddab0884 100644 --- a/scripts/simplifiedUI/ui/simplifiedFTUE/SecondLaunchWindow.qml +++ b/scripts/simplifiedUI/ui/simplifiedFTUE/SecondLaunchWindow.qml @@ -47,8 +47,10 @@ Rectangle { Flickable { id: tempAvatarPageContainer - visible: true - anchors.fill: parent + anchors.top: parent.top + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: continueLink.top clip: true contentWidth: parent.width contentHeight: tempAvatarPageGrid.height @@ -133,40 +135,39 @@ Rectangle { wrapMode: Text.Wrap } } - - HifiStylesUit.RalewayBold { - anchors.top: qrAndInstructionsContainer.bottom - anchors.topMargin: 150 - anchors.left: parent.left - anchors.right: parent.right - horizontalAlignment: Text.AlignLeft - text: "Continue >" - color: simplifiedUI.colors.text.lightBlue - opacity: continueMouseArea.containsMouse ? 1.0 : 0.7 - size: 36 - height: paintedHeight - z: 1 - - MouseArea { - id: continueMouseArea - hoverEnabled: true - anchors.fill: parent - - onClicked: { - Tablet.playSound(TabletEnums.ButtonClick); - sendToScript({ - "source": "SecondLaunchWindow.qml", - "method": "closeSecondLaunchWindow" - }); - } - } - } } } SimplifiedControls.VerticalScrollBar { parent: tempAvatarPageContainer - z: 2 + } + } + + HifiStylesUit.RalewayBold { + id: continueLink + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.right: parent.right + height: paintedHeight + 24 + horizontalAlignment: Text.AlignLeft + text: "Continue >" + color: simplifiedUI.colors.text.lightBlue + opacity: continueMouseArea.containsMouse ? 1.0 : 0.7 + size: 36 + z: 1 + + MouseArea { + id: continueMouseArea + hoverEnabled: true + anchors.fill: parent + + onClicked: { + Tablet.playSound(TabletEnums.ButtonClick); + sendToScript({ + "source": "SecondLaunchWindow.qml", + "method": "closeSecondLaunchWindow" + }); + } } } diff --git a/scripts/simplifiedUI/ui/simplifiedUI.js b/scripts/simplifiedUI/ui/simplifiedUI.js index 5d7661cca2..7399c04604 100644 --- a/scripts/simplifiedUI/ui/simplifiedUI.js +++ b/scripts/simplifiedUI/ui/simplifiedUI.js @@ -362,8 +362,6 @@ var TOP_BAR_HEIGHT_PX = 48; var INITIAL_LAUNCH_QML_PATH = Script.resolvePath("./simplifiedFTUE/InitialLaunchWindow.qml"); var INITIAL_LAUNCH_WINDOW_TITLE = "Initial Launch"; var INITIAL_LAUNCH_PRESENTATION_MODE = Desktop.PresentationMode.NATIVE; -var INITIAL_LAUNCH_WIDTH_PX = Window.innerWidth; -var INITIAL_LAUNCH_HEIGHT_PX = Window.innerHeight - TOP_BAR_HEIGHT_PX; var INITIAL_WINDOW_FLAGS = 0x00000001 | // Qt::Window 0x00000800 | // Qt::FramelessWindowHint 0x40000000; // Qt::NoDropShadowWindowHint @@ -377,12 +375,12 @@ function displayInitialLaunchWindow() { title: INITIAL_LAUNCH_WINDOW_TITLE, presentationMode: INITIAL_LAUNCH_PRESENTATION_MODE, size: { - x: INITIAL_LAUNCH_WIDTH_PX, - y: INITIAL_LAUNCH_HEIGHT_PX + x: Window.innerWidth, + y: Window.innerHeight + TOP_BAR_HEIGHT_PX }, position: { x: Window.x, - y: Window.y + TOP_BAR_HEIGHT_PX + y: Window.y }, overrideFlags: INITIAL_WINDOW_FLAGS }); @@ -395,8 +393,6 @@ function displayInitialLaunchWindow() { var SECOND_LAUNCH_QML_PATH = Script.resolvePath("simplifiedFTUE/SecondLaunchWindow.qml"); var SECOND_LAUNCH_WINDOW_TITLE = "Second Launch"; var SECOND_LAUNCH_PRESENTATION_MODE = Desktop.PresentationMode.NATIVE; -var SECOND_LAUNCH_WIDTH_PX = Window.innerWidth; -var SECOND_LAUNCH_HEIGHT_PX = Window.innerHeight - TOP_BAR_HEIGHT_PX; var SECOND_WINDOW_FLAGS = 0x00000001 | // Qt::Window 0x00000800 | // Qt::FramelessWindowHint 0x40000000; // Qt::NoDropShadowWindowHint @@ -410,12 +406,12 @@ function displaySecondLaunchWindow() { title: SECOND_LAUNCH_WINDOW_TITLE, presentationMode: SECOND_LAUNCH_PRESENTATION_MODE, size: { - x: SECOND_LAUNCH_WIDTH_PX, - y: SECOND_LAUNCH_HEIGHT_PX + x: Window.innerWidth, + y: Window.innerHeight + TOP_BAR_HEIGHT_PX }, position: { x: Window.x, - y: Window.y + TOP_BAR_HEIGHT_PX + y: Window.y }, overrideFlags: SECOND_WINDOW_FLAGS }); @@ -659,22 +655,22 @@ function onGeometryChanged(rect) { } if (initialLaunchWindow) { initialLaunchWindow.size = { - "x": rect.width, - "y": rect.height + "x": Window.innerWidth, + "y": Window.innerHeight + TOP_BAR_HEIGHT_PX }; initialLaunchWindow.position = { "x": rect.x, - "y": rect.y + TOP_BAR_HEIGHT_PX + "y": rect.y }; } if (secondLaunchWindow) { secondLaunchWindow.size = { - "x": rect.width, - "y": rect.height + "x": Window.innerWidth, + "y": Window.innerHeight + TOP_BAR_HEIGHT_PX }; secondLaunchWindow.position = { "x": rect.x, - "y": rect.y + TOP_BAR_HEIGHT_PX + "y": rect.y }; } }