Ubuntu Weather App

Merge lp:~jakub-a/ubuntu-weather-app/ubuntu-weather-app into lp:ubuntu-weather-app/obsolete.trunk

  1. ubuntu-weather-app
  2. Merge into trunk
Proposed by Jakub Motyczko
Status: Merged
Approved by: Martin Borho
Approved revision: 6
Merged at revision: 5
Proposed branch: lp:~jakub-a/ubuntu-weather-app/ubuntu-weather-app
Merge into: lp:ubuntu-weather-app/obsolete.trunk
Diff against target: 283 lines (+263/-0)
3 files modified
components/ChartComponent.js (+197/-0)
components/ChartComponent.qml (+63/-0)
weather.qml (+3/-0)
To merge this branch: bzr merge lp:~jakub-a/ubuntu-weather-app/ubuntu-weather-app
Reviewer Review Type Date Requested Status
Ubuntu Phone Apps Jenkins Bot continuous-integration Approve
Martin Borho Approve
Review via email: mp+153474@code.launchpad.net

Commit message

initial commit of Chart Component

Description of the change

initial commit of Chart Component

unfortunately it hasn't smooth lines as in the concept but I'm looking for solution.

To post a comment you must log in.
lp:~jakub-a/ubuntu-weather-app/ubuntu-weather-app updated
6. By Jakub Motyczko

removed all debugs

Revision history for this message
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote :

FAILED: Continuous integration, rev:6
No commit message was specified in the merge proposal. Click on the following link and set the commit message (if you want a jenkins rebuild you need to trigger it yourself):
https://code.launchpad.net/~jakub-a/ubuntu-weather-app/ubuntu-weather-app/+merge/153474/+edit-commit-message

http://91.189.93.125:8080/job/ubuntu-weather-app-ci/1/
Executed test runs:
    SUCCESS: http://91.189.93.125:8080/job/ubuntu-weather-app-quantal-amd64-ci/1/console
    SUCCESS: http://91.189.93.125:8080/job/ubuntu-weather-app-raring-amd64-ci/1/console

Click here to trigger a rebuild:
http://91.189.93.125:8080/job/ubuntu-weather-app-ci/1/rebuild

review: Needs Fixing (continuous-integration)
Revision history for this message
Martin Borho (martin-borho) wrote :

Hi Jakub,

did you specified a commit message already since the last jenkins build?

Cheers
Martin

> FAILED: Continuous integration, rev:6
> No commit message was specified in the merge proposal. Click on the following
> link and set the commit message (if you want a jenkins rebuild you need to
> trigger it yourself):
> https://code.launchpad.net/~jakub-a/ubuntu-weather-app/ubuntu-weather-
> app/+merge/153474/+edit-commit-message
>
> http://91.189.93.125:8080/job/ubuntu-weather-app-ci/1/
> Executed test runs:
> SUCCESS: http://91.189.93.125:8080/job/ubuntu-weather-app-quantal-
> amd64-ci/1/console
> SUCCESS: http://91.189.93.125:8080/job/ubuntu-weather-app-raring-
> amd64-ci/1/console
>
> Click here to trigger a rebuild:
> http://91.189.93.125:8080/job/ubuntu-weather-app-ci/1/rebuild

Revision history for this message
Martin Borho (martin-borho) :
review: Approve
Revision history for this message
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) :
review: Approve (continuous-integration)

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
=== added file 'components/ChartComponent.js'
--- components/ChartComponent.js 1970-01-01 00:00:00 +0000
+++ components/ChartComponent.js 2013-03-14 22:14:19 +0000
@@ -0,0 +1,197 @@
1.pragma library
2
3//canvas object from .pragma
4var canvas = 0;
5var chart = 0;
6
7//enables debugging
8var debug_enabled = 0;
9
10//measurements setted in QML
11var canvasHeight = 0;
12var canvasWidth = 0;
13var canvasXOffset = 0;
14var canvasYOffset = 0;
15
16//array of header labels(times)
17var xLabels = new Array();
18
19function debug(text)
20{
21 if (debug_enabled)
22 console.debug(text);
23}
24
25function refresh()
26{
27 canvas.requestPaint();
28}
29
30//main draw function
31function draw()
32{
33 var context = canvas.getContext("2d");
34 context.clearRect(0, 0, canvas.width, canvas.height);
35 context.save();
36 context.globalAlpha = canvas.alpha;
37
38 drawGrid(context);
39 drawTemperatures(context);
40 drawCurrentTime(context);
41 context.restore();
42}
43
44//draw background grid
45function drawGrid(context)
46{
47 //remove all xLabels
48 while (xLabels.length > 0)
49 {
50 var label = xLabels.pop();
51 label.text = "";
52 label.destroy();
53 }
54
55 var maxHSections = 24;
56 var hSectionSize = canvasWidth/maxHSections;
57
58 var hours = chart.xAxisHours;
59 var startX = 0, startY = 0, endX = 0, endY = 0;
60
61 //draw vertical lines
62 for (var i = 1 ; i < hours.length - 1; i++)
63 {
64 startX = hours[i]*hSectionSize + canvasXOffset;
65 startY = canvas.height;
66 endX = hours[i]*hSectionSize + canvasXOffset;
67 endY = canvasYOffset;
68 drawLine(context, startX, startY, endX, endY, chart.gridColor,1);
69 //create and add hourLabel to the array
70 xLabels.push(Qt.createQmlObject("import QtQuick 2.0;Text{text:\"" + hours[i] +":00\"; y:" + canvasYOffset + " - height; x:" + hours[i]*hSectionSize + "- width/2; color:\"" + chart.trendColor + "\"}", canvas, "labels"));
71 }
72
73 //draw horizontal lines
74 var vSectionSize = canvasHeight/(chart.gridHorizontalLinesCount + 1);
75 for (var i = 1 ; i < chart.gridHorizontalLinesCount +1 ; i++)
76 {
77 startX = canvasXOffset;
78 startY = i * vSectionSize + canvasYOffset;
79 endX = canvasXOffset+canvas.width;
80 endY = i*vSectionSize + canvasYOffset;
81
82 drawLine(context, startX, startY, endX, endY, chart.gridColor,1);
83 }
84}
85
86//draw current time vertical bar
87function drawCurrentTime(context)
88{
89 var currentMinutes = parseFloat(Qt.formatDateTime(new Date(), "m")) + (parseFloat(Qt.formatDateTime(new Date(), "h")) * 60);
90 var currentTimeWidth = 4;
91 var currentTimeColor = "#DD4814";
92 var position = ((currentMinutes * canvas.width)/(24 * 60)) - (currentTimeWidth/2);
93
94 drawLine(context,position+canvasXOffset, canvas.height,position+canvasXOffset,canvasYOffset+1, currentTimeColor, currentTimeWidth);
95}
96
97//draw temperature points and lines on the chart
98function drawTemperatures(context)
99{
100 context.strokeStyle = chart.trendColor;
101 context.lineWidth = chart.trendWidth;
102
103 var maxTemp = -999;
104 var minTemp = 999;
105 var circleColor = "#DD4814";
106 var circleRadius = 4;
107 var temperatures = chart.temperatures;
108
109 //determine min and max temp
110 for (var i = 0 ; i < temperatures.length ; i++)
111 {
112 if (parseFloat(temperatures[i].temp) > maxTemp)
113 maxTemp = temperatures[i].temp;
114 if (parseFloat(temperatures[i].temp) < minTemp)
115 minTemp = temperatures[i].temp;
116 }
117
118 var positions = new Array();
119
120 //draw temperature points
121 for (var i = 0 ; i < temperatures.length ; i++)
122 {
123 //get time and temp from array
124 var temp = temperatures[i].temp;
125 var times = temperatures[i].time.split(":");
126 var time = (parseFloat(times[0]) * 60) + parseFloat(times[1]);
127
128 //count X and Y based on canvas dimensions and offsets
129 var posX = canvasXOffset + ((time * canvas.width)/(24 * 60)) - (chart.trendWidth/2);
130 var posY = (canvasHeight) - (canvasHeight - canvasYOffset - circleRadius) * ((parseInt(temp) - Math.abs(minTemp)) / (maxTemp - minTemp));
131 if (posY == canvasHeight)
132 posY -= circleRadius;
133
134 //draw temperature point
135 //drawCircle(context, posX, posY, circleRadius, circleColor);
136 positions.push({'posY':posY, 'posX':posX})
137 }
138
139 drawTemperatureLines(context,positions,circleColor);
140}
141
142//draw lines connecting temperature points
143//WORK IN PROGRESS. should be smooth paths
144function drawTemperatureLines(context, positions, color)
145{
146 var posX = 0, posY = 0, prevX, prevY;
147
148 context.save();
149 context.strokeStyle = chart.trendColor;
150 context.lineWidth = 2;
151 context.lineJoin = "round";
152 context.beginPath();
153
154 for (var i = 0 ; i < positions.length ; i++)
155 {
156 posY = positions[i].posY;
157 posX = positions[i].posX;
158
159 if (i == 0)
160 {
161 context.moveTo(posX, posY);
162 }
163 else
164 {
165 prevX = positions[i-1].posX;
166 prevY = positions[i-1].posY;
167 context.lineTo(posX, posY);
168 }
169 }
170 context.stroke();
171 context.restore();
172}
173
174//general function for circle drawing
175function drawCircle(context, x, y, radius, color)
176{
177 context.save();
178 context.fillStyle = color;
179 context.beginPath();
180 context.arc(x, y, radius,0,Math.PI*2,true); // Outer circle
181 context.fill();
182 context.restore();
183}
184
185//general function for line drawing
186function drawLine(context, startX, startY, endX, endY, color, width)
187{
188 context.save();
189 context.lineWidth = width;
190 context.strokeStyle = color;
191 context.beginPath();
192 context.moveTo(startX,startY);
193 context.lineTo(endX,endY);
194 context.closePath();
195 context.stroke();
196 context.restore();
197}
0198
=== added file 'components/ChartComponent.qml'
--- components/ChartComponent.qml 1970-01-01 00:00:00 +0000
+++ components/ChartComponent.qml 2013-03-14 22:14:19 +0000
@@ -0,0 +1,63 @@
1import QtQuick 2.0
2import Ubuntu.Components 0.1
3import "ChartComponent.js" as ChartFunctions
4
5Rectangle {
6 id: chart
7 anchors.horizontalCenter: parent.horizontalCenter
8 width: parent.width-units.gu(2)
9 height: units.gu(20)
10
11 property string backgroundColor: "#D6D6D6"
12 property string gridColor: "#FFFFFF"
13 property int gridWidth: 1
14 property int gridHorizontalLinesCount: 4
15 property int headerSize: units.gu(4)
16 property string trendColor: "#313131"
17 property int trendWidth: 2
18 //property variant xAxisHours: [0,6,12,18,24]
19 property variant xAxisHours: [0,3,6,9,12,15,18,21,24]
20 property variant temperatures: [{"time" : "0:10", "temp" : "3"},
21 {"time" : "2:00", "temp" : "7"},
22 {"time" : "6:00", "temp" : "9"},
23 {"time" : "10:30", "temp" : "12"},
24 {"time" : "12:00", "temp" : "24"},
25 {"time" : "18:10", "temp" : "20"},
26 {"time" : "22:22", "temp" : "10"}]
27 property bool showExtremeHours: false
28
29 function refresh()
30 {
31 ChartFunctions.refresh();
32 }
33
34 UbuntuShape{
35 id: contentShape
36 radius: "small"
37 width: parent.width
38 height: parent.height-units.gu(6)
39 anchors.bottom: parent.bottom
40 anchors.bottomMargin: units.gu(1)
41 color: backgroundColor
42 }
43 Canvas{
44 id:canvas
45 width: parent.width
46 height: parent.height-units.gu(2)
47 anchors.bottom: parent.bottom
48 anchors.bottomMargin: units.gu(1)
49 antialiasing: true
50
51 onPaint: {
52 ChartFunctions.canvas = canvas;
53 ChartFunctions.chart = chart;
54
55 ChartFunctions.canvasHeight = canvas.height;
56 ChartFunctions.canvasWidth = canvas.width;
57 ChartFunctions.canvasXOffset = 0;
58 ChartFunctions.canvasYOffset = canvas.height - contentShape.height;
59
60 ChartFunctions.draw();
61 }
62 }
63}
064
=== modified file 'weather.qml'
--- weather.qml 2013-03-09 15:34:59 +0000
+++ weather.qml 2013-03-14 22:14:19 +0000
@@ -50,6 +50,9 @@
50 maxTemp: 2550 maxTemp: 25
51 metric: true51 metric: true
52 }52 }
53 Components.ChartComponent{
54
55 }
53 Components.DateComponent {56 Components.DateComponent {
54 dateRelative: "Tomorrow"57 dateRelative: "Tomorrow"
55 dateString:"Sunday, 10th February"58 dateString:"Sunday, 10th February"

Subscribers

People subscribed via source and target branches