Details Screen Started

diff --git a/src/qml/StockDetailsComponent.qml b/src/qml/StockDetailsComponent.qml
new file mode 100644 (file)
index 0000000..ad1e724
--- /dev/null
+++ b/src/qml/StockDetailsComponent.qml
@@ -0,0 +1,143 @@
+/*
+@version: 0.1
+@author: Sudheer K. <scifi1947 at gmail.com>
+@license: GNU General Public License
+*/
+
+import Qt 4.7
+
+Item {
+
+    width: 800
+    height: 380
+
+    id: stockDetailsComponent
+    property int itemHeight: 50
+    property string symbol: "YHOO"
+    property string stockName: "Yahoo"
+    property string lastTradedPrice: ""
+    property string lastTradedTime: ""
+    property string change: ""
+    property string changePercentage: ""
+    property string dayLow: ""
+    property string dayHigh: ""
+    property string fiftyTwoWeekLow: ""
+    property string fiftyTwoWeekHigh: ""
+    property string marketVolume: ""
+    property string prevClose: ""
+    property string marketCap: ""
+    property string chartURL: ""
+
+    signal logRequest(string strMessage)
+
+    Rectangle {
+        anchors.fill: parent
+        color:"#343434"
+
+        Component.onCompleted: {
+            loadDetails();
+            if (symbol !== "") {
+                chartURL = "http://chart.finance.yahoo.com/z?t=1d&q=&l=&z=m&p=s&a=v&p=s&lang=en-US&region=US&s="+symbol;
+                stockDetailsLoader.sourceComponent = stockChartComponent;
+                console.log(stockDetailsLoader.width + " x "+ stockDetailsLoader.height);
+            }
+        }
+
+        function loadDetails(){
+            if (symbol === "") return;
+
+        }
+
+        Text {
+            id: stockNameLabel
+            anchors.top: parent.top
+            width: parent.width
+            anchors.horizontalCenter: parent.horizontalCenter
+            height: 30
+            horizontalAlignment: Text.AlignHCenter; verticalAlignment: Text.AlignVCenter
+            font.pixelSize: 18; font.bold: true; elide: Text.ElideMiddle; color: "#B8B8B8"; style: Text.Raised; styleColor: "black"
+            text: (stockName != "")? (stockName +" ("+symbol+")"):symbol
+        }
+
+        Rectangle {
+            id: stockDetailsSection
+            border.width: 1
+            border.color: "#BFBFBF"
+            color:"#2E2E2E"
+            anchors {top: stockNameLabel.bottom;left: parent.left;leftMargin: 40;right: parent.right;rightMargin: 40}
+            height: 125
+            radius: 15
+
+            Column{
+                id: stockDetailsColumn
+                anchors {top: parent.top; left: parent.left; leftMargin: 10}
+                width: (parent.width - 10)
+
+                StockDetailsRow{
+                    label1: "Last Traded"
+                    value1: lastTradedPrice
+                    cell1Width: stockDetailsColumn.width/2
+
+                    label2: "Day's Range"
+                    value2: ((dayHigh != "" && dayLow != "")? (dayLow + " - " + dayHigh) : "")
+                    cell2Width: stockDetailsColumn.width/2
+                }
+
+                StockDetailsRow{
+                    label1: "Last Trade Time"
+                    value1: lastTradedTime
+                    cell1Width: stockDetailsColumn.width/2
+
+                    label2: "52w Range"
+                    value2: ((fiftyTwoWeekHigh != "" && fiftyTwoWeekLow != "")? (fiftyTwoWeekLow + " - " + fiftyTwoWeekHigh) : "")
+                    cell2Width: stockDetailsColumn.width/2
+                }
+
+                StockDetailsRow{
+                    label1: "Change"
+                    value1: ((change != "" && changePercentage != "")? change + " ("+changePercentage+")":"")
+                    cell1Width: stockDetailsColumn.width/2
+
+                    label2: "Volume"
+                    value2: marketVolume
+                    cell2Width: stockDetailsColumn.width/2
+                }
+
+                StockDetailsRow{
+                    label1: "Prev. Close"
+                    value1: prevClose
+                    cell1Width: stockDetailsColumn.width/2
+
+                    label2: "Market Cap"
+                    value2: marketCap
+                    cell2Width: stockDetailsColumn.width/2
+                }
+            }
+        }
+
+        Loader {
+          id: stockDetailsLoader
+          anchors {top: stockDetailsSection.bottom;bottom: parent.bottom; horizontalCenter: parent.horizontalCenter}
+          //width: parent.width
+          width: 480
+        }
+
+        Component{
+            id: stockChartComponent
+            Rectangle {
+                id: rectangleChart
+                border.width: 1
+                border.color: "#BFBFBF"
+                color:"#2E2E2E"
+                anchors {top: parent.top;topMargin: 5;bottom: parent.bottom; left: parent.left;leftMargin: 40;right: parent.right;rightMargin: 40}
+                radius: 15
+                Image {
+                    anchors.fill: parent
+                    id: name
+                    source: chartURL
+                    fillMode: Image.PreserveAspectFit
+                }
+            }
+        }
+    }
+}

diff --git a/src/qml/StockDetailsRow.qml b/src/qml/StockDetailsRow.qml
new file mode 100644 (file)
index 0000000..70cec79
--- /dev/null
+++ b/src/qml/StockDetailsRow.qml
@@ -0,0 +1,37 @@
+/*
+@version: 0.1
+@author: Sudheer K. <scifi1947 at gmail.com>
+@license: GNU General Public License
+*/
+
+import Qt 4.7
+
+Row{
+    property string label1
+    property string value1
+    property int cell1Width
+    property string label2
+    property string value2
+    property int cell2Width
+
+    height: 30
+    spacing: 5
+
+    Text{
+        width: cell1Width
+        height: itemHeight
+        horizontalAlignment: Text.AlignLeft; verticalAlignment: Text.AlignVCenter
+        font.pixelSize: 14;font.bold: false; elide: Text.ElideRight; style: Text.Raised; styleColor: "black"
+        color: "#ffffff";
+        text: label1+": " + value1
+    }
+
+    Text{
+        width: cell2Width
+        height: itemHeight
+        horizontalAlignment: Text.AlignLeft; verticalAlignment: Text.AlignVCenter
+        font.pixelSize: 14; font.bold: false; elide: Text.ElideRight; style: Text.Raised; styleColor: "black"
+        color: "#ffffff";
+        text: label2+": " + value2
+    }
+}

diff --git a/src/qml/StockQuotesComponent.qml b/src/qml/StockQuotesComponent.qml
deleted file mode 100644 (file)
index 11124d9..0000000
--- a/src/qml/StockQuotesComponent.qml
+++ /dev/null
@@ -1,135 +0,0 @@
-/*
-@version: 0.1
-@author: Sudheer K. <scifi1947 at gmail.com>
-@license: GNU General Public License
-*/
-
-import Qt 4.7
-import "Library" as Library
-import "Library/js/ISODate.js" as DateLib
-
-Rectangle {
-    id: stockQuotesComponent
-    clip: true
-    color: "#343434"
-
-    signal updateStarted
-    signal updateCompleted
-
-    property ListModel stockQuotesListModel
-    property string lastUpdatedTimeStamp
-    property int componentWidth
-    property int componentHeight
-    property int itemHeight: 50
-
-    Component {
-        id: stockQuotesDelegate
-
-        Item {
-            id: wrapper; width: componentWidth; height: itemHeight
-            Item {
-                Rectangle { color: "black"; opacity: index % 2 ? 0.2 : 0.4; height: wrapper.height - 2; width: wrapper.width; y: 1 }
-                Row {
-                    x: 30;y: 15;
-                    width: componentWidth - 40;
-                    spacing: 5
-
-                    Text { text: if (width >= 250) {stockName;} else {symbol;} width: parent.width * 35/100; font.pixelSize: 18; font.bold: true; elide: Text.ElideRight; color: "white"; style: Text.Raised; styleColor: "black" }
-                    Text { text: lastTradedPrice; width: parent.width * 25/100; font.pixelSize: 18; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" }
-                    Text { text: change; width: parent.width * 20/100; font.pixelSize: 18; elide: Text.ElideRight
-                        color: if(change >= 0){"green";} else {"red";}
-                            style: Text.Raised; styleColor: "black" }
-                    Text { text: changePercentage; width: parent.width * 20/100; font.pixelSize: 18; elide: Text.ElideRight;
-                        color: if(change >= 0){"green";} else {"red";}
-                            style: Text.Raised; styleColor: "black" }
-                }
-            }
-        }
-    }
-
-    Rectangle{
-        id: pathViewWrapper
-        width: parent.width
-        anchors.top: parent.top
-        anchors.bottom: footerText.top
-        color: "#343434"
-
-        PathView{
-            id: stockQuotesView
-            flickDeceleration: 500
-            //preferredHighlightBegin: 1/stockQuotesView.count
-            //preferredHighlightEnd: 1/stockQuotesView.count
-            //pathItemCount: count
-            focus: true
-            interactive: true
-            model: stockQuotesListModel
-            delegate:  stockQuotesDelegate
-            path: Path {
-                startX: width / 2
-                startY: itemHeight/2
-                PathLine {
-                    x: width / 2
-                    y: stockQuotesView.count * itemHeight  + itemHeight/2
-                }
-            }
-            Keys.onDownPressed: if (!moving && interactive) {
-                                    console.log(stockQuotesView.height);
-                                    incrementCurrentIndex();
-                                }
-            Keys.onUpPressed: if (!moving && interactive) decrementCurrentIndex()
-
-            Connections {
-                target:  stockQuotesComponent
-                onUpdateCompleted:{
-                    stockQuotesView.currentIndex = 0;
-                }
-            }
-
-        }
-    }
-
-    Rectangle{
-        id: footerText
-        width: parent.width
-        height: 25
-        color: "#343434"
-        anchors.bottom: toolBar.top
-        Text {
-            id: timeStamp
-            anchors.fill: parent
-            text: stockQuotesComponent.lastUpdatedTimeStamp
-            horizontalAlignment: Text.AlignRight; verticalAlignment: Text.AlignVCenter
-            width: parent.width; font.pixelSize: 12; elide: Text.ElideRight;
-            color: "#cccccc"
-            style: Text.Raised; styleColor: "black"
-
-            Connections {
-                target: stockQuotesComponent
-                onUpdateCompleted:{
-                    timeStamp.text = stockQuotesComponent.lastUpdatedTimeStamp;
-                }
-            }
-        }
-    }
-
-    Library.ToolBar {
-        id:toolBar
-        width: parent.width; height: 40
-        anchors.bottom: parent.bottom
-        opacity: 0.9
-        onReloadButtonClicked: reloadQuotes();
-        onDownButtonClicked: if (!stockQuotesView.moving && stockQuotesView.interactive) stockQuotesView.currentIndex = stockQuotesView.currentIndex + 1
-        onUpButtonClicked: if (!stockQuotesView.moving && stockQuotesView.interactive) stockQuotesView.currentIndex = stockQuotesView.currentIndex - 1
-        onNewsButtonClicked: Qt.openUrlExternally("http://finance.yahoo.com");
-        Connections {
-            target: stockQuotesComponent
-            onUpdateStarted:{
-                if (!toolBar.updatePending) toolBar.updatePending = true;
-            }
-            onUpdateCompleted:{
-                toolBar.updatePending = false;
-                console.log(stockQuotesComponent.lastUpdatedTimeStamp);
-            }
-        }
-    }
-}