Mirrors/overte-thingvellir
3
0
Fork 0
mirror of https://thingvellir.net/git/overte synced 2025-03-27 23:52:03 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Controls screen done

Browse source
This commit is contained in:
Zach Fox 2019-10-07 19:52:22 -04:00
parent 643dd21f86
commit a23bee19e8
4 changed files with 325 additions and 294 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
interface/resources/qml/hifi/simplifiedUI/topBar/SimplifiedTopBar.qml
View file

@ -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...

524
scripts/simplifiedUI/ui/simplifiedFTUE/InitialLaunchWindow.qml
View file

@ -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 <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
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 <b>interact with and move around in your new HQ.</b>"
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 <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
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 <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: 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);
}

63
scripts/simplifiedUI/ui/simplifiedFTUE/SecondLaunchWindow.qml
View file

@ -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"
});
}
}
}

28
scripts/simplifiedUI/ui/simplifiedUI.js
View file

@ -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
};
}
}