~osomon/webbrowser-app/browserpage

« back to all changes in this revision

Viewing changes to src/app/webbrowser/HistoryViewWide.qml

  • Committer: Olivier Tilloy
  • Date: 2016-05-05 10:09:48 UTC
  • Revision ID: olivier.tilloy@canonical.com-20160505100948-po7c5owe6wxgbeyj
Make HistoryViewWide a BrowserPage.

Show diffs side-by-side

added added

removed removed

Lines of Context:
18
18
 
19
19
import QtQuick 2.4
20
20
import Ubuntu.Components 1.3
21
 
import Ubuntu.Components.ListItems 1.3 as ListItems
22
21
import webbrowserapp.private 0.1
23
22
import "Highlight.js" as Highlight
24
23
import "." as Local
25
24
 
26
 
FocusScope {
 
25
BrowserPage {
27
26
    id: historyViewWide
28
27
 
29
28
    property bool searchMode: false
30
29
    readonly property bool selectMode: urlsListView.ViewItems.selectMode
31
 
    onSearchModeChanged: {
32
 
        if (searchMode) searchQuery.focus = true
33
 
        else {
34
 
            searchQuery.text = ""
35
 
            urlsListView.focus = true
36
 
        }
37
 
    }
38
30
 
39
31
    signal done()
40
32
    signal historyEntryClicked(url url)
41
33
    signal newTabRequested()
42
34
 
 
35
    title: (selectMode || searchMode) ? "" : i18n.tr("History")
 
36
    headerContents: searchMode ? searchQuery : null
 
37
 
 
38
    onBack: {
 
39
        if (searchMode) {
 
40
            searchMode = false
 
41
            lastVisitDateListView.forceActiveFocus()
 
42
        } else if (selectMode) {
 
43
            urlsListView.ViewItems.selectMode = false
 
44
            lastVisitDateListView.forceActiveFocus()
 
45
        } else {
 
46
            done()
 
47
        }
 
48
    }
 
49
 
 
50
    trailingActions: [
 
51
        Action {
 
52
            objectName: "selectAll"
 
53
            iconName: "select"
 
54
            visible: historyViewWide.selectMode
 
55
            onTriggered: internal.toggleSelectAll()
 
56
        },
 
57
        Action {
 
58
            objectName: "delete"
 
59
            iconName: "delete"
 
60
            visible: historyViewWide.selectMode
 
61
            enabled: urlsListView.ViewItems.selectedIndices.length > 0
 
62
            onTriggered: internal.removeSelected()
 
63
        },
 
64
        Action {
 
65
            objectName: "search"
 
66
            iconName: "search"
 
67
            visible: !historyViewWide.searchMode && !historyViewWide.selectMode
 
68
            onTriggered: historyViewWide.searchMode = true
 
69
        }
 
70
    ]
 
71
 
43
72
    Keys.onLeftPressed: lastVisitDateListView.forceActiveFocus()
44
73
    Keys.onRightPressed: urlsListView.forceActiveFocus()
45
 
    Keys.onUpPressed: if (searchMode) searchQuery.focus = true
 
74
    Keys.onUpPressed: if (searchMode) searchQuery.forceActiveFocus()
46
75
    Keys.onPressed: {
47
76
        if (event.modifiers === Qt.ControlModifier && event.key === Qt.Key_F) {
48
 
            if (searchMode) searchQuery.focus = true
 
77
            if (searchMode) searchQuery.forceActiveFocus()
49
78
            else if (!selectMode) searchMode = true
50
79
            event.accepted = true
51
80
        }
77
106
        }
78
107
    }
79
108
 
80
 
    Rectangle {
81
 
        anchors.fill: parent
82
 
    }
83
 
 
84
109
    Timer {
85
110
        // Set the model asynchronously to ensure
86
111
        // the view is displayed as early as possible.
97
122
        terms: searchQuery.terms
98
123
    }
99
124
 
 
125
    TextField {
 
126
        id: searchQuery
 
127
        objectName: "searchQuery"
 
128
        parent: null
 
129
        anchors {
 
130
            verticalCenter: parent ? parent.verticalCenter : undefined
 
131
            right: parent ? parent.right : undefined
 
132
            rightMargin: units.gu(2)
 
133
        }
 
134
        width: urlsListView.width
 
135
 
 
136
        inputMethodHints: Qt.ImhNoPredictiveText
 
137
        primaryItem: Icon {
 
138
           height: parent.height - units.gu(2)
 
139
           width: height
 
140
           name: "search"
 
141
        }
 
142
        hasClearButton: true
 
143
        placeholderText: i18n.tr("search history")
 
144
        readonly property var terms: text.split(/\s+/g).filter(function(term) { return term.length > 0 })
 
145
 
 
146
        Keys.onDownPressed: urlsListView.forceActiveFocus()
 
147
        Keys.onEscapePressed: historyViewWide.searchMode = false
 
148
 
 
149
        onParentChanged: {
 
150
            if (historyViewWide.searchMode) {
 
151
                forceActiveFocus()
 
152
            } else if (urlsListView) {
 
153
                text = ""
 
154
                urlsListView.forceActiveFocus()
 
155
            }
 
156
        }
 
157
    }
 
158
 
100
159
    Row {
101
160
        id: historyViewWideRow
102
161
        anchors {
103
 
            top: topBar.bottom
 
162
            top: parent.top
104
163
            left: parent.left
105
164
            bottom: bottomToolbar.top
106
165
            leftMargin: units.gu(2)
203
262
 
204
263
            Keys.onUpPressed: {
205
264
                if (searchMode) {
206
 
                    searchQuery.focus = true
 
265
                    searchQuery.forceActiveFocus()
207
266
                } else {
208
267
                    event.accepted = false
209
268
                }
320
379
    }
321
380
 
322
381
    Local.Toolbar {
323
 
        id: topBar
324
 
 
325
 
        height: units.gu(7)
326
 
        color: "#f7f7f7"
327
 
 
328
 
        anchors {
329
 
            left: parent.left
330
 
            right: parent.right
331
 
            top: parent.top
332
 
        }
333
 
 
334
 
        Keys.onEscapePressed: {
335
 
            if (searchQuery.activeFocus) {
336
 
                historyViewWide.searchMode = false
337
 
            } else {
338
 
                event.accepted = false
339
 
            }
340
 
        }
341
 
 
342
 
        Label {
343
 
            visible: !urlsListView.ViewItems.selectMode &&
344
 
                     !historyViewWide.searchMode
345
 
 
346
 
            anchors {
347
 
                top: parent.top
348
 
                left: parent.left
349
 
                topMargin: units.gu(2)
350
 
                leftMargin: units.gu(2)
351
 
            }
352
 
 
353
 
            text: i18n.tr("History")
354
 
        }
355
 
 
356
 
        ToolbarAction {
357
 
            objectName: "backButton"
358
 
 
359
 
            visible: historyViewWide.selectMode || historyViewWide.searchMode
360
 
 
361
 
            anchors {
362
 
                top: parent.top
363
 
                left: parent.left
364
 
                leftMargin: units.gu(2)
365
 
            }
366
 
            height: parent.height - units.gu(2)
367
 
 
368
 
            iconName: "back"
369
 
            text: i18n.tr("Cancel")
370
 
 
371
 
            onClicked: {
372
 
                if (historyViewWide.searchMode) {
373
 
                    historyViewWide.searchMode = false
374
 
                } else {
375
 
                    urlsListView.ViewItems.selectMode = false
376
 
                }
377
 
                lastVisitDateListView.forceActiveFocus()
378
 
            }
379
 
        }
380
 
 
381
 
        ToolbarAction {
382
 
            objectName: "selectButton"
383
 
 
384
 
            visible: urlsListView.ViewItems.selectMode
385
 
 
386
 
            anchors {
387
 
                top: parent.top
388
 
                right: deleteButton.left
389
 
                rightMargin: units.gu(2)
390
 
            }
391
 
            height: parent.height - units.gu(2)
392
 
 
393
 
            iconName: "select"
394
 
            text: i18n.tr("Select all")
395
 
 
396
 
            onClicked: internal.toggleSelectAll()
397
 
        }
398
 
 
399
 
        ToolbarAction {
400
 
            id: deleteButton
401
 
            objectName: "deleteButton"
402
 
 
403
 
            visible: urlsListView.ViewItems.selectMode
404
 
 
405
 
            anchors {
406
 
                top: parent.top
407
 
                right: parent.right
408
 
                rightMargin: units.gu(2)
409
 
            }
410
 
            height: parent.height - units.gu(2)
411
 
 
412
 
            iconName: "delete"
413
 
            text: i18n.tr("Delete")
414
 
            enabled: urlsListView.ViewItems.selectedIndices.length > 0
415
 
            onClicked: internal.removeSelected()
416
 
        }
417
 
 
418
 
        TextField {
419
 
            id: searchQuery
420
 
            objectName: "searchQuery"
421
 
            anchors {
422
 
                verticalCenter: parent.verticalCenter
423
 
                right: parent.right
424
 
                rightMargin: units.gu(2)
425
 
            }
426
 
            width: urlsListView.width
427
 
            inputMethodHints: Qt.ImhNoPredictiveText
428
 
            primaryItem: Icon {
429
 
               height: parent.height - units.gu(2)
430
 
               width: height
431
 
               name: "search"
432
 
            }
433
 
            hasClearButton: true
434
 
            placeholderText: i18n.tr("search history")
435
 
            visible: historyViewWide.searchMode
436
 
            readonly property var terms: text.split(/\s+/g).filter(function(term) { return term.length > 0 })
437
 
 
438
 
            Keys.onDownPressed: urlsListView.focus = true
439
 
        }
440
 
 
441
 
        ToolbarAction {
442
 
            id: searchButton
443
 
            iconName: "search"
444
 
            objectName: "searchButton"
445
 
            visible: !urlsListView.ViewItems.selectMode &&
446
 
                     !historyViewWide.searchMode
447
 
            anchors {
448
 
                verticalCenter: parent.verticalCenter
449
 
                right: parent.right
450
 
                rightMargin: units.gu(3.5)
451
 
            }
452
 
            height: parent.height - units.gu(2)
453
 
            onClicked: {
454
 
                historyViewWide.searchMode = true
455
 
                searchQuery.forceActiveFocus()
456
 
            }
457
 
        }
458
 
 
459
 
        ListItems.ThinDivider {
460
 
            anchors {
461
 
                left: parent.left
462
 
                right: parent.right
463
 
                bottom: parent.bottom
464
 
            }
465
 
        }
466
 
    }
467
 
 
468
 
    Local.Toolbar {
469
382
        id: bottomToolbar
470
383
        height: units.gu(7)
471
384