summaryrefslogtreecommitdiffstats
path: root/demos/declarative/webbrowser/content/RetractingWebBrowserHeader.qml
blob: 46dbc9804f6fba6a62b6ee2149ae17ee23fd0076 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
import Qt 4.6

import "fieldtext"

Image {
    property alias editUrl: editUrl.text

    id: header
    source: "pics/header.png"
    width: parent.width
    height: 60
    x: webView.contentX < 0 ? -webView.contentX : webView.contentX > webView.contentWidth-webView.width
                             ? -webView.contentX+webView.contentWidth-webView.width : 0
    y: webView.contentY < 0 ? -webView.contentY : progressOff*
                            (webView.contentY>height?-height:-webView.contentY)
    Row {
        id: headerTitle

        anchors.top: header.top
        anchors.topMargin: 4
        x: parent.width > headerIcon.width+headerText.width+6 ? (parent.width-headerIcon.width-headerText.width-6)/2 : 0
        spacing: 6

        Image {
            id: headerIcon
            pixmap: webView.icon
        }

        Text {
            id: headerText

            text: webView.title!='' || webView.progress == 1.0 ? webView.title : 'Loading...'

            color: "white"
            styleColor: "black"
            style: Text.Raised

            font.family: "Helvetica"
            font.pointSize: 10
            font.bold: true

            horizontalAlignment: Text.AlignHCenter
        }
    }
    Item {
        width: parent.width
        anchors.top: headerTitle.bottom
        anchors.topMargin: 2
        anchors.bottom: parent.bottom

        Item {
            id: urlBox
            height: 31
            anchors.left: parent.left
            anchors.leftMargin: 12
            anchors.right: parent.right
            anchors.rightMargin: 12
            anchors.top: parent.top
            clip: true
            property bool mouseGrabbed: false

            BorderImage {
                source: "pics/addressbar.sci"
                anchors.fill: urlBox
            }

            BorderImage {
                id: urlBoxhl
                source: "pics/addressbar-filled.sci"
                width: parent.width*webView.progress
                height: parent.height
                opacity: 1-header.progressOff
                clip: true
            }

            FieldText {
                id: editUrl
                mouseGrabbed: parent.mouseGrabbed

                text: webBrowser.urlString
                label: "url:"
                onConfirmed: { webBrowser.urlString = editUrl.text; webView.focus=true }
                onCancelled: { webView.focus=true }
                onStartEdit: { webView.focus=false }

                anchors.left: urlBox.left
                anchors.right: urlBox.right
                anchors.leftMargin: 6
                anchors.verticalCenter: urlBox.verticalCenter
                anchors.verticalCenterOffset: 1
            }
        }
    }

    property real progressOff : 1
    states: [
        State {
            name: "ProgressShown"
            when: webView.progress < 1.0
            PropertyChanges { target: header; progressOff: 0; }
        }
    ]
    transitions: [
        Transition {
            NumberAnimation {
                targets: header
                properties: "progressOff"
                easing.type: "InOutQuad"
                duration: 300
            }
        }
    ]
}