StocQt example: Prefetch values for stock list model

Instead of doing a network request for each item
in the stock list, prefetch values for all entries
when creating the model. This improves performance
when scrolling the list.

Task-number: QTBUG-56114
Change-Id: I12f0012ec0a97f2bf03b53a5b51076171cd7fc7a
Reviewed-by: Venugopal Shivashankar <Venugopal.Shivashankar@qt.io>

2 files changed, 66 insertions, 60 deletions

diff --git a/examples/quick/demos/stocqt/content/StockListModel.qml b/examples/quick/demos/stocqt/content/StockListModel.qml
index be00e7bb1c..9b48124bda 100644
--- a/examples/quick/demos/stocqt/content/StockListModel.qml
+++ b/examples/quick/demos/stocqt/content/StockListModel.qml
@@ -42,6 +42,72 @@ import QtQuick 2.0
 
 ListModel {
     id: stocks
+
+    // pre-fetch data for all entries
+    Component.onCompleted: {
+        for (var idx = 0; idx < count; ++idx) {
+            getCloseValue(idx)
+        }
+    }
+
+    function requestUrl(stockId) {
+        var endDate = new Date(""); // today
+        var startDate = new Date()
+        startDate.setDate(startDate.getDate() - 5);
+
+        var request = "http://ichart.finance.yahoo.com/table.csv?";
+        request += "s=" + stockId;
+        request += "&g=d";
+        request += "&a=" + startDate.getMonth();
+        request += "&b=" + startDate.getDate();
+        request += "&c=" + startDate.getFullYear();
+        request += "&d=" + endDate.getMonth();
+        request += "&e=" + endDate.getDate();
+        request += "&f=" + endDate.getFullYear();
+        request += "&g=d";
+        request += "&ignore=.csv";
+        return request;
+    }
+
+    function getCloseValue(index) {
+        var req = requestUrl(get(index).stockId);
+
+        if (!req)
+            return;
+
+        var xhr = new XMLHttpRequest;
+
+        xhr.open("GET", req, true);
+
+        xhr.onreadystatechange = function() {
+            if (xhr.readyState === XMLHttpRequest.LOADING || xhr.readyState === XMLHttpRequest.DONE) {
+                var records = xhr.responseText.split('\n');
+                if (records.length > 0 && xhr.status == 200) {
+                    var r = records[1].split(',');
+                    var today = parseFloat(r[4]);
+                    setProperty(index, "value", today.toFixed(2));
+
+                    r = records[2].split(',');
+                    var yesterday = parseFloat(r[4]);
+                    var change = today - yesterday;
+                    if (change >= 0.0)
+                        setProperty(index, "change", "+" + change.toFixed(2));
+                    else
+                        setProperty(index, "change", change.toFixed(2));
+
+                    var changePercentage = (change / yesterday) * 100.0;
+                    if (changePercentage >= 0.0)
+                        setProperty(index, "changePercentage", "+" + changePercentage.toFixed(2) + "%");
+                    else
+                        setProperty(index, "changePercentage", changePercentage.toFixed(2) + "%");
+                } else {
+                    var unknown = "n/a";
+                    set(index, {"value": unknown, "change": unknown, "changePercentage": unknown});
+                }
+            }
+        }
+        xhr.send()
+    }
     // Uncomment to test invalid entries
     // ListElement {name: "The Qt Company"; stockId: "TQTC"; value: "999.0"; change: "0.0"; changePercentage: "0.0"}
 
diff --git a/examples/quick/demos/stocqt/content/StockListView.qml b/examples/quick/demos/stocqt/content/StockListView.qml
index 59f36b42cc..d2bd52a69d 100644
--- a/examples/quick/demos/stocqt/content/StockListView.qml
+++ b/examples/quick/demos/stocqt/content/StockListView.qml
@@ -64,65 +64,6 @@ Rectangle {
         model: StockListModel{}
         currentIndex: -1 // Don't pre-select any item
 
-        function requestUrl(stockId) {
-            var endDate = new Date(""); //today
-            var startDate = new Date()
-            startDate.setDate(startDate.getDate() - 5);
-
-            var request = "http://ichart.finance.yahoo.com/table.csv?";
-            request += "s=" + stockId;
-            request += "&g=d";
-            request += "&a=" + startDate.getMonth();
-            request += "&b=" + startDate.getDate();
-            request += "&c=" + startDate.getFullYear();
-            request += "&d=" + endDate.getMonth();
-            request += "&e=" + endDate.getDate();
-            request += "&f=" + endDate.getFullYear();
-            request += "&g=d";
-            request += "&ignore=.csv";
-            return request;
-        }
-
-        function getCloseValue(index) {
-            var req = requestUrl(model.get(index).stockId);
-
-            if (!req)
-                return;
-
-            var xhr = new XMLHttpRequest;
-
-            xhr.open("GET", req, true);
-
-            xhr.onreadystatechange = function() {
-                if (xhr.readyState === XMLHttpRequest.LOADING || xhr.readyState === XMLHttpRequest.DONE) {
-                    var records = xhr.responseText.split('\n');
-                    if (records.length > 0 && xhr.status == 200) {
-                        var r = records[1].split(',');
-                        var today = parseFloat(r[4]);
-                        model.setProperty(index, "value", today.toFixed(2));
-
-                        r = records[2].split(',');
-                        var yesterday = parseFloat(r[4]);
-                        var change = today - yesterday;
-                        if (change >= 0.0)
-                            model.setProperty(index, "change", "+" + change.toFixed(2));
-                        else
-                            model.setProperty(index, "change", change.toFixed(2));
-
-                        var changePercentage = (change / yesterday) * 100.0;
-                        if (changePercentage >= 0.0)
-                            model.setProperty(index, "changePercentage", "+" + changePercentage.toFixed(2) + "%");
-                        else
-                            model.setProperty(index, "changePercentage", changePercentage.toFixed(2) + "%");
-                    } else {
-                        var unknown = "n/a";
-                        model.set(index, {"value": unknown, "change": unknown, "changePercentage": unknown});
-                    }
-                }
-            }
-            xhr.send()
-        }
-
         onCurrentIndexChanged: {
             if (currentItem) {
                 root.currentStockId = model.get(currentIndex).stockId;
@@ -175,7 +116,6 @@ Rectangle {
                 horizontalAlignment: Text.AlignRight
                 verticalAlignment: Text.AlignVCenter
                 text: value
-                Component.onCompleted: view.getCloseValue(index);
             }
 
             Text {