1import QtQuick 2.9
2import QtQuick.Controls 2.2
3import QtQuick.Layouts 1.3
4import QtQuick.Controls.Material 2.2
5import QtGraphicalEffects 1.0
6import Qt.labs.platform 1.1 as PopUpMenu
7
8ToolBar {
9    id: toolBar
10
11    background: Rectangle {
12        color: defaultBackground
13        opacity: 0.7
14    }
15
16    function getToolbarColor(isActive) {
17        if (!isActive) {
18            return 0
19        } else {
20            return 0.05
21        }
22    }
23
24    property bool showSearch: shouldShowSearch()
25    property bool showBackBtn: navigator.depth > 1
26    property bool showTitleLbl: !!navigator.currentItem
27                                && !!navigator.currentItem.title
28    property alias moreBtn: moreBtn
29    property alias addCredentialBtn: addCredentialBtn
30    property alias searchField: searchField
31
32    function shouldShowSearch() {
33        return !!(navigator.currentItem
34                  && navigator.currentItem.objectName === 'credentialsView'
35                  && entries.count > 0 && !settings.otpMode)
36    }
37
38    function shouldShowSettings() {
39        return !!(navigator.currentItem && navigator.currentItem.objectName !== 'settingsView'
40                  && navigator.currentItem.objectName !== 'newCredentialView')
41    }
42
43    function shouldShowInfo() {
44        return !!(navigator.currentItem && navigator.currentItem.objectName === 'settingsView')
45    }
46
47    function shouldShowCredentialOptions() {
48        return !!(app.currentCredentialCard && navigator.currentItem
49                  && navigator.currentItem.objectName === 'credentialsView')
50    }
51
52    function shouldShowToolbar() {
53        return !!(navigator.currentItem && navigator.currentItem.objectName !== 'loadingView')
54    }
55
56    RowLayout {
57        spacing: 0
58        anchors.fill: parent
59        visible: shouldShowToolbar()
60        Layout.alignment: Qt.AlignTop
61
62
63        ToolButton {
64            id: backBtn
65            visible: showBackBtn
66            onClicked: navigator.home()
67            icon.source: "../images/back.svg"
68            icon.color: primaryColor
69            opacity: hovered ? fullEmphasis : lowEmphasis
70            MouseArea {
71                anchors.fill: parent
72                cursorShape: Qt.PointingHandCursor
73                enabled: false
74            }
75        }
76
77        ToolButton {
78            id: moreBtn
79            Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
80            visible: !backBtn.visible && shouldShowSettings()
81
82            onClicked: navigator.goToSettings()
83            Keys.onReturnPressed: navigator.goToSettings()
84            Keys.onEnterPressed: navigator.goToSettings()
85
86            KeyNavigation.left: navigator
87            KeyNavigation.backtab: navigator
88            KeyNavigation.right: searchField
89            KeyNavigation.tab: searchField
90
91            Accessible.role: Accessible.Button
92            Accessible.name: "Settings"
93            Accessible.description: "Settings button"
94
95            ToolTip {
96                text: qsTr("Settings")
97                delay: 1000
98                parent: moreBtn
99                visible: parent.hovered
100                Material.foreground: toolTipForeground
101                Material.background: toolTipBackground
102            }
103
104            icon.source: "../images/more.svg"
105            icon.color: primaryColor
106            opacity: hovered ? fullEmphasis : lowEmphasis
107
108            MouseArea {
109                anchors.fill: parent
110                cursorShape: Qt.PointingHandCursor
111                enabled: false
112            }
113        }
114
115        Label {
116            id: titleLbl
117            visible: showTitleLbl
118            text: showTitleLbl ? navigator.currentItem.title : ""
119            font.pixelSize: 16
120            Layout.leftMargin: moreBtn.visible ? -32 : 0
121            Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
122            horizontalAlignment: Text.AlignHCenter
123            verticalAlignment: Text.AlignVCenter
124            Layout.fillWidth: true
125            color: primaryColor
126            opacity: lowEmphasis
127        }
128
129        ToolButton {
130            id: searchBtn
131            visible: showSearch
132            Layout.minimumHeight: 30
133            Layout.maximumHeight: 30
134            Layout.fillWidth: true
135            Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
136            background: Rectangle {
137                color: primaryColor
138                opacity: getToolbarColor(searchBtn.hovered)
139                height: 30
140                radius: 4
141            }
142
143            TextField {
144                id: searchField
145                visible: showSearch
146                selectByMouse: true
147                selectedTextColor: defaultBackground
148                Layout.fillWidth: true
149                Layout.fillHeight: true
150                placeholderText: qsTr("Quick find")
151                placeholderTextColor: isDark() ? "#B7B7B7" : "#767676"
152                leftPadding: 28
153                rightPadding: 8
154                width: parent.width
155                horizontalAlignment: Qt.AlignLeft
156                verticalAlignment: Qt.AlignVCenter
157                color: primaryColor
158                opacity: hovered || activeFocus ? fullEmphasis : lowEmphasis
159                background: Rectangle {
160                    color: primaryColor
161                    height: 30
162                    radius: 4
163                    opacity: getToolbarColor(searchField.focus)
164                }
165
166                Accessible.role: Accessible.EditableText
167                Accessible.searchEdit: true
168                onTextChanged: forceActiveFocus()
169                onVisibleChanged: {
170                    if (!visible) {
171                        exitSearchMode(true)
172                    }
173                }
174                MouseArea {
175                    anchors.fill: parent
176                    acceptedButtons: Qt.RightButton
177                    hoverEnabled: true
178                    cursorShape: Qt.IBeamCursor
179                    onClicked: {
180                        contextMenu.open();
181                    }
182                    onPressAndHold: {
183                        if (mouse.source === Qt.MouseEventNotSynthesized) {
184                            contextMenu.open();
185                        }
186                    }
187                }
188
189                PopUpMenu.Menu {
190                    id: contextMenu
191
192                    PopUpMenu.MenuItem {
193                        text: qsTr("Cut")
194                        onTriggered: {
195                            searchField.cut()
196                        }
197                    }
198                    PopUpMenu.MenuItem {
199                        text: qsTr("Copy")
200                        onTriggered: {
201                            searchField.copy()
202                        }
203                    }
204                    PopUpMenu.MenuItem {
205                        text: qsTr("Paste")
206                        onTriggered: {
207                            searchField.paste()
208                        }
209                    }
210                }
211
212                function exitSearchMode(clearInput) {
213                    if (clearInput) {
214                        text = ""
215                    }
216                    focus = false
217                    Keys.forwardTo = navigator
218                    navigator.forceActiveFocus()
219                }
220
221                KeyNavigation.backtab: moreBtn
222                KeyNavigation.left: moreBtn
223                KeyNavigation.tab: shouldShowCredentialOptions(
224                                       ) ? copyCredentialBtn : addCredentialBtn
225                KeyNavigation.right: shouldShowCredentialOptions(
226                                       ) ? copyCredentialBtn : addCredentialBtn
227                Keys.onEscapePressed: exitSearchMode(true)
228                Keys.onDownPressed: exitSearchMode(false)
229                Keys.onReturnPressed: {
230                    if (currentCredentialCard) {
231                        currentCredentialCard.calculateCard(true)
232                    }
233                }
234                Keys.onEnterPressed: {
235                    if (currentCredentialCard) {
236                        currentCredentialCard.calculateCard(true)
237                    }
238                }
239
240                StyledImage {
241                    id: searchIcon
242                    x: 5
243                    y: 6
244                    iconHeight: 20
245                    iconWidth: 20
246                    source: "../images/search.svg"
247                    color: primaryColor
248                    opacity: searchField.hovered || searchField.activeFocus ? fullEmphasis : lowEmphasis
249
250                }
251            }
252        }
253
254        RowLayout {
255            spacing: 0
256            Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
257
258            ToolButton {
259                id: copyCredentialBtn
260                Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
261                visible: shouldShowCredentialOptions()
262
263                onClicked: app.currentCredentialCard.calculateCard(true)
264                Keys.onReturnPressed: app.currentCredentialCard.calculateCard(true)
265                Keys.onEnterPressed: app.currentCredentialCard.calculateCard(true)
266
267                KeyNavigation.left: searchField
268                KeyNavigation.backtab: searchField
269                KeyNavigation.right: deleteCredentialBtn
270                KeyNavigation.tab: deleteCredentialBtn
271
272                Accessible.role: Accessible.Button
273                Accessible.name: "Copy"
274                Accessible.description: "Copy to clipboard"
275
276                ToolTip {
277                    text: qsTr("Copy code to clipboard")
278                    delay: 1000
279                    parent: copyCredentialBtn
280                    visible: parent.hovered
281                    Material.foreground: toolTipForeground
282                    Material.background: toolTipBackground
283                }
284
285                icon.source: "../images/copy.svg"
286                icon.color: primaryColor
287                opacity: hovered ? fullEmphasis : lowEmphasis
288
289                MouseArea {
290                    anchors.fill: parent
291                    cursorShape: Qt.PointingHandCursor
292                    enabled: false
293                }
294            }
295
296            ToolButton {
297                id: deleteCredentialBtn
298                Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
299                visible: shouldShowCredentialOptions()
300
301                onClicked: app.currentCredentialCard.deleteCard()
302                Keys.onReturnPressed: app.currentCredentialCard.deleteCard()
303                Keys.onEnterPressed: app.currentCredentialCard.deleteCard()
304
305                KeyNavigation.left: copyCredentialBtn
306                KeyNavigation.right: addCredentialBtn
307                KeyNavigation.tab: addCredentialBtn
308
309                Accessible.role: Accessible.Button
310                Accessible.name: "Delete"
311                Accessible.description: "Delete account"
312
313                ToolTip {
314                    text: qsTr("Delete account")
315                    delay: 1000
316                    parent: deleteCredentialBtn
317                    visible: parent.hovered
318                    Material.foreground: toolTipForeground
319                    Material.background: toolTipBackground
320                }
321
322                icon.source: "../images/delete.svg"
323                icon.color: primaryColor
324                opacity: hovered ? fullEmphasis : lowEmphasis
325
326                MouseArea {
327                    anchors.fill: parent
328                    cursorShape: Qt.PointingHandCursor
329                    enabled: false
330                }
331            }
332
333            ToolButton {
334                id: infoBtn
335                Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
336                visible: shouldShowInfo()
337                onClicked: navigator.about()
338
339                Keys.onReturnPressed: navigator.about()
340                Keys.onEnterPressed: navigator.about()
341
342                KeyNavigation.left: backBtn
343                KeyNavigation.backtab: backBtn
344                KeyNavigation.right: navigator
345                KeyNavigation.tab: navigator
346
347                Accessible.role: Accessible.Button
348                Accessible.name: "Info"
349                Accessible.description: "Information"
350
351                ToolTip {
352                    text: qsTr("Information")
353                    delay: 1000
354                    parent: infoBtn
355                    visible: parent.hovered
356                    Material.foreground: toolTipForeground
357                    Material.background: toolTipBackground
358                }
359
360                icon.source: "../images/info.svg"
361                icon.color: primaryColor
362                opacity: hovered ? fullEmphasis : lowEmphasis
363
364                MouseArea {
365                    anchors.fill: parent
366                    cursorShape: Qt.PointingHandCursor
367                    enabled: false
368                }
369            }
370
371
372            ToolButton {
373                id: addCredentialBtn
374                visible: !!yubiKey.currentDevice
375                         && yubiKey.currentDeviceValidated
376                         && navigator.currentItem
377                         && navigator.currentItem.objectName === 'credentialsView'
378
379                Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
380
381                onClicked: yubiKey.scanQr()
382                Keys.onReturnPressed: yubiKey.scanQr()
383                Keys.onEnterPressed: yubiKey.scanQr()
384
385                KeyNavigation.left: app.currentCredentialCard ? deleteCredentialBtn : searchField
386                KeyNavigation.backtab: app.currentCredentialCard ? deleteCredentialBtn : searchField
387                KeyNavigation.right: navigator
388                KeyNavigation.tab: navigator
389
390                Accessible.role: Accessible.Button
391                Accessible.name: qsTr("Add")
392                Accessible.description: qsTr("Add account")
393
394                ToolTip {
395                    text: qsTr("Add a new account")
396                    delay: 1000
397                    parent: addCredentialBtn
398                    visible: parent.hovered
399                    Material.foreground: toolTipForeground
400                    Material.background: toolTipBackground
401                }
402
403                icon.source: "../images/add.svg"
404                icon.color: primaryColor
405                opacity: hovered ? fullEmphasis : lowEmphasis
406
407                MouseArea {
408                    anchors.fill: parent
409                    cursorShape: Qt.PointingHandCursor
410                    enabled: false
411                }
412            }
413
414        }
415    }
416}
417