forked from cwtch.im/ui
210 lines
4.9 KiB
QML
210 lines
4.9 KiB
QML
import QtGraphicalEffects 1.0
|
|
import QtQuick 2.7
|
|
import QtQuick.Controls 2.4
|
|
import QtQuick.Controls.Material 2.0
|
|
import QtQuick.Layouts 1.3
|
|
import QtQuick.Window 2.11
|
|
|
|
import "fonts/Twemoji.js" as T
|
|
import "overlays"
|
|
import "panes"
|
|
import "widgets"
|
|
import "utils.js" as Utils
|
|
|
|
|
|
ApplicationWindow {
|
|
id: windowItem
|
|
width: 1200
|
|
height: 800
|
|
visible: true
|
|
title: "cwtch" + ""
|
|
|
|
|
|
|
|
readonly property real ratio: height / width
|
|
|
|
readonly property string cwtch_background_color: '#EEEEFF'
|
|
readonly property string cwtch_color: '#B09CBC'
|
|
readonly property string cwtch_dark_color: '#4B3557'
|
|
|
|
FontAwesome { // PRETTY BUTTON ICONS
|
|
id: awesome
|
|
resource: "qrc:/qml/fonts/fontawesome.ttf"
|
|
}
|
|
|
|
function parse(text, size) { // REPLACE EMOJI WITH <IMG> TAGS
|
|
T.twemoji.base = "qrc:/qml/fonts/twemoji/"
|
|
T.twemoji.ext = ".png"
|
|
T.twemoji.size = "72x72"
|
|
T.twemoji.className = "\" height=\""+size+"\" width=\""+size
|
|
return T.twemoji.parse(Utils.htmlEscaped(text))
|
|
}
|
|
|
|
function restoreEmoji(text) { // REPLACE <IMG> TAGS WITH EMOJI
|
|
var re = /<img src="qrc:\/qml\/fonts\/twemoji\/72x72\/([^"]*?)\.png" width="10" height="10" \/>/g
|
|
var arr
|
|
var newtext = text
|
|
while (arr = re.exec(text)) {
|
|
var pieces = arr[1].split("-")
|
|
var replacement = ""
|
|
for (var i = 0; i < pieces.length; i++) {
|
|
replacement += T.twemoji.convert.fromCodePoint(pieces[i])
|
|
}
|
|
newtext = newtext.replace(arr[0], replacement)
|
|
}
|
|
return newtext
|
|
}
|
|
|
|
function scale() {
|
|
return 0.1 + 2 * zoomSlider.value
|
|
}
|
|
|
|
|
|
/* Rectangle { // THE TOOLBAR
|
|
id: toolbar
|
|
anchors.top: parent.top
|
|
anchors.left: parent.left
|
|
width: ratio >= 0.92 ? parent.width : 70
|
|
height: ratio >= 0.92 ? 70 : parent.height
|
|
color: "#4B3557"
|
|
|
|
GridLayout {
|
|
width: parent.width
|
|
height: parent.height
|
|
columns: ratio >= 0.92 ? children.length : 1
|
|
|
|
|
|
ContactPicture {
|
|
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
|
|
source: "qrc:/qml/images/profiles/001-centaur.png"
|
|
status: -2
|
|
}
|
|
|
|
ContactPicture {
|
|
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
|
|
source: "qrc:/qml/images/profiles/002-kraken.png"
|
|
status: -2
|
|
}
|
|
|
|
ContactPicture {
|
|
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
|
|
source: "qrc:/qml/images/profiles/003-dinosaur.png"
|
|
status: -2
|
|
}
|
|
|
|
ContactPicture {
|
|
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
|
|
source: "qrc:/qml/images/profiles/004-tree-1.png"
|
|
status: -2
|
|
}
|
|
|
|
ContactPicture {
|
|
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
|
|
source: "qrc:/qml/images/profiles/005-hand.png"
|
|
status: -2
|
|
}
|
|
}
|
|
}*/
|
|
|
|
RowLayout { // CONTAINS EVERYTHING EXCEPT THE TOOLBAR
|
|
/* anchors.left: ratio >= 0.92 ? parent.left : toolbar.right
|
|
anchors.top: ratio >= 0.92 ? toolbar.bottom : parent.top
|
|
anchors.right: parent.right
|
|
anchors.bottom: parent.bottom */
|
|
anchors.fill: parent
|
|
spacing: 0
|
|
|
|
|
|
Rectangle { // THE LEFT PANE WITH TOOLS AND CONTACTS
|
|
color: "#D2C0DD"
|
|
Layout.fillHeight: true
|
|
Layout.minimumWidth: Layout.maximumWidth
|
|
Layout.maximumWidth: theStack.pane == theStack.emptyPane ? parent.width : 450
|
|
visible: (ratio <= 1.08 && windowItem.width >= 700) || theStack.pane == theStack.emptyPane
|
|
|
|
|
|
ContactList{
|
|
anchors.fill: parent
|
|
}
|
|
}
|
|
|
|
Rectangle { // THE RIGHT PANE WHERE THE MESSAGES AND STUFF GO
|
|
color: "#EEEEFF"
|
|
Layout.fillWidth: true
|
|
Layout.fillHeight: true
|
|
|
|
|
|
StackLayout {
|
|
id: theStack
|
|
anchors.fill: parent
|
|
currentIndex: 0
|
|
|
|
property alias pane: theStack.currentIndex
|
|
readonly property int emptyPane: 0
|
|
readonly property int messagePane: 1
|
|
readonly property int settingsPane: 2
|
|
readonly property int userProfilePane: 3
|
|
readonly property int groupProfilePane: 4
|
|
readonly property int addGroupPane: 5
|
|
|
|
property string title
|
|
|
|
|
|
Item { anchors.fill: parent } // empty
|
|
|
|
OverlayPane { // messagePane
|
|
title: theStack.title
|
|
anchors.fill: parent
|
|
}
|
|
|
|
SettingsPane{ anchors.fill: parent }
|
|
|
|
PeerSettingsPane { anchors.fill: parent }
|
|
|
|
GroupSettingsPane{ anchors.fill: parent }
|
|
|
|
AddGroupPane { anchors.fill: parent }
|
|
}
|
|
}
|
|
}
|
|
|
|
PropertyAnimation { id: anmPopup; easing.type: Easing.InQuart; duration: 7000; target: popup; property: "opacity"; to: 0; }
|
|
|
|
Rectangle { // THE ERROR MESSAGE POPUP
|
|
id: popup
|
|
anchors.top: parent.top
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
anchors.topMargin: 20
|
|
width: lblPopup.width + 30
|
|
height: lblPopup.height + 8
|
|
color: "#000000"
|
|
opacity: 0.5
|
|
radius: 15
|
|
visible: false
|
|
|
|
|
|
Label {
|
|
id: lblPopup
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
font.pixelSize: 18
|
|
color: "#FFFFFF"
|
|
}
|
|
}
|
|
|
|
|
|
Connections { // POPUPS ARE INVOKED BY GO FUNCS
|
|
target: gcd
|
|
|
|
onInvokePopup: function(str) {
|
|
lblPopup.text = str
|
|
popup.opacity = 0.5
|
|
popup.visible = true
|
|
anmPopup.restart()
|
|
}
|
|
|
|
onSetToolbarTitle: function(str) {
|
|
theStack.title = str
|
|
}
|
|
}
|
|
} |