Release 0.4-0

[marketstoday] / src / qml / StockDetailsComponent.qml

diff --git a/src/qml/StockDetailsComponent.qml b/src/qml/StockDetailsComponent.qml
index 322f9e9..ff62e44 100644 (file)
--- a/src/qml/StockDetailsComponent.qml
+++ b/src/qml/StockDetailsComponent.qml
@@ -1,5 +1,5 @@
 /*
-@version: 0.2
+@version: 0.4
 @author: Sudheer K. <scifi1947 at gmail.com>
 @license: GNU General Public License
 */
@@ -29,13 +29,12 @@ Item {
     property string baseChartURL: "http://chart.finance.yahoo.com/z?q=&l=&z=m&p=s&a=v&p=s&lang=en-US&region=US"
     property string chartURL: ""
     property string rssURL: ""
+    property string orientation: "Portrait"
 
     property int currentScreenIndex: 1
 
     signal logRequest(string strMessage)
     signal loadChart(string duration)
-    signal lockInLandscape()
-    signal unlockOrientation()
 
     Rectangle {
         anchors.fill: parent
@@ -59,12 +58,10 @@ Item {
         function switchScreen(){
             switch (currentScreenIndex){
             case 1:
-                stockDetailsScreen.lockInLandscape();
-                stockDetailsLoader.sourceComponent = stockChartComponent;
+                stockDetailsLoader.sourceComponent = (stockDetailsScreen.width > stockDetailsScreen.height)? stockChartComponentLandscape : stockChartComponentPortrait;
                 currentScreenIndex = currentScreenIndex + 1;
                 break;
             case 2:
-                stockDetailsScreen.unlockOrientation();
                 stockDetailsLoader.sourceComponent = stockDetailsComponent;
                 currentScreenIndex = currentScreenIndex - 1;
                 break;
@@ -341,28 +338,74 @@ Item {
 
         Loader {
           id: stockDetailsLoader
-          anchors{top: parent.top; bottom: parent.bottom
+          anchors{top: parent.top; bottom: parent.bottom; bottomMargin: 20;
                   left: parent.left; leftMargin: 10
                   right:  parent.right; rightMargin: 10}
           sourceComponent: stockDetailsComponent
+
+          Connections{
+              target: stockDetailsScreen
+              onOrientationChanged: {
+                  logRequest("Orientation Changed");
+                  logRequest("New orientation is "+stockDetailsScreen.orientation);
+                  logRequest("Margins for StockDetailsLoader are "+stockDetailsLoader.anchors.leftMargin+", "+stockDetailsLoader.anchors.rightMargin);
+
+                  if (currentScreenIndex === 2){
+                      if (stockDetailsScreen.orientation == "Landscape")
+                          stockDetailsLoader.sourceComponent = stockChartComponentLandscape;
+                      else
+                          stockDetailsLoader.sourceComponent = stockChartComponentPortrait;
+                  }
+              }
+          }
         }
 
+        Rectangle{
+            id: footerText
+            width: parent.width
+            height: 20
+            z: 5
+            color: "#343434"
+            anchors.top: stockDetailsLoader.bottom
+            Text {
+                id: footerMessage
+                anchors.fill: parent
+                text: "Swipe horizontally to switch between details and charts."
+                horizontalAlignment: Text.AlignRight; verticalAlignment: Text.AlignVCenter
+                width: parent.width; font.pixelSize: 12; elide: Text.ElideRight;
+                color: "#cccccc"
+                style: Text.Raised; styleColor: "black"
+            }
+
+            Timer {
+                id: footerMessageTimer
+                interval: 10000
+                repeat: false
+                onTriggered: {
+                    footerMessage.text = "";
+                }
+            }
+
+            Component.onCompleted: {
+                footerMessageTimer.start();
+            }
+        }
 
         Component{
-            id: stockChartComponent
+            id: stockChartComponentLandscape
 
             Item {
-                id: chartAreaWrapper
+                id: chartAreaWrapperLand
                 anchors.fill: parent
 
                 Rectangle {
-                    id: chartArea
+                    id: chartAreaLand
                     border.width: 1
                     border.color: "#BFBFBF"
                     //color:"#2E2E2E"
                     color:"white"
                     anchors { top: parent.top;topMargin: 40;
-                              bottom: parent.bottom; bottomMargin: 40;
+                              bottom: parent.bottom; bottomMargin: 20;
                               left: parent.left; right: parent.right}
                     radius: 10
 
@@ -407,14 +450,13 @@ Item {
                         width: 130
                         spacing: 20
                         anchors {top: parent.top; topMargin: 40; bottom: parent.bottom;
-                                 right: chartArea.right;rightMargin: 10}
+                                 right: chartAreaLand.right;rightMargin: 10}
 
                         Row {
                             height: 40
                             spacing: 20
                             anchors.horizontalCenter: parent.horizontalCenter
                             Library.Button {
-                                id: oneDayButton
                                 text:  "1d"
                                 anchors { verticalCenter: parent.verticalCenter}
                                 width: 50; height: 32
@@ -422,7 +464,6 @@ Item {
                             }
 
                             Library.Button {
-                                id: fiveDayButton
                                 text:  "5d"
                                 anchors { verticalCenter: parent.verticalCenter}
                                 width: 50; height: 32
@@ -435,7 +476,6 @@ Item {
                             spacing: 20
                             anchors.horizontalCenter: parent.horizontalCenter
                             Library.Button {
-                                id: threeMonthButton
                                 text:  "3m"
                                 anchors { verticalCenter: parent.verticalCenter}
                                 width: 50; height: 32
@@ -443,7 +483,6 @@ Item {
                             }
 
                             Library.Button {
-                                id: sixMonthButton
                                 text:  "6m"
                                 anchors { verticalCenter: parent.verticalCenter}
                                 width: 50; height: 32
@@ -455,7 +494,6 @@ Item {
                             spacing: 20
                             anchors.horizontalCenter: parent.horizontalCenter
                             Library.Button {
-                                id: oneYearButton
                                 text:  "1y"
                                 anchors { verticalCenter: parent.verticalCenter}
                                 width: 50; height: 32
@@ -463,7 +501,6 @@ Item {
                             }
 
                             Library.Button {
-                                id: twoYearButton
                                 text:  "2y"
                                 anchors { verticalCenter: parent.verticalCenter}
                                 width: 50; height: 32
@@ -475,7 +512,6 @@ Item {
                             spacing: 20
                             anchors.horizontalCenter: parent.horizontalCenter
                             Library.Button {
-                                id: fiveYearButton
                                 text:  "5y"
                                 anchors { verticalCenter: parent.verticalCenter}
                                 width: 50; height: 32
@@ -483,7 +519,6 @@ Item {
                             }
 
                             Library.Button {
-                                id: maxButton
                                 text:  "max"
                                 anchors { verticalCenter: parent.verticalCenter}
                                 width: 50; height: 32
@@ -494,5 +529,138 @@ Item {
                 }
             }
         }
+
+        Component{
+            id: stockChartComponentPortrait
+
+            Item {
+                id: chartAreaWrapperPort
+                anchors.fill: parent
+
+                Rectangle {
+                    id: chartAreaPort
+                    border.width: 1
+                    border.color: "#BFBFBF"
+                    //color:"#2E2E2E"
+                    color:"white"
+                    anchors { top: parent.top;topMargin: 40;
+                              bottom: parent.bottom; bottomMargin: 20;
+                              left: parent.left; right: parent.right}
+                    radius: 10
+
+                    Library.Loading { anchors.centerIn: parent; visible: chartImgPort.status == Image.Loading}
+
+                    Image {
+                        id: chartImgPort
+                        //anchors {left: parent.left; leftMargin: 10; horizontalCenter: parent.horizontalCenter}
+                        anchors {horizontalCenter: parent.horizontalCenter; top: parent.top; topMargin: 40}
+                        source: chartURL
+                        sourceSize.width: 512
+                        sourceSize.height: 288
+                        smooth: true
+                        fillMode: Image.PreserveAspectFit
+                        width: parent.width - 20
+                        onStatusChanged: {
+                            switch(status){
+                                case Image.Ready:
+                                    logRequest("Image is ready");
+                                    break;
+                                case Image.Loading:
+                                    logRequest("Image is loading");
+                                    break;
+                                case Image.Error:
+                                    logRequest("Image loading failed");
+                                    break;
+                                default:
+                                    logRequest("No image specified");
+                                    break;
+                            }
+
+                        }
+
+                        Connections{
+                            target: stockDetailsScreen
+                            onLoadChart: {
+                                chartURL = baseChartURL+"&t="+duration+"&s="+symbol;
+                                logRequest(chartURL);
+                            }
+                        }
+                    }
+
+                    Column {
+                        width: 280
+                        spacing: 20
+                        anchors {verticalCenter: parent.verticalCenter;verticalCenterOffset: 80; horizontalCenter: parent.horizontalCenter}
+
+                        Row {
+                            height: 40
+                            spacing: 20
+                            anchors.horizontalCenter: parent.horizontalCenter
+                            Library.Button {
+                                text:  "1d"
+                                anchors { verticalCenter: parent.verticalCenter}
+                                width: 50; height: 32
+                                onClicked: loadChart("1d");
+                            }
+
+                            Library.Button {
+                                text:  "5d"
+                                anchors { verticalCenter: parent.verticalCenter}
+                                width: 50; height: 32
+                                onClicked: loadChart("5d");
+                            }
+
+                            Library.Button {
+                                text:  "3m"
+                                anchors { verticalCenter: parent.verticalCenter}
+                                width: 50; height: 32
+                                onClicked: loadChart("3m");
+                            }
+
+                            Library.Button {
+                                text:  "6m"
+                                anchors { verticalCenter: parent.verticalCenter}
+                                width: 50; height: 32
+                                onClicked: loadChart("6m");
+                            }
+                        }
+
+                        Row {
+                            height: 40
+                            spacing: 20
+                            anchors.horizontalCenter: parent.horizontalCenter
+                            Library.Button {
+                                text:  "1y"
+                                anchors { verticalCenter: parent.verticalCenter}
+                                width: 50; height: 32
+                                onClicked: loadChart("1y");
+                            }
+
+                            Library.Button {
+                                text:  "2y"
+                                anchors { verticalCenter: parent.verticalCenter}
+                                width: 50; height: 32
+                                onClicked: loadChart("2y");
+                            }
+
+                            Library.Button {
+                                text:  "5y"
+                                anchors { verticalCenter: parent.verticalCenter}
+                                width: 50; height: 32
+                                onClicked: loadChart("5y");
+                            }
+
+                            Library.Button {
+                                text:  "max"
+                                anchors { verticalCenter: parent.verticalCenter}
+                                width: 50; height: 32
+                                onClicked: loadChart("my");
+                            }
+                        }
+                    }
+                }
+            }
+        }
+
     }
 }