Twitter demo touchups

Arrowkey navigation on the login page, and Escape on the main page takes
you back to the login page. Posting does not seem to be working still.
Also switched to pixelSize fonts in many places.

7 files changed, 61 insertions, 29 deletions

diff --git a/demos/declarative/twitter/content/AuthView.qml b/demos/declarative/twitter/content/AuthView.qml
index 8fb00f8..ff360b9 100644
--- a/demos/declarative/twitter/content/AuthView.qml
+++ b/demos/declarative/twitter/content/AuthView.qml
@@ -5,17 +5,15 @@ Item {
     Column {
         anchors.centerIn: parent
         spacing: 20
-        Row{
+        Column{
             spacing: 4
             Text {
-                width: 100
                 text: "Screen name:"
-                font.pointSize: 14; font.bold: true; color: "white"; style: Text.Raised; styleColor: "black"
-                anchors.verticalCenter: parent.verticalCenter
+                font.pixelSize: 16; font.bold: true; color: "white"; style: Text.Raised; styleColor: "black"
                 horizontalAlignment: Qt.AlignRight
             }
             Item {
-                width: 160
+                width: 220
                 height: 28
                 BorderImage { source: "images/lineedit.sci"; anchors.fill: parent }
                 TextInput{
@@ -24,29 +22,24 @@ Item {
                     height: parent.height - 12
                     anchors.centerIn: parent
                     maximumLength:21
+                    font.pixelSize: 16;
                     font.bold: true
                     color: "#151515"; selectionColor: "green"
-                    Keys.forwardTo: [(tabber), (nameIn)]
-                    Item {
-                        id: tabber
-                        //Note: it's not working yet
-                        Keys.onPressed: {if(event.key == Qt.Key_Tab){console.log('Tab works!'); passIn.focus = true; accept(); }}
-                    }
+                    KeyNavigation.down: passIn
+                    focus: true
                 }
             }
         }
-        Row{
+        Column{
             spacing: 4
             Text {
-                width: 100
                 text: "Password:"
-                font.pointSize: 14; font.bold: true; color: "white"; style: Text.Raised; styleColor: "black"
-                anchors.verticalCenter: parent.verticalCenter
+                font.pixelSize: 16; font.bold: true; color: "white"; style: Text.Raised; styleColor: "black"
                 horizontalAlignment: Qt.AlignRight
             }
             Item {
-                width: 160
-                height: 28
+                width: 220
+               height: 28
                 BorderImage { source: "images/lineedit.sci"; anchors.fill: parent }
                 TextInput{
                     id: passIn
@@ -55,29 +48,53 @@ Item {
                     anchors.centerIn: parent
                     maximumLength:21
                     echoMode: TextInput.Password
+                    font.pixelSize: 16;
                     font.bold: true
                     color: "#151515"; selectionColor: "green"
+                    KeyNavigation.down: login
+                    KeyNavigation.up: nameIn
                 }
             }
         }
-        Item{
-            width: childrenRect.width; height:childrenRect.height;
-            anchors.horizontalCenter: parent.horizontalCenter
+        Row{
+            spacing: 10
             Button {
-                x: 10
                 width: 100
                 height: 32
                 id: login
+                keyUsing: true;
+                function doLogin(){
+                    rssModel.authName=nameIn.text;
+                    rssModel.authPass=passIn.text;
+                    rssModel.tags='my timeline';
+                    screen.focus = true;
+                }
                 text: "Log in"
-                onClicked: {rssModel.authName=nameIn.text; rssModel.authPass=passIn.text; rssModel.tags='my timeline';}
+                KeyNavigation.right: guest
+                KeyNavigation.up: passIn
+                Keys.onReturnPressed: login.doLogin();
+                Keys.onSelectPressed: login.doLogin();
+                Keys.onSpacePressed: login.doLogin();
+                onClicked: login.doLogin();
             }
             Button {
-                x: 120
                 width: 100
                 height: 32
                 id: guest
+                keyUsing: true;
+                function doGuest()
+                {
+                    rssModel.authName='-';
+                    screen.focus = true;
+                    screen.setMode(true);
+                }
                 text: "Guest"
-                onClicked: {rssModel.authName='-'; screen.setMode(true);}
+                KeyNavigation.left: login
+                KeyNavigation.up: passIn
+                Keys.onReturnPressed: guest.doGuest();
+                Keys.onSelectPressed: guest.doGuest();
+                Keys.onSpacePressed: guest.doGuest();
+                onClicked: guest.doGuest();
             }
         }
     }
diff --git a/demos/declarative/twitter/content/Button.qml b/demos/declarative/twitter/content/Button.qml
index 770330c..09d471c 100644
--- a/demos/declarative/twitter/content/Button.qml
+++ b/demos/declarative/twitter/content/Button.qml
@@ -6,6 +6,7 @@ Item {
     signal clicked
 
     property string text
+    property bool keyUsing: false
 
     BorderImage {
         id: buttonImage
@@ -24,15 +25,25 @@ Item {
         onClicked: { container.clicked(); }
     }
     Text {
-        color: "white"
+        id: btnText
+        color: if(container.keyUsing){"#DDDDDD";} else {"#FFFFFF";}
         anchors.centerIn: buttonImage; font.bold: true
         text: container.text; style: Text.Raised; styleColor: "black"
+        font.pixelSize: 12
     }
     states: [
         State {
             name: "Pressed"
             when: mouseRegion.pressed == true
             PropertyChanges { target: pressed; opacity: 1 }
+        },
+        State {
+            name: "Focused"
+            when: container.focus == true
+            PropertyChanges { target: btnText; color: "#FFFFFF" }
         }
     ]
+    transitions: Transition {
+        ColorAnimation { target: btnText; }
+    }
 }
diff --git a/demos/declarative/twitter/content/FatDelegate.qml b/demos/declarative/twitter/content/FatDelegate.qml
index 7125746..23b4838 100644
--- a/demos/declarative/twitter/content/FatDelegate.qml
+++ b/demos/declarative/twitter/content/FatDelegate.qml
@@ -10,7 +10,7 @@ Component {
                     setUser(link.slice(7));
                     screen.setMode(true);
                 }else if(link.slice(0,4) == 'http'){
-                    Qt.DesktopServices.openUrl(link);
+                    Qt.openUrlExternally(link);
                 }
             }
             function addTags(str){
diff --git a/demos/declarative/twitter/content/HomeTitleBar.qml b/demos/declarative/twitter/content/HomeTitleBar.qml
index b4f24ea..2cd1447 100644
--- a/demos/declarative/twitter/content/HomeTitleBar.qml
+++ b/demos/declarative/twitter/content/HomeTitleBar.qml
@@ -25,7 +25,6 @@ Item {
                     }
                 }
                 postman.send(postData);
-
                 editor.text = ""
                 titleBar.state = ""
             }
@@ -52,7 +51,7 @@ Item {
             anchors.verticalCenter: parent.verticalCenter
             elide: Text.ElideLeft
             text: "Timeline for " + rssModel.authName
-            font.pointSize: 10; font.bold: true; color: "white"; style: Text.Raised; styleColor: "black"
+            font.pixelSize: 12; font.bold: true; color: "white"; style: Text.Raised; styleColor: "black"
         }
 
         Button {
diff --git a/demos/declarative/twitter/content/RssModel.qml b/demos/declarative/twitter/content/RssModel.qml
index 144d7af..9d88bb7 100644
--- a/demos/declarative/twitter/content/RssModel.qml
+++ b/demos/declarative/twitter/content/RssModel.qml
@@ -11,7 +11,8 @@ Item { id: wrapper
 XmlListModel {
     id: xmlModel
 
-    source: if (wrapper.authName == ""){
+    source:{ 
+            if (wrapper.authName == ""){
                 ""; //Avoid worthless calls to twitter servers
             }else if(wrapper.mode == 'user'){
                 "https://"+ ((wrapper.authName!="" && wrapper.authPass!="")? (wrapper.authName+":"+wrapper.authPass+"@") : "" )+"twitter.com/statuses/user_timeline.xml?screen_name="+wrapper.tags;
@@ -20,6 +21,7 @@ XmlListModel {
             }else{//everyone/public
                 "http://twitter.com/statuses/public_timeline.xml";
             }
+    }
     query: "/statuses/status"
 
     XmlRole { name: "statusText"; query: "text/string()" }
diff --git a/demos/declarative/twitter/content/TitleBar.qml b/demos/declarative/twitter/content/TitleBar.qml
index 0341585..28e7389 100644
--- a/demos/declarative/twitter/content/TitleBar.qml
+++ b/demos/declarative/twitter/content/TitleBar.qml
@@ -28,6 +28,7 @@ Item {
             elide: Text.ElideLeft
             text: (rssModel.tags=="" ? untaggedString : taggedString + rssModel.tags)
             font.bold: true; color: "White"; style: Text.Raised; styleColor: "Black"
+            font.pixelSize: 12
         }
 
         Button {
diff --git a/demos/declarative/twitter/twitter.qml b/demos/declarative/twitter/twitter.qml
index db1ae39..bb7da9c 100644
--- a/demos/declarative/twitter/twitter.qml
+++ b/demos/declarative/twitter/twitter.qml
@@ -22,6 +22,8 @@ Item {
         function reallySetUser(){rssModel.tags = tmpStr;}
     }
 
+    //TODO: better way to return to the auth screen
+    Keys.onEscapePressed: rssModel.authName=''
     Rectangle {
         id: background
         anchors.fill: parent; color: "#343434";