From 3adef4c0354db34494fcac678712490d0b7fe466 Mon Sep 17 00:00:00 2001 From: Sudheer K Date: Sun, 5 May 2013 00:13:25 -0700 Subject: [PATCH] Harmattan font size changes testing --- src/qml/Library/js/Common.js | 48 ++++++++++++++++++++++++++++++++++++++- src/qml/Library/js/CoreLogic.js | 8 +++---- src/qml/MarketsTodayApp.qml | 35 +++++++++++++++------------- 3 files changed, 70 insertions(+), 21 deletions(-) diff --git a/src/qml/Library/js/Common.js b/src/qml/Library/js/Common.js index d781a0f..56ce2a9 100644 --- a/src/qml/Library/js/Common.js +++ b/src/qml/Library/js/Common.js @@ -6,6 +6,52 @@ function isTodayAWeekDay(){ var dayOfWeek = (new Date()).getDay(); - var isWeekDay = (dayOfWeek == 0 || dayOfWeek == 6)? false : true; + var isWeekDay = (dayOfWeek === 0 || dayOfWeek === 6)? false : true; return isWeekDay; } + + + +/** +* Enforce a specific amount of decimal digits and also fix floating +* point rounding issues. +* @example `enforcePrecision(0.615, 2) -> 0.62`, `(0.615).toFixed(2) -> +* 0.61` +*/ +function enforcePrecision(val, nDecimalDigits){ + var pow = Math.pow(10, nDecimalDigits); + return +(Math.round(val * pow) / pow).toFixed(nDecimalDigits); +} + +var _defaultDict = { + thousand : 'K', + million : 'M', + billion : 'B' +}; + + +/** +* Abbreviate number if bigger than 1000. (eg: 2.5K, 17.5M, 3.4B, ...) +*/ +function abbreviateNumber(val, nDecimals, dict){ + nDecimals = nDecimals !== null? nDecimals : 1; + dict = dict || _defaultDict; + val = enforcePrecision(val, nDecimals); + + var str, mod; + + if (val < 1000){ + str = val; + } else if (val < 1000000) { + mod = enforcePrecision(val / 1000, nDecimals); + // might overflow to next scale during rounding + str = mod < 1000? mod + dict.thousand : 1 + dict.million; + } else if (val < 1000000000) { + mod = enforcePrecision(val / 1000000, nDecimals); + str = mod < 1000? mod + dict.million : 1 + dict.billion; + } else { + str = enforcePrecision(val / 1000000000, nDecimals) + dict.billion; + } + + return str; +} diff --git a/src/qml/Library/js/CoreLogic.js b/src/qml/Library/js/CoreLogic.js index a843efd..630f894 100644 --- a/src/qml/Library/js/CoreLogic.js +++ b/src/qml/Library/js/CoreLogic.js @@ -112,10 +112,10 @@ function refreshDataModel(response){ symbol = quoteDetails[i][0]; stockName = quoteDetails[i][1]; lastTradedPrice = quoteDetails[i][2]; - change = quoteDetails[i][3]; - changePercentage = quoteDetails[i][4]; - volume = quoteDetails[i][5]; - marketCap = quoteDetails[i][6]; + change = (quoteDetails[i][3] !== 'N/A')? quoteDetails[i][3]:''; + changePercentage = (quoteDetails[i][4] !== 'N/A')? quoteDetails[i][4]:''; + volume = (quoteDetails[i][5] !== 'N/A')? quoteDetails[i][5]:''; + marketCap = (quoteDetails[i][6] !== 'N/A')? quoteDetails[i][6]:''; stockQuoteDataModel.append({"symbol":symbol,"stockName":stockName,"lastTradedPrice":lastTradedPrice,"change":change,"changePercentage":changePercentage,"volume":volume,"marketCap":marketCap}); //logUtility.logMessage("Symbol: "+stockQuoteDataModel.get(i).symbol+", Name: "+ stockQuoteDataModel.get(i).stockName+", LastTraded: "+stockQuoteDataModel.get(i).lastTradedPrice+", Change: "+stockQuoteDataModel.get(i).change+", ChangePercent: "+stockQuoteDataModel.get(i).changePercentage+", Volume: "+stockQuoteDataModel.get(i).volume+", MarketCap: "+stockQuoteDataModel.get(i).marketCap); diff --git a/src/qml/MarketsTodayApp.qml b/src/qml/MarketsTodayApp.qml index 8542773..f3ac3e8 100644 --- a/src/qml/MarketsTodayApp.qml +++ b/src/qml/MarketsTodayApp.qml @@ -43,9 +43,12 @@ PageStackWindow { Page { id: mainPage - property int itemHeight: 50 + property int itemHeight: 75 property int titleBarHeight: 60 property int toolBarHeight: 40 + property int fontSizeMed: 24 + property int fontSizeSmall: 20 + property int colSpacing: 4 property int componentWidth: mainPage.width function reloadData(){ @@ -128,16 +131,16 @@ PageStackWindow { } Row { - x: 30;y: 15; + x: 30;y: (wrapper.height - mainPage.fontSizeMed)/2; width: mainPage.componentWidth - 60; spacing: 5 - Text { text: stockName; width: parent.width * 30/100; font.pixelSize: 18; font.bold: true; elide: Text.ElideRight; color: "white"; style: Text.Raised; styleColor: "black" } - Text { text: lastTradedPrice; width: parent.width * 15/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" } - Text { text: change !== ""? (change + " ("+changePercentage+")"):""; width: parent.width * 25/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight + Text { text: stockName; width: parent.width * 30/100; font.pixelSize: mainPage.fontSizeMed; font.bold: true; elide: Text.ElideRight; color: "white"; style: Text.Raised; styleColor: "black" } + Text { text: lastTradedPrice; width: parent.width * 15/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" } + Text { text: change !== ""? (change + " ("+changePercentage+")"):""; width: parent.width * 25/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight color: change >= 0 ? "#00ff00":"#ff0000"; style: Text.Raised; styleColor: "black"} - Text { text: volume; width: parent.width * 15/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" } - Text { text: marketCap; width: parent.width * 15/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" } + Text { text: volume; width: parent.width * 18/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" } + Text { text: marketCap; width: parent.width * 12/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" } } } } @@ -163,24 +166,24 @@ PageStackWindow { } Row { - x: 10;y: 15; + x: 10;y: (wrapperItem.height - mainPage.fontSizeMed)/2; width: mainPage.componentWidth - 5; spacing: 3 - Text { text: stockName; width: parent.width * 42/100; font.pixelSize: 18; font.bold: true; elide: Text.ElideRight; color: "white"; style: Text.Raised; styleColor: "black" } - Text { text: lastTradedPrice; width: parent.width * 20/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" } + Text { text: stockName; width: parent.width * 42/100; font.pixelSize: mainPage.fontSizeMed; font.bold: true; elide: Text.ElideRight; color: "white"; style: Text.Raised; styleColor: "black"} + Text { text: lastTradedPrice; width: parent.width * 20/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black"} Column { - y: -15; + y: (wrapperItem.height - mainPage.colSpacing - mainPage.fontSizeSmall*2)/2 - (wrapperItem.height - mainPage.fontSizeMed)/2; width: parent.width * 18/100; height: parent.height - spacing: 2 - Text { text: change; font.pixelSize: 16; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight + spacing: mainPage.colSpacing + Text { text: change; font.pixelSize: mainPage.fontSizeSmall; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight color: change >= 0 ? "#00ff00":"#ff0000"; style: Text.Raised; styleColor: "black" } - Text { text: changePercentage; font.pixelSize: 16; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight; + Text { text: changePercentage; font.pixelSize: mainPage.fontSizeSmall; horizontalAlignment: Text.AlignLeft; elide: Text.ElideRight; color: change >= 0 ? "#00ff00":"#ff0000"; style: Text.Raised; styleColor: "black" } } - Text { text: volume; width: parent.width * 20/100; font.pixelSize: 18; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black" } + Text { text: volume !== ''? Common.abbreviateNumber(volume,2) :''; width: parent.width * 20/100; font.pixelSize: mainPage.fontSizeMed; horizontalAlignment: Text.AlignLeft; elide: Text.ElideLeft; color: "#cccccc"; style: Text.Raised; styleColor: "black"} } } } @@ -199,7 +202,7 @@ PageStackWindow { anchors.left: parent.left anchors.leftMargin: 10 anchors.right: parent.right - text: title; font.pixelSize: 18 + text: title; font.pixelSize: mainPage.fontSizeSmall font.bold: false; verticalAlignment: Text.AlignVCenter horizontalAlignment: Text.AlignLeft -- 1.7.9.5