Ready for CR Thank you Zach

interface/resources/qml/hifi/simplifiedUI/topBar/SimplifiedTopBar.qml

@@ -128,9 +128,6 @@ 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.
 
-                // FOR TESTING__________REMOVE
-                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...

scripts/simplifiedUI/ui/simplifiedFTUE/InitialLaunchWindow.qml

@@ -41,7 +41,6 @@ Rectangle {
         anchors.left: parent.left
         anchors.top: parent.top
         source: "images/defaultTopLeft.png"
-        z: 1
     }
 
     Image {
@@ -51,54 +50,49 @@ Rectangle {
         anchors.right: parent.right
         anchors.bottom: parent.bottom
         source: "images/defaultBottomRight.png"
-        z: 1
     }
 
-    Item {
+    Flickable {
         id: tempAvatarPageContainer
         visible: true
-
-        Flickable {
         anchors.fill: parent
-            anchors.leftMargin: 50
-            anchors.topMargin: 50
-            anchors.rightMargin: 100
         clip: true
         contentWidth: parent.width
-            contentHeight: childrenRect.height
+        contentHeight: tempAvatarPageGrid.height
 
         GridLayout {
             id: tempAvatarPageGrid
-                anchors.fill: parent
+            width: parent.width
-                columns: landscapeOrientation ? 2 : 1
+            columns: 2
-                rows: landscapeOrientation ? 1 : 2
+            rows: 1
-
-                Item {
-                    id: tempAvatarImageContainer
-                    Layout.preferredWidth: tempAvatarImage.width
-                    Layout.preferredHeight: tempAvatarImage.height
 
             Image {
-                        id: tempAvatarImage
+                Layout.preferredWidth: 428
-                        width: landscapeOrientation ? 428 : 320
+                Layout.minimumHeight: 240
-                        height: landscapeOrientation ? 800 : 598
+                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.preferredWidth: 680
+                Layout.minimumWidth: 300
+                Layout.maximumWidth: 1680
+                Layout.fillWidth: true
                 Layout.preferredHeight: childrenRect.height
-                    Layout.topMargin: landscapeOrientation ? 130 : 0
 
                 HifiStylesUit.RalewayBold {
                     id: headerText
                     text: "We know this isn't you..."
                     color: simplifiedUI.colors.text.black
                     size: 48
-                        wrapMode: Text.WordWrap
+                    height: paintedHeight
+                    wrapMode: Text.Wrap
+                    anchors.top: parent.top
+                    anchors.topMargin: 120
                     anchors.left: parent.left
                     anchors.right: parent.right
                 }
@@ -107,26 +101,27 @@ Rectangle {
                     id: descriptionText
                     anchors.top: headerText.bottom
                     anchors.topMargin: 10
-                        text: "but, we've given you this <b>temporary avatar</b> to use
-                        for today. If you see this avatar in-world, walk up and
-                        say hello to other new users!<br></br><br></br>
-                        <b>We want you to be you</b> 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 Platforms."
-                        color: simplifiedUI.colors.text.black
-                        size: 22
                     anchors.left: parent.left
                     anchors.right: parent.right
-                        wrapMode: Text.WordWrap
+                    height: paintedHeight
+                    text: "but we've given you this <b>temporary avatar</b> to use " +
+                        "for today. If you see this avatar in-world, walk up and " +
+                        "say hello to other new users!<br><br>" +
+                        "<b>We want you to be you</b> 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
-                        height: avatarAppQRCodeImage.height
+                    anchors.topMargin: 50
                     anchors.left: parent.left
                     anchors.right: parent.right
-                        anchors.topMargin: 50
+                    height: avatarAppQRCodeImage.height
 
                     Image {
                         id: avatarAppQRCodeImage
@@ -139,15 +134,15 @@ Rectangle {
 
                     HifiStylesUit.RalewayBold {
                         id: instructionText
-                            anchors.left: avatarAppQRCodeImage.right
                         anchors.top: avatarAppQRCodeImage.top
                         anchors.bottom: avatarAppQRCodeImage.bottom
-                            anchors.right: parent.right
+                        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.WordWrap
+                        wrapMode: Text.Wrap
                     }
                 }
 
@@ -161,8 +156,8 @@ Rectangle {
                     color: simplifiedUI.colors.text.lightBlue
                     opacity: continueMouseArea.containsMouse ? 1.0 : 0.7
                     size: 36
+                    height: paintedHeight
                     z: 1
-                        wrapMode: Text.WordWrap
 
                     MouseArea {
                         id: continueMouseArea
@@ -181,43 +176,34 @@ Rectangle {
         }
     }
 
-        SimplifiedControls.VerticalScrollBar {
+    Flickable {
-            parent: tempAvatarPageContainer
-        }
-    }
-
-    Item {
         id: controlsContainer
         visible: false
         anchors.fill: parent
-
-        Flickable {
-            anchors.fill: parent
         clip: true
         contentWidth: parent.width
-            contentHeight: childrenRect.height
+        contentHeight: contentItem.childrenRect.height
 
         HifiStylesUit.RalewayRegular {
             id: controlsDescriptionText
-                text: "These are your avatar controls to <br></br>
+            text: "These are your avatar controls to <b>interact with and move around in your new HQ.</b>"
-                    <b>interact with and move around in your new HQ.</b>"
             anchors.top: parent.top
             anchors.topMargin: 100
             anchors.horizontalCenter: parent.horizontalCenter
             horizontalAlignment: Text.AlignHCenter
-                height: 100
+            height: paintedHeight
             width: 850
             color: simplifiedUI.colors.text.black
             size: 36
-                wrapMode: Text.WordWrap
+            wrapMode: Text.Wrap
         }
 
         GridLayout {
             id: controlsPageGrid
             anchors.top: controlsDescriptionText.bottom
             anchors.topMargin: 60
-                anchors.bottomMargin: 80
             anchors.horizontalCenter: parent.horizontalCenter
+            width: controlsDescriptionText.width
             columnSpacing: 50
             rowSpacing: 40
             columns: 2
@@ -255,41 +241,17 @@ Rectangle {
         }
 
         HifiStylesUit.RalewayBold {
-                anchors.bottom: parent.bottom
+            id: iHaveAGoodGrip
-                anchors.left: parent.left
-                anchors.leftMargin: 50
-                anchors.bottomMargin: 50
-                text: "Learn more about our controls."
-                width: 200
-                height: 25
-                color: simplifiedUI.colors.text.lightBlue
-                opacity: learnMoreAboutControlsMouseArea.containsMouse ? 1.0 : 0.7
-                size: 14
-                wrapMode: Text.WordWrap
-
-                MouseArea {
-                    id: learnMoreAboutControlsMouseArea
-                    hoverEnabled: true
-                    anchors.fill: parent
-
-                    onClicked: {
-                        Tablet.playSound(TabletEnums.ButtonClick);
-                        Qt.openUrlExternally("https://www.highfidelity.com/knowledge/get-around");
-                    }
-                }
-            }
-
-            HifiStylesUit.RalewayBold {
             anchors.top: controlsPageGrid.bottom
             anchors.horizontalCenter: parent.horizontalCenter
             anchors.topMargin: 50
             text: "I've got a good grip on the controls."
             width: 650
-                height: 60
+            height: paintedHeight
             color: simplifiedUI.colors.text.lightBlue
             opacity: goodGripMouseArea.containsMouse ? 1.0 : 0.7
             size: 36
-                wrapMode: Text.WordWrap
+            wrapMode: Text.Wrap
 
             MouseArea {
                 id: goodGripMouseArea
@@ -306,11 +268,35 @@ Rectangle {
             }
         }
         
+        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
+        parent: controlsContainer.visible ? controlsContainer : tempAvatarPageContainer
-        }
+        z: 2
     }
 
     signal sendToScript(var message);

scripts/simplifiedUI/ui/simplifiedFTUE/SecondLaunchWindow.qml

@@ -20,7 +20,6 @@ Rectangle {
     id: root
     color: simplifiedUI.colors.white
     anchors.fill: parent
-    property bool landscapeOrientation: root.width > root.height
 
     SimplifiedConstants.SimplifiedConstants {
         id: simplifiedUI
@@ -46,86 +45,92 @@ Rectangle {
         z: 1
     }
 
-    Item {
+     Flickable {
         id: tempAvatarPageContainer
+        visible: true
+        anchors.fill: parent
+        clip: true
+        contentWidth: parent.width
+        contentHeight: tempAvatarPageGrid.height
 
         GridLayout {
             id: tempAvatarPageGrid
-            anchors.fill: parent
+            width: parent.width
-            anchors.leftMargin: 50
+            columns: 2
-            anchors.bottomMargin: 50
+            rows: 1
-            anchors.rightMargin: 50
-            columns: landscapeOrientation ? 2 : 1
-            rows: landscapeOrientation ? 1 : 2
-
-            Item {
-                id: heroImageContainer
-                Layout.preferredWidth: heroImage.width
-                Layout.preferredHeight: heroImage.height
 
             Image {
-                    id: heroImage
+                Layout.preferredWidth: 428
-                    width: 428
+                Layout.minimumHeight: 240
-                    height: 800
+                Layout.maximumHeight: 800
+                Layout.fillHeight: true
                 source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/hero.png"
-                }
+                mipmap: true
+                fillMode: Image.PreserveAspectFit
             }
 
             Item {
                 id: textAndQRContainer
-                Layout.preferredWidth: 720
+                Layout.minimumWidth: 300
+                Layout.maximumWidth: 1680
+                Layout.fillWidth: true
                 Layout.preferredHeight: childrenRect.height
-                Layout.topMargin: 150
 
                 HifiStylesUit.RalewayBold {
                     id: headerText
                     text: "Stand out from the crowd!"
                     color: simplifiedUI.colors.text.black
                     size: 48
-                    wrapMode: Text.WordWrap
+                    height: paintedHeight
+                    wrapMode: Text.Wrap
+                    anchors.top: parent.top
+                    anchors.topMargin: 120
                     anchors.left: parent.left
                     anchors.right: parent.right
                 }
 
                 HifiStylesUit.RalewayRegular {
                     id: descriptionText
-                    width: 600
                     anchors.top: headerText.bottom
                     anchors.topMargin: 10
-                    text: "You can create and upload custom avatars from our Avatar Creator App. It's as easy as taking a selfie. Available now on iOS and Android Platforms."
+                    anchors.left: parent.left
+                    anchors.right: parent.right
+                    height: paintedHeight
+                    text: "You can create and upload custom avatars from our Avatar Creator App. " +
+                        "It's as easy as taking a selfie. Available now on iOS and Android Platforms."
                     color: simplifiedUI.colors.text.black
                     size: 24
-                    anchors.left: parent.left
+                    wrapMode: Text.Wrap
-                    wrapMode: Text.WordWrap
                 }
 
                 Item {
                     id: qrAndInstructionsContainer
                     anchors.top: descriptionText.bottom
+                    anchors.topMargin: 50
                     anchors.left: parent.left
+                    anchors.right: parent.right
                     height: avatarAppQRCodeImage.height
-                    width: parent.width
-                    anchors.topMargin: 150
 
                     Image {
                         id: avatarAppQRCodeImage
-                        anchors.left: parent.left
                         source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/qrCode.jpg"
-                        height: 180
+                        height: 190
-                        width: 180
+                        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: 20
+                        anchors.leftMargin: 30
-                        anchors.verticalCenter: avatarAppQRCodeImage.verticalCenter
                         anchors.right: parent.right
-                        anchors.top: avatarAppQRCodeImage.bottom
                         text: "Use your mobile phone to scan this QR code."
                         color: simplifiedUI.colors.text.black
                         size: 24
-                        wrapMode: Text.WordWrap
+                        wrapMode: Text.Wrap
                     }
                 }
 
@@ -139,8 +144,8 @@ Rectangle {
                     color: simplifiedUI.colors.text.lightBlue
                     opacity: continueMouseArea.containsMouse ? 1.0 : 0.7
                     size: 36
+                    height: paintedHeight
                     z: 1
-                    wrapMode: Text.WordWrap
 
                     MouseArea {
                         id: continueMouseArea
@@ -160,7 +165,8 @@ Rectangle {
         }
 
         SimplifiedControls.VerticalScrollBar {
-            parent: root
+            parent: tempAvatarPageContainer
+            z: 2
         }
     }
 

scripts/simplifiedUI/ui/simplifiedUI.js

@@ -363,9 +363,8 @@ var INITIAL_LAUNCH_QML_PATH = Script.resolvePath("./simplifiedFTUE/InitialLaunch
 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_LAUNCH_HEIGHT_PX = Window.innerHeight - TOP_BAR_HEIGHT_PX;
 var INITIAL_WINDOW_FLAGS = 0x00000001 | // Qt::Window
-0x00000008 | // Qt::Popup
 0x00000800 | // Qt::FramelessWindowHint
 0x40000000; // Qt::NoDropShadowWindowHint
 var initialLaunchWindow = false;
@@ -387,7 +386,7 @@ function displayInitialLaunchWindow() {
         },
         position: {
             x: Window.x,
-            y: Window.y
+            y: Window.y + TOP_BAR_HEIGHT_PX
         },
         overrideFlags: INITIAL_WINDOW_FLAGS
     });
@@ -401,9 +400,8 @@ var SECOND_LAUNCH_QML_PATH = Script.resolvePath("simplifiedFTUE/SecondLaunchWind
 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_LAUNCH_HEIGHT_PX = Window.innerHeight - TOP_BAR_HEIGHT_PX;
 var SECOND_WINDOW_FLAGS = 0x00000001 | // Qt::Window
-0x00000008 | // Qt::Popup
 0x00000800 | // Qt::FramelessWindowHint
 0x40000000; // Qt::NoDropShadowWindowHint
 var secondLaunchWindow = false;
@@ -425,7 +423,7 @@ function displaySecondLaunchWindow() {
         },
         position: {
             x: Window.x,
-            y: Window.y
+            y: Window.y + TOP_BAR_HEIGHT_PX
         },
         overrideFlags: SECOND_WINDOW_FLAGS
     });
@@ -668,28 +666,24 @@ function onGeometryChanged(rect) {
         };
     }
     if (initialLaunchWindow) {
-        print("GEOMETRY CHANGED, INITIAL WINDOW. rect.width: ", rect.width, " AND rect.height: ", rect.height, " AND rect.x: ", rect.x, " AND rect.y: ", rect.y);
         initialLaunchWindow.size = {
             "x": rect.width,
             "y": rect.height
         };
         initialLaunchWindow.position = {
             "x": rect.x,
-            "y": rect.y
+            "y": rect.y + TOP_BAR_HEIGHT_PX
         };
-        print("NOW THE INITIAL WINDOW size IS: ", JSON.stringify(initialLaunchWindow.size), " AND position IS: ", JSON.stringify(initialLaunchWindow.position));
     }
     if (secondLaunchWindow) {
-        print("GEOMETRY CHANGED, SECOND WINDOW. rect.width: ", rect.width, " AND rect.height: ", rect.height, " AND rect.x: ", rect.x, " AND rect.y: ", rect.y);
         secondLaunchWindow.size = {
             "x": rect.width,
             "y": rect.height
         };
         secondLaunchWindow.position = {
             "x": rect.x,
-            "y": rect.y
+            "y": rect.y + TOP_BAR_HEIGHT_PX
         };
-        print("NOW THE SECOND WINDOW size IS: ", JSON.stringify(secondLaunchWindow.size), " AND position IS: ", JSON.stringify(secondLaunchWindow.position));
     }
 }