Made the url input text field to work with the FieldText component copied and slightly modified from contacts demo.

5 files changed, 201 insertions, 24 deletions

diff --git a/demos/declarative/webbrowser/README b/demos/declarative/webbrowser/README
deleted file mode 100644
index 7bfd41f..0000000
--- a/demos/declarative/webbrowser/README
+++ /dev/null
@@ -1,6 +0,0 @@
-For good performance, be sure to use disk cache for remote content:
-
-  duiviewer -cache webbrowser.qml
-
-Otherwise everything always re-loads over the network.
-
diff --git a/demos/declarative/webbrowser/fieldtext/FieldText.qml b/demos/declarative/webbrowser/fieldtext/FieldText.qml
new file mode 100644
index 0000000..e5db879
--- /dev/null
+++ b/demos/declarative/webbrowser/fieldtext/FieldText.qml
@@ -0,0 +1,176 @@
+import Qt 4.6
+
+Item {
+    id: fieldText
+    height: 30
+    property string text: ""
+    property string label: ""
+    property bool mouseGrabbed: false
+    signal confirmed
+    signal cancelled
+    signal startEdit
+
+    resources: [
+    Script {
+
+        function edit() {
+            if (!mouseGrabbed) {
+                fieldText.startEdit();
+                fieldText.state='editing';
+                mouseGrabbed=true;
+            }
+        }
+
+        function confirm() {
+            fieldText.state='';
+            fieldText.text = textEdit.text;
+            mouseGrabbed=false;
+            fieldText.confirmed();
+        }
+
+        function reset() {
+            textEdit.text = fieldText.text;
+            fieldText.state='';
+            mouseGrabbed=false;
+            fieldText.cancelled();
+        }
+
+    }
+    ]
+
+    Image {
+        id: cancelIcon
+        width: 22
+        height: 22
+        anchors.right: parent.right
+        anchors.rightMargin: 4
+        anchors.verticalCenter: parent.verticalCenter
+        source: "pics/cancel.png"
+        opacity: 0
+    }
+
+    Image {
+        id: confirmIcon
+        width: 22
+        height: 22
+        anchors.left: parent.left
+        anchors.leftMargin: 4
+        anchors.verticalCenter: parent.verticalCenter
+        source: "pics/ok.png"
+        opacity: 0
+    }
+
+    TextEdit {
+        id: textEdit
+        text: fieldText.text
+        focus: false
+        anchors.left: parent.left
+        anchors.leftMargin: 0
+        anchors.right: parent.right
+        anchors.rightMargin: 0
+        anchors.verticalCenter: parent.verticalCenter
+        color: "black"
+        font.bold: true
+        readOnly: true
+        wrap: false
+    }
+
+    Text {
+        id: textLabel
+        x: 5
+        width: parent.width-10
+        anchors.verticalCenter: parent.verticalCenter
+        hAlign: "AlignHCenter"
+        color: fieldText.state == "editing" ? "#505050" : "#AAAAAA"
+        font.italic: true
+        font.bold: true
+        text: label
+        opacity: textEdit.text == '' ? 1 : 0
+        opacity: Behavior {
+            NumberAnimation {
+                property: "opacity"
+                duration: 250
+            }
+        }
+    }
+
+    KeyProxy {
+        id: proxy
+        focus: false
+        anchors.fill: parent
+        targets: [keyActions,textEdit]
+    }
+
+    KeyActions {
+        id: keyActions
+        keyReturn: "confirm()"
+        enter: "confirm()"
+    }
+
+    MouseRegion {
+        anchors.fill: cancelIcon
+        onClicked: { reset() }
+    }
+
+    MouseRegion {
+        anchors.fill: confirmIcon
+        onClicked: { confirm() }
+    }
+
+    MouseRegion {
+        id: editRegion
+        anchors.fill: textEdit
+        onClicked: { edit() }
+    }
+
+    states: [
+    State {
+        name: "editing"
+        SetProperties {
+            target: confirmIcon
+            opacity: 1
+        }
+        SetProperties {
+            target: cancelIcon
+            opacity: 1
+        }
+        SetProperties {
+            target: textEdit
+            color: "black"
+            readOnly: false
+        }
+        SetProperties {
+            target: editRegion
+            opacity: 0
+        }
+        SetProperties {
+            target: textEdit.anchors
+            leftMargin: 34
+        }
+        SetProperties {
+            target: textEdit.anchors
+            rightMargin: 34
+        }
+        SetProperties {
+            target: proxy
+            focus: true
+        }
+    }
+    ]
+
+    transitions: [
+    Transition {
+        fromState: ""
+        toState: "*"
+        reversible: true
+        NumberAnimation {
+            properties: "opacity,leftMargin,rightMargin"
+            duration: 200
+        }
+        ColorAnimation {
+            property: "color"
+            duration: 150
+        }
+    }
+    ]
+}
diff --git a/demos/declarative/webbrowser/fieldtext/pics/cancel.png b/demos/declarative/webbrowser/fieldtext/pics/cancel.png
new file mode 100644
index 0000000..ecc9533
--- /dev/null
+++ b/demos/declarative/webbrowser/fieldtext/pics/cancel.png
diff --git a/demos/declarative/webbrowser/fieldtext/pics/ok.png b/demos/declarative/webbrowser/fieldtext/pics/ok.png
new file mode 100644
index 0000000..5795f04
--- /dev/null
+++ b/demos/declarative/webbrowser/fieldtext/pics/ok.png
diff --git a/demos/declarative/webbrowser/webbrowser.qml b/demos/declarative/webbrowser/webbrowser.qml
index 7a7d9e2..9943011 100644
--- a/demos/declarative/webbrowser/webbrowser.qml
+++ b/demos/declarative/webbrowser/webbrowser.qml
@@ -1,11 +1,12 @@
 import Qt 4.6
 
 import "content"
+import "fieldtext"
 
 Item {
     id: WebBrowser
 
-    property var url : "http://www.qtsoftware.com"
+    property string url : "http://www.qtsoftware.com/"
 
     width: 640
     height: 480
@@ -57,6 +58,13 @@ Item {
             height: 60
             z: 1
 
+            Rect {
+                id: HeaderSpaceTint
+                color: "black"
+                opacity: 0
+                anchors.fill: parent
+             }
+
             Image {
                 id: Header
                 source: "content/pics/header.png"
@@ -104,10 +112,13 @@ Item {
                         anchors.rightMargin: 12
                         anchors.top: parent.top
                         clip: true
+                        property bool mouseGrabbed: false
+
                         Image {
                             source: "content/pics/addressbar.sci"
                             anchors.fill: UrlBox
                         }
+                                                
                         Image {
                             id: UrlBoxhl
                             source: "content/pics/addressbar-filled.sci"
@@ -116,27 +127,23 @@ Item {
                             opacity: 1-Header.progressOff
                             clip: true
                         }
-                        
-                        /*
-                        KeyProxy {
-                            id: proxy
-                            anchors.left: UrlBox.left
-                            anchors.fill: UrlBox
-                            targets: [keyActions,EditUrl]
-                        }
-                        KeyActions {
-                            id: keyActions
-                            keyReturn: "WebBrowser.url = EditUrl.text; proxy.focus=false;"
-                        }
-                        */
-                        TextEdit {
+
+                        FieldText {
                             id: EditUrl
+                            mouseGrabbed: parent.mouseGrabbed
 
+                            /*<<<<<<< HEAD:demos/declarative/webbrowser/webbrowser.qml
                             text: MyWebView.url == '' ? ' ' : MyWebView.url
                             wrap: false
                             font.size: 11
                             color: "#555555"
                             focusOnPress: true
+                            =======*/
+                            text: WebBrowser.url
+                            label: "url:"
+                            onConfirmed: { print ('OnConfirmed: '+EditUrl.text); WebBrowser.url = EditUrl.text; print (EditUrl.text); MyWebView.focus=true }
+                            onCancelled: { MyWebView.focus=true }
+                            onStartEdit: { print (EditUrl.text); MyWebView.focus=false }
 
                             anchors.left: UrlBox.left
                             anchors.right: UrlBox.right
@@ -198,7 +205,7 @@ Item {
                 idealHeight: Flick.height/scale
                 scale: (width > 0) ? Flick.width/width*zoomedOut+(1-zoomedOut) : 1
 
-                onUrlChanged: { Flick.xPosition=0; Flick.yPosition=0; zoomOut() }
+                onUrlChanged: { print ('OnUrlChanged: '+url); WebBrowser.url = url.toString(); print ('Moved to url: ' + WebBrowser.url) }
                 onDoubleClick: { toggleZoom() }
 
                 property real zoomedOut : 1
@@ -208,10 +215,10 @@ Item {
                 color: "black"
                 opacity: 0
                 anchors.fill: MyWebView
-                MouseRegion {
+                /*MouseRegion {
                     anchors.fill: WebViewTint
                     onClicked: { proxy.focus=false }
-                }
+                }*/
             }
         }
         Image {