diff --git a/interface/resources/fonts/Cairo-SemiBold.ttf b/interface/resources/fonts/Cairo-SemiBold.ttf new file mode 100755 index 0000000000..b4dc50023d Binary files /dev/null and b/interface/resources/fonts/Cairo-SemiBold.ttf differ diff --git a/interface/resources/icons/+android/hand.svg b/interface/resources/icons/+android/hand.svg new file mode 100644 index 0000000000..cc16d055a8 --- /dev/null +++ b/interface/resources/icons/+android/hand.svg @@ -0,0 +1,3 @@ + + + diff --git a/interface/resources/qml/+android/Web3DOverlay.qml b/interface/resources/qml/+android/Web3DOverlay.qml index 6de099828b..d7b8306d6c 100644 --- a/interface/resources/qml/+android/Web3DOverlay.qml +++ b/interface/resources/qml/+android/Web3DOverlay.qml @@ -9,28 +9,68 @@ // import QtQuick 2.5 - +import QtGraphicalEffects 1.0 Item { property string url + RadialGradient { + anchors.fill: parent + gradient: Gradient { + GradientStop { position: 0.0; color: "#262626" } + GradientStop { position: 1.0; color: "#000000" } + } + } - Text { - id: webContentText - anchors.horizontalCenter : parent.horizontalCenter - text: "Web content\nClick to view" - font.family: "Helvetica" - font.pointSize: 24 - color: "#0098CA" + function shortUrl(url) { + var hostBegin = url.indexOf("://"); + if (hostBegin > -1) { + url = url.substring(hostBegin + 3); + } + + var portBegin = url.indexOf(":"); + if (portBegin > -1) { + url = url.substring(0, portBegin); + } + + var pathBegin = url.indexOf("/"); + if (pathBegin > -1) { + url = url.substring(0, pathBegin); + } + + if (url.length > 45) { + url = url.substring(0, 45); + } + + return url; } Text { id: urlText - text: url - anchors.horizontalCenter : parent.horizontalCenter - anchors.top : webContentText.bottom - font.family: "Helvetica" - font.pointSize: 18 - color: "#0098CA" + text: shortUrl(url) + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignHCenter + anchors.fill: parent + anchors.rightMargin: 10 + anchors.leftMargin: 10 + font.family: "Cairo" + font.weight: Font.DemiBold + font.pointSize: 48 + fontSizeMode: Text.Fit + color: "#FFFFFF" + minimumPixelSize: 5 } + + Image { + id: hand + source: "../../icons/hand.svg" + width: 300 + height: 300 + anchors.bottom: parent.bottom + anchors.right: parent.right + anchors.bottomMargin: 100 + anchors.rightMargin: 100 + } + + } diff --git a/interface/resources/qml/controls/+android/WebEntityView.qml b/interface/resources/qml/controls/+android/WebEntityView.qml index 7b2677003c..848077cea0 100644 --- a/interface/resources/qml/controls/+android/WebEntityView.qml +++ b/interface/resources/qml/controls/+android/WebEntityView.qml @@ -1,7 +1,7 @@ // -// WebEntityView.qml +// Web3DOverlay.qml // -// Created by Gabriel Calero & Cristian Duarte on Jun 25, 2018 +// Created by Gabriel Calero & Cristian Duarte on Jun 22, 2018 // Copyright 2016 High Fidelity, Inc. // // Distributed under the Apache License, Version 2.0. @@ -9,28 +9,68 @@ // import QtQuick 2.5 - +import QtGraphicalEffects 1.0 Item { property string url + RadialGradient { + anchors.fill: parent + gradient: Gradient { + GradientStop { position: 0.0; color: "#262626" } + GradientStop { position: 1.0; color: "#000000" } + } + } - Text { - id: webContentText - anchors.horizontalCenter : parent.horizontalCenter - text: "Web content\nClick to view" - font.family: "Helvetica" - font.pointSize: 24 - color: "#0098CA" + function shortUrl(url) { + var hostBegin = url.indexOf("://"); + if (hostBegin > -1) { + url = url.substring(hostBegin + 3); + } + + var portBegin = url.indexOf(":"); + if (portBegin > -1) { + url = url.substring(0, portBegin); + } + + var pathBegin = url.indexOf("/"); + if (pathBegin > -1) { + url = url.substring(0, pathBegin); + } + + if (url.length > 45) { + url = url.substring(0, 45); + } + + return url; } Text { id: urlText - text: url - anchors.horizontalCenter : parent.horizontalCenter - anchors.top : webContentText.bottom - font.family: "Helvetica" - font.pointSize: 18 - color: "#0098CA" + text: shortUrl(url) + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignHCenter + anchors.fill: parent + anchors.rightMargin: 10 + anchors.leftMargin: 10 + font.family: "Cairo" + font.weight: Font.DemiBold + font.pointSize: 48 + fontSizeMode: Text.Fit + color: "#FFFFFF" + minimumPixelSize: 5 } + + Image { + id: hand + source: "../../../icons/hand.svg" + width: 300 + height: 300 + anchors.bottom: parent.bottom + anchors.right: parent.right + anchors.bottomMargin: 100 + anchors.rightMargin: 100 + } + + }