Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 1 | |
| 2 | /* |
| 3 | * Copyright (C) 2020 by Savoir-faire Linux |
| 4 | * Author: Mingrui Zhang <mingrui.zhang@savoirfairelinux.com> |
| 5 | * |
| 6 | * This program is free software; you can redistribute it and/or modify |
| 7 | * it under the terms of the GNU General Public License as published by |
| 8 | * the Free Software Foundation; either version 3 of the License, or |
| 9 | * (at your option) any later version. |
| 10 | * |
| 11 | * This program is distributed in the hope that it will be useful, |
| 12 | * but WITHOUT ANY WARRANTY; without even the implied warranty of |
| 13 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
| 14 | * GNU General Public License for more details. |
| 15 | * |
| 16 | * You should have received a copy of the GNU General Public License |
| 17 | * along with this program. If not, see <https://www.gnu.org/licenses/>. |
| 18 | */ |
| 19 | import QtQuick 2.14 |
| 20 | import QtQuick.Controls 2.14 |
| 21 | import QtQuick.Layouts 1.14 |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 22 | import QtGraphicalEffects 1.12 |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 23 | import net.jami.Models 1.0 |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 24 | import "../../commoncomponents" |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 25 | |
| 26 | TabBar { |
| 27 | id: tabBar |
| 28 | |
| 29 | property alias converstationTabDown: pageOne.down |
| 30 | property alias invitationTabDown: pageTwo.down |
| 31 | property alias converstationTabWidth: pageOne.width |
| 32 | property alias invitationTabWidth: pageTwo.width |
| 33 | property alias converstationTabHeight: pageOne.height |
| 34 | property alias invitationTabHeight: pageTwo.height |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 35 | property real opacityDegree: 0.5 |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 36 | |
| 37 | visible: tabBarVisible |
| 38 | |
| 39 | currentIndex: 0 |
| 40 | |
| 41 | TabButton { |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 42 | |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 43 | id: pageOne |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 44 | down: true |
| 45 | |
| 46 | Rectangle { |
| 47 | id: totalUnreadMessagesCountRect |
| 48 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 49 | anchors.centerIn: buttonRectOne |
| 50 | anchors.verticalCenterOffset : -20 |
| 51 | anchors.horizontalCenterOffset : 15 |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 52 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 53 | width: 16 |
| 54 | height: 16 |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 55 | |
| 56 | visible: totalUnreadMessagesCount > 0 |
| 57 | |
| 58 | Text { |
| 59 | id: totalUnreadMessagesCountText |
| 60 | |
| 61 | anchors.centerIn: totalUnreadMessagesCountRect |
| 62 | |
| 63 | text: totalUnreadMessagesCount > 9 ? "···" : totalUnreadMessagesCount |
| 64 | color: "white" |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 65 | font.pointSize: JamiTheme.textFontSize |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 66 | } |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 67 | radius: 30 |
| 68 | color: JamiTheme.notificationRed |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 69 | |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 70 | } |
| 71 | |
| 72 | background: Rectangle { |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 73 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 74 | id: buttonRectOne |
| 75 | width: tabBar.width / 2 + 1 |
| 76 | height: tabBar.height |
| 77 | color: JamiTheme.backgroundColor |
| 78 | |
| 79 | Image { |
| 80 | id: imgRectOne |
| 81 | anchors.horizontalCenter: buttonRectOne.horizontalCenter |
| 82 | anchors.top: buttonRectOne.top |
| 83 | anchors.topMargin: 12 |
| 84 | |
| 85 | width: 24 |
| 86 | height: 24 |
| 87 | |
| 88 | fillMode: Image.PreserveAspectFit |
| 89 | mipmap: true |
| 90 | source: "qrc:/images/icons/baseline-people-24px.svg" |
| 91 | //opacity: enabled ? 0.8 : 0.3 |
| 92 | opacity: pageOne.down == true ? 1.0 : opacityDegree |
| 93 | } |
| 94 | |
| 95 | ColorOverlay { |
| 96 | anchors.fill: imgRectOne |
| 97 | source: imgRectOne |
| 98 | color: JamiTheme.blueLogo_ |
| 99 | opacity: pageOne.down == true ? 1.0 : opacityDegree |
| 100 | } |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 101 | |
| 102 | Text { |
| 103 | id: textConvElement |
| 104 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 105 | anchors.horizontalCenter: buttonRectOne.horizontalCenter |
| 106 | anchors.bottom: buttonRectOne.bottom |
| 107 | anchors.bottomMargin: 12 |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 108 | |
| 109 | horizontalAlignment: Text.AlignHCenter |
| 110 | verticalAlignment: Text.AlignVCenter |
| 111 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 112 | text: qsTr("CONVERSATIONS") |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 113 | font.pointSize: JamiTheme.textFontSize |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 114 | opacity: pageOne.down == true ? 1.0 : opacityDegree |
| 115 | color: JamiTheme.blueLogo_ |
| 116 | } |
| 117 | |
| 118 | Rectangle { |
| 119 | id: markerTabOne |
| 120 | width: buttonRectOne.width |
| 121 | anchors.bottom: buttonRectOne.bottom |
| 122 | height: 2 |
| 123 | color: pageOne.down == true ? JamiTheme.blueLogo_ : "transparent" |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 124 | } |
| 125 | |
| 126 | MouseArea { |
| 127 | anchors.fill: parent |
| 128 | hoverEnabled: true |
| 129 | onPressed: { |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 130 | ConversationsAdapter.setConversationFilter("") |
| 131 | contactSearchBar.setPlaceholderString( |
| 132 | JamiTheme.contactSearchBarPlaceHolderConversationText) |
| 133 | pageOne.down = true |
| 134 | pageTwo.down = false |
| 135 | setCurrentUidSmartListModelIndex() |
| 136 | forceReselectConversationSmartListCurrentIndex() |
| 137 | } |
| 138 | onReleased: { |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 139 | buttonRectOne.color = JamiTheme.backgroundColor |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 140 | } |
| 141 | onEntered: { |
| 142 | buttonRectOne.color = JamiTheme.hoverColor |
| 143 | } |
| 144 | onExited: { |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 145 | buttonRectOne.color = JamiTheme.backgroundColor |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 146 | } |
| 147 | } |
| 148 | } |
| 149 | } |
| 150 | |
| 151 | TabButton { |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 152 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 153 | id: pageTwo |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 154 | |
| 155 | Rectangle { |
| 156 | id: pendingRequestCountRect |
| 157 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 158 | anchors.centerIn: buttonRectTwo |
| 159 | anchors.verticalCenterOffset : -20 |
| 160 | anchors.horizontalCenterOffset : 15 |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 161 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 162 | width: 16 |
| 163 | height: 16 |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 164 | |
| 165 | visible: pendingRequestCount > 0 |
| 166 | |
| 167 | Text { |
| 168 | id: pendingRequestCountText |
| 169 | |
| 170 | anchors.centerIn: pendingRequestCountRect |
| 171 | |
| 172 | text: pendingRequestCount > 9 ? "···" : pendingRequestCount |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 173 | color: JamiTheme.backgroundColor |
| 174 | font.pointSize: JamiTheme.textFontSize |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 175 | } |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 176 | radius: 30 |
| 177 | color: JamiTheme.notificationRed |
| 178 | } |
| 179 | |
| 180 | background: Rectangle { |
| 181 | id: buttonRectTwo |
| 182 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 183 | width: tabBar.width / 2 |
| 184 | height: tabBar.height |
| 185 | color: JamiTheme.backgroundColor |
| 186 | |
| 187 | Image { |
| 188 | id: imgRectTwo |
| 189 | anchors.horizontalCenter: buttonRectTwo.horizontalCenter |
| 190 | anchors.top: buttonRectTwo.top |
| 191 | anchors.topMargin: 10 |
| 192 | |
| 193 | width: 24 |
| 194 | height: 24 |
| 195 | |
| 196 | fillMode: Image.PreserveAspectFit |
| 197 | mipmap: true |
| 198 | source: "qrc:/images/icons/drafts-24px.svg" |
| 199 | //opacity: enabled ? 0.8 : 0.3 |
| 200 | opacity: pageTwo.down == true ? 1.0 : opacityDegree |
| 201 | } |
| 202 | |
| 203 | ColorOverlay { |
| 204 | anchors.fill: imgRectTwo |
| 205 | source: imgRectTwo |
| 206 | color: JamiTheme.blueLogo_ |
| 207 | opacity: pageTwo.down == true ? 1.0 : opacityDegree |
| 208 | } |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 209 | |
| 210 | Text { |
| 211 | id: textInvElement |
| 212 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 213 | anchors.horizontalCenter: buttonRectTwo.horizontalCenter |
| 214 | anchors.bottom: buttonRectTwo.bottom |
| 215 | anchors.bottomMargin: 12 |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 216 | |
| 217 | horizontalAlignment: Text.AlignHCenter |
| 218 | verticalAlignment: Text.AlignVCenter |
| 219 | |
| 220 | font.pointSize: JamiTheme.textFontSize |
| 221 | |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 222 | text: qsTr("INVITATIONS") |
| 223 | //opacity: enabled ? 1.0 : 0.3 |
| 224 | opacity: pageTwo.down == true ? 1.0 : opacityDegree |
| 225 | color: JamiTheme.blueLogo_ |
| 226 | } |
| 227 | |
| 228 | Rectangle { |
| 229 | id: markerTabTwo |
| 230 | width: buttonRectTwo.width |
| 231 | anchors.bottom: buttonRectTwo.bottom |
| 232 | height: 2 |
| 233 | color: pageTwo.down == true ? JamiTheme.blueLogo_ : "transparent" |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 234 | } |
| 235 | |
| 236 | MouseArea { |
| 237 | anchors.fill: parent |
| 238 | hoverEnabled: true |
| 239 | onPressed: { |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 240 | ConversationsAdapter.setConversationFilter("PENDING") |
| 241 | contactSearchBar.setPlaceholderString( |
| 242 | JamiTheme.contactSearchBarPlaceHolderInivitionText) |
| 243 | pageTwo.down = true |
| 244 | pageOne.down = false |
| 245 | } |
| 246 | onReleased: { |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 247 | buttonRectTwo.color = JamiTheme.backgroundColor |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 248 | } |
| 249 | onEntered: { |
| 250 | buttonRectTwo.color = JamiTheme.hoverColor |
| 251 | } |
| 252 | onExited: { |
ababi | df651a2 | 2020-07-30 13:38:57 +0200 | [diff] [blame] | 253 | buttonRectTwo.color = JamiTheme.backgroundColor |
Sébastien Blin | 1f91576 | 2020-08-03 13:27:42 -0400 | [diff] [blame] | 254 | } |
| 255 | } |
| 256 | } |
| 257 | } |
| 258 | } |