diff --git a/interface/resources/fonts/rawline-500.ttf b/interface/resources/fonts/rawline-500.ttf new file mode 100644 index 0000000000..a0e18c7364 Binary files /dev/null and b/interface/resources/fonts/rawline-500.ttf differ diff --git a/interface/resources/qml/hifi/tablet/TabletHome.qml b/interface/resources/qml/hifi/tablet/TabletHome.qml index 4d7883522e..94a65e70a0 100644 --- a/interface/resources/qml/hifi/tablet/TabletHome.qml +++ b/interface/resources/qml/hifi/tablet/TabletHome.qml @@ -6,7 +6,7 @@ import QtQuick.Layouts 1.3 import TabletScriptingInterface 1.0 import "." -import stylesUit 1.0 +import stylesUit 1.0 as HifiStylesUit import "../audio" as HifiAudio Item { @@ -49,44 +49,131 @@ Item { } Item { - width: 150 - height: 50 + id: rightContainer + width: clockItem.width > loginItem.width ? clockItem.width + clockAmPmTextMetrics.width : + loginItem.width + clockAmPmTextMetrics.width + height: parent.height + anchors.top: parent.top + anchors.topMargin: 15 anchors.right: parent.right - anchors.rightMargin: 30 - anchors.verticalCenter: parent.verticalCenter + anchors.rightMargin: 20 + anchors.bottom: parent.bottom - ColumnLayout { - anchors.fill: parent + function timeChanged() { + var date = new Date(); + clockTime.text = date.toLocaleTimeString(Qt.locale("en_US"), "h:mm ap"); + var regex = /[\sa-zA-z]+/; + clockTime.text = clockTime.text.replace(regex, ""); + clockAmPm.text = date.toLocaleTimeString(Qt.locale("en_US"), "ap"); + } - RalewaySemiBold { - text: Account.loggedIn ? qsTr("Log out") : qsTr("Log in") - horizontalAlignment: Text.AlignRight - Layout.alignment: Qt.AlignRight - font.pixelSize: 20 - color: "#afafaf" + Timer { + interval: 1000; running: true; repeat: true; + onTriggered: rightContainer.timeChanged(); + } + + Item { + id: clockAmPmItem + width: clockAmPmTextMetrics.width + height: clockAmPmTextMetrics.height + + anchors.top: parent.top + anchors.right: parent.right + TextMetrics { + id: clockAmPmTextMetrics + text: clockAmPm.text + font: clockAmPm.font } - - RalewaySemiBold { - visible: Account.loggedIn - height: Account.loggedIn ? parent.height/2 - parent.spacing/2 : 0 - text: Account.loggedIn ? "[" + tabletRoot.usernameShort + "]" : "" - horizontalAlignment: Text.AlignRight - Layout.alignment: Qt.AlignRight - font.pixelSize: 20 + Text { + anchors.left: parent.left + id: clockAmPm + anchors.right: parent.right + font.capitalization: Font.AllUppercase + font.pixelSize: 12 + font.family: "Rawline" color: "#afafaf" } } - MouseArea { - anchors.fill: parent - onClicked: { - if (!Account.loggedIn) { - DialogsManager.showLoginDialog() - } else { - Account.logOut() + Item { + id: clockItem + width: clockTimeTextMetrics.width + height: clockTimeTextMetrics.height + anchors { + top: parent.top + topMargin: -10 + right: clockAmPmItem.left + rightMargin: 5 + } + TextMetrics { + id: clockTimeTextMetrics + text: clockTime.text + font: clockTime.font + } + Text { + anchors.top: parent.top + anchors.right: parent.right + id: clockTime + font.bold: false + font.pixelSize: 36 + font.family: "Rawline" + color: "#afafaf" + } + } + + Item { + id: loginItem + width: loginTextMetrics.width + height: loginTextMetrics.height + anchors { + bottom: parent.bottom + bottomMargin: 10 + right: clockAmPmItem.left + rightMargin: 5 + } + Text { + id: loginText + anchors.right: parent.right + visible: !Account.loggedIn + text: qsTr("Log in") + horizontalAlignment: Text.AlignRight + Layout.alignment: Qt.AlignRight + font.pixelSize: 18 + font.family: "Rawline" + color: "#afafaf" + } + TextMetrics { + id: loginTextMetrics + text: Account.loggedIn ? tabletRoot.usernameShort : loginText.text + font: loginText.font + } + + HifiStylesUit.ShortcutText { + anchors.right: parent.right + visible: Account.loggedIn + text: "" + tabletRoot.usernameShort + "" + horizontalAlignment: Text.AlignRight + Layout.alignment: Qt.AlignRight + font.pixelSize: 18 + font.bold: true + font.family: "Rawline" + linkColor: hifi.colors.blueAccent + } + + MouseArea { + anchors.fill: parent + onClicked: { + if (!Account.loggedIn) { + DialogsManager.showLoginDialog(); + } else { + Account.logOut(); + } } } } + Component.onCompleted: { + rightContainer.timeChanged(); + } } } diff --git a/interface/resources/qml/styles-uit/Rawline.qml b/interface/resources/qml/styles-uit/Rawline.qml new file mode 100644 index 0000000000..50c6544739 --- /dev/null +++ b/interface/resources/qml/styles-uit/Rawline.qml @@ -0,0 +1,20 @@ +// +// Rawline.qml +// +// Created by Wayne Chen on 25 Feb 2019 +// Copyright 2019 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 QtQuick 2.7 + +Text { + id: root + property real size: 32 + font.pixelSize: size + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignLeft + font.family: "Rawline" +} diff --git a/interface/resources/qml/stylesUit/Rawline.qml b/interface/resources/qml/stylesUit/Rawline.qml new file mode 100644 index 0000000000..50c6544739 --- /dev/null +++ b/interface/resources/qml/stylesUit/Rawline.qml @@ -0,0 +1,20 @@ +// +// Rawline.qml +// +// Created by Wayne Chen on 25 Feb 2019 +// Copyright 2019 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 QtQuick 2.7 + +Text { + id: root + property real size: 32 + font.pixelSize: size + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignLeft + font.family: "Rawline" +} diff --git a/interface/src/Application.cpp b/interface/src/Application.cpp index 83b287b7ae..a850cdfe12 100644 --- a/interface/src/Application.cpp +++ b/interface/src/Application.cpp @@ -1075,6 +1075,7 @@ Application::Application(int& argc, char** argv, QElapsedTimer& startupTimer, bo QFontDatabase::addApplicationFont(PathUtils::resourcesPath() + "fonts/FiraSans-SemiBold.ttf"); QFontDatabase::addApplicationFont(PathUtils::resourcesPath() + "fonts/Raleway-Light.ttf"); QFontDatabase::addApplicationFont(PathUtils::resourcesPath() + "fonts/Raleway-Regular.ttf"); + QFontDatabase::addApplicationFont(PathUtils::resourcesPath() + "fonts/rawline-500.ttf"); QFontDatabase::addApplicationFont(PathUtils::resourcesPath() + "fonts/Raleway-Bold.ttf"); QFontDatabase::addApplicationFont(PathUtils::resourcesPath() + "fonts/Raleway-SemiBold.ttf"); QFontDatabase::addApplicationFont(PathUtils::resourcesPath() + "fonts/Cairo-SemiBold.ttf");