From d9046a1982c1b760edf4e3a3e66a9390e9caa1a6 Mon Sep 17 00:00:00 2001
From: Dante Ruiz <dante@highfidelity.io>
Date: Fri, 24 Mar 2017 23:54:54 +0100
Subject: [PATCH] goto on the tablet
---
interface/resources/qml/hifi/Card.qml | 84 +++++------
.../qml/hifi/tablet/TabletAddressDialog.qml | 26 ++--
.../qml/hifi/tablet/TabletStoryCard.qml | 132 ++++++++++++++++++
3 files changed, 190 insertions(+), 52 deletions(-)
create mode 100644 interface/resources/qml/hifi/tablet/TabletStoryCard.qml
diff --git a/interface/resources/qml/hifi/Card.qml b/interface/resources/qml/hifi/Card.qml
index 781149c1b3..01a5441380 100644
--- a/interface/resources/qml/hifi/Card.qml
+++ b/interface/resources/qml/hifi/Card.qml
@@ -129,7 +129,7 @@ Rectangle {
property int dropSamples: 9;
property int dropSpread: 0;
DropShadow {
- visible: showPlace && (desktop ? desktop.gradientsSupported : false)
+ visible: true;//showPlace && (desktop ? desktop.gradientsSupported : false)
source: place;
anchors.fill: place;
horizontalOffset: dropHorizontalOffset;
@@ -139,12 +139,12 @@ Rectangle {
color: hifi.colors.black;
spread: dropSpread;
}
- RalewaySemiBold {
+ RalewayLight {
id: place;
visible: showPlace;
text: placeName;
color: hifi.colors.white;
- size: textSize;
+ size: 38;
elide: Text.ElideRight; // requires constrained width
anchors {
top: parent.top;
@@ -154,48 +154,44 @@ Rectangle {
}
}
- Rectangle {
- radius: 20
- color: "transparent"
- Row {
- FiraSansRegular {
- id: users;
- visible: isConcurrency;
- text: onlineUsers;
- size: textSize;
- color: messageColor;
- anchors.verticalCenter: message.verticalCenter;
- }
- Image {
- id: icon;
- source: "../../images/snap-icon.svg"
- width: 40;
- height: 40;
- visible: action === 'snapshot';
- }
- RalewayRegular {
- id: message;
- text: isConcurrency ? ((onlineUsers === 1) ? "person" : "people") : (drillDownToPlace ? "snapshots" : ("by " + userName));
- size: textSizeSmall;
- color: messageColor;
- elide: Text.ElideRight; // requires a width to be specified`
- width: root.width - textPadding
- - (users.visible ? users.width + parent.spacing : 0)
- - (icon.visible ? icon.width + parent.spacing : 0)
- - (actionIcon.width + (2 * smallMargin));
- anchors {
- bottom: parent.bottom;
- bottomMargin: parent.spacing;
- }
- }
- spacing: textPadding;
- height: messageHeight;
+ Row {
+ FiraSansRegular {
+ id: users;
+ visible: isConcurrency;
+ text: onlineUsers;
+ size: textSize;
+ color: messageColor;
+ anchors.verticalCenter: message.verticalCenter;
+ }
+ Image {
+ id: icon;
+ source: "../../images/snap-icon.svg"
+ width: 40;
+ height: 40;
+ visible: action === 'snapshot';
+ }
+ RalewayRegular {
+ id: message;
+ text: isConcurrency ? ((onlineUsers === 1) ? "person" : "people") : (drillDownToPlace ? "snapshots" : ("by " + userName));
+ size: textSizeSmall;
+ color: messageColor;
+ elide: Text.ElideRight; // requires a width to be specified`
+ width: root.width - textPadding
+ - (users.visible ? users.width + parent.spacing : 0)
+ - (icon.visible ? icon.width + parent.spacing : 0)
+ - (actionIcon.width + (2 * smallMargin));
anchors {
bottom: parent.bottom;
- left: parent.left;
- leftMargin: textPadding;
+ bottomMargin: parent.spacing;
}
}
+ spacing: textPadding;
+ height: messageHeight;
+ anchors {
+ bottom: parent.bottom;
+ left: parent.left;
+ leftMargin: textPadding;
+ }
}
// These two can be supplied to provide hover behavior.
// For example, AddressBarDialog provides functions that set the current list view item
@@ -221,6 +217,12 @@ Rectangle {
margins: smallMargin;
}
}
+ DropShadow {
+ anchors.fill: actionIcon
+ radius: 8.0
+ color: "#80000000"
+ source: actionIcon
+ }
MouseArea {
id: messageArea;
width: parent.width;
diff --git a/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml b/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml
index 9e68d3435a..bfecf5457b 100644
--- a/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml
+++ b/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml
@@ -1,7 +1,7 @@
//
// TabletAddressDialog.qml
//
-// Created by Dante Ruiz on 2016/07/16
+// Created by Dante Ruiz on 2017/03/16
// Copyright 2015 High Fidelity, Inc.
//
// Distributed under the Apache License, Version 2.0.
@@ -9,7 +9,8 @@
//
import Hifi 1.0
-import QtQuick 2.4
+import QtQuick 2.5
+import QtQuick.Controls 1.4
import QtGraphicalEffects 1.0
import "../../controls"
import "../../styles"
@@ -19,11 +20,11 @@ import "../toolbars"
import "../../styles-uit" as HifiStyles
import "../../controls-uit" as HifiControls
-Item {
+StackView {
id: root
HifiConstants { id: hifi }
HifiStyles.HifiConstants { id: hifiStyleConstants }
-
+ initialItem: addressBarDialog
width: parent.width
height: parent.height
@@ -32,7 +33,7 @@ Item {
property int cardHeight: 320;
property string metaverseBase: addressBarDialog.metaverseServerUrl + "/api/v1/";
-
+ Component { id: tabletStoryCard; TabletStoryCard {} }
Component.onCompleted: {
fillDestinations();
updateLocationText();
@@ -42,7 +43,7 @@ Item {
Component.onDestruction: {
root.parentChanged.disconnect(center);
}
-
+
function center() {
// Explicitly center in order to avoid warnings at shutdown
anchors.centerIn = parent;
@@ -54,6 +55,9 @@ Item {
}
function goCard(targetString) {
if (0 !== targetString.indexOf('hifi://')) {
+ var card = tabletStoryCard.createObject();
+ card.setUrl(addressBarDialog.metaverseServerUrl + targetString);
+ root.push(card);
return;
}
addressLine.text = targetString;
@@ -86,7 +90,7 @@ Item {
id: navBar
width: 480
height: 70
- color: hifi.colors.white
+ color: hifiStyleConstants.colors.white
anchors {
top: parent.top
right: parent.right
@@ -194,7 +198,7 @@ Item {
anchors.fill: parent
onClicked: {
isCursorVisible = true;
- //parent.cursorVisible = true;
+ parent.cursorVisible = true;
parent.forceActiveFocus();
addressBarDialog.keyboardEnabled = HMD.active
tabletRoot.playButtonClickSound();
@@ -204,14 +208,14 @@ Item {
Rectangle {
anchors.fill: addressLine
- color: hifiStyleConstants.colors.baseGray
+ color: hifiStyleConstants.colors.lightGray
opacity: 0.1
}
}
Rectangle {
id: topBar
height: 37
- color: hifi.colors.white
+ color: hifiStyleConstants.colors.white
anchors.right: parent.right
anchors.rightMargin: 0
@@ -260,7 +264,7 @@ Item {
Rectangle {
id: bgMain
- color: hifi.colors.white
+ color: hifiStyleConstants.colors.white
anchors.bottom: parent.keyboardEnabled ? keyboard.top : parent.bottom
anchors.bottomMargin: 0
anchors.right: parent.right
diff --git a/interface/resources/qml/hifi/tablet/TabletStoryCard.qml b/interface/resources/qml/hifi/tablet/TabletStoryCard.qml
new file mode 100644
index 0000000000..ea6a23cb10
--- /dev/null
+++ b/interface/resources/qml/hifi/tablet/TabletStoryCard.qml
@@ -0,0 +1,132 @@
+//
+// TabletAddressDialog.qml
+//
+// Created by Dante Ruiz on 2017/04/24
+// 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 QtGraphicalEffects 1.0
+import "../../controls"
+import "../../styles"
+import "../../windows"
+import "../"
+import "../toolbars"
+import "../../styles-uit" as HifiStyles
+import "../../controls-uit" as HifiControls
+
+
+Rectangle {
+ id: cardRoot
+ HifiStyles.HifiConstants { id: hifi }
+ width: parent.width
+ height: parent.height
+ property string address: ""
+
+ function setUrl(url) {
+ cardRoot.address = url;
+ webview.url = url;
+ }
+
+ function goBack() {
+ }
+
+ function visit() {
+ }
+
+ Rectangle {
+ id: header
+ anchors {
+ left: parent.left
+ right: parent.right
+ top: parent.top
+ }
+
+ width: parent.width
+ height: 50
+ color: hifi.colors.white
+
+ Row {
+ anchors.fill: parent
+ spacing: 80
+
+ Item {
+ id: backButton
+ anchors {
+ top: parent.top
+ left: parent.left
+ leftMargin: 100
+ }
+ height: parent.height
+ width: parent.height
+
+ HifiStyles.FiraSansSemiBold {
+ text: "BACK"
+ elide: Text.ElideRight
+ anchors.fill: parent
+ size: 16
+
+ verticalAlignment: Text.AlignVCenter
+ horizontalAlignment: Text.AlignHCenter
+
+ color: hifi.colors.lightGray
+
+ MouseArea {
+ id: backButtonMouseArea
+ anchors.fill: parent
+ hoverEnabled: enabled
+
+ onClicked: {
+ webview.goBack();
+ }
+ }
+ }
+ }
+
+ Item {
+ id: closeButton
+ anchors {
+ top: parent.top
+ right: parent.right
+ rightMargin: 100
+ }
+ height: parent.height
+ width: parent.height
+
+ HifiStyles.FiraSansSemiBold {
+ text: "CLOSE"
+ elide: Text.ElideRight
+ anchors.fill: parent
+ size: 16
+
+ verticalAlignment: Text.AlignVCenter
+ horizontalAlignment: Text.AlignHCenter
+
+ color: hifi.colors.lightGray
+
+ MouseArea {
+ id: closeButtonMouseArea
+ anchors.fill: parent
+ hoverEnabled: enabled
+
+ onClicked: root.pop();
+ }
+ }
+ }
+ }
+ }
+
+ HifiControls.WebView {
+ id: webview
+ anchors {
+ top: header.bottom
+ right: parent.right
+ left: parent.left
+ bottom: parent.bottom
+ }
+ }
+}