Merge lp:~pkunal-parmar/ubuntu-calendar-app/new_month_yearview into lp:ubuntu-calendar-app
- new_month_yearview
- Merge into trunk
Status: | Merged |
---|---|
Approved by: | Olivier Tilloy |
Approved revision: | 101 |
Merged at revision: | 108 |
Proposed branch: | lp:~pkunal-parmar/ubuntu-calendar-app/new_month_yearview |
Merge into: | lp:ubuntu-calendar-app |
Diff against target: |
730 lines (+254/-332) 6 files modified
MonthComponent.qml (+132/-80) MonthView.qml (+65/-199) YearView.qml (+41/-30) calendar.qml (+10/-22) dateExt.js (+5/-0) tests/autopilot/calendar_app/tests/test_monthview.py (+1/-1) |
To merge this branch: | bzr merge lp:~pkunal-parmar/ubuntu-calendar-app/new_month_yearview |
Related bugs: |
Reviewer | Review Type | Date Requested | Status |
---|---|---|---|
Ubuntu Phone Apps Jenkins Bot | continuous-integration | Approve | |
Olivier Tilloy (community) | Approve | ||
Riccardo Padovani (community) | Approve | ||
Review via email: mp+183305@code.launchpad.net |
Commit message
MonthView and YearView changed according to new design
Description of the change
MonthView and YearView changed according to new design
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote : | # |
Riccardo Padovani (rpadovani) wrote : | # |
Thanks for your time and the big patch Kunal!
Looking to the design guideline I have noticed some things:
- Page 4 of UDS presentation: In the year view also the name of the month is in the rounded box
- Page 4 of UDS presentation: In the year view there is a label, on right of the name of the month, with the year
- There is no animation when you click on a month
- Page 5 of UDS presentation: In the month view also the name of the month is in the rounded box
- Page 5 of UDS presentation: In the year view there is a label, on right of the name of the month, with the year
- Page 5 of UDS presentation: There is no current date in design guideline, in month view
Also, when you switch tab from month to year, start month is Jan, I think that the start month has to be the current one.
However, they are details, great job Kunal!
Kunal Parmar (pkunal-parmar) wrote : | # |
HI Riccardo, Thanks for review.
Yes, currently I designed according to old visual, I just got UDS PPT with new Visual, I will be updating it the views.
And yes, Animation is not going to be implemented now. Design team is going to refine them.
"Also, when you switch tab from month to year, start month is Jan, I think that the start month has to be the current one."
You mean if its current year then scroll to current month , else JAN ?
As such its not defined, but that makes sense.
Olivier Tilloy (osomon) wrote : | # |
I second Riccardo, that looks really good!
One minor remark:
506 + text: Qt.formatDateTime( new Date(),"d MMMM yyyy");
The format string should probably be internationalized, with a comment for translators.
Riccardo Padovani (rpadovani) wrote : | # |
Hi Kunal,
just see your last commit, now looks perfect ;)
Awesome work!
> You mean if its current year then scroll to current month , else JAN ?
Yes, exactly!
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote : | # |
FAILED: Continuous integration, rev:96
http://
Executed test runs:
UNSTABLE: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
Click here to trigger a rebuild:
http://
Kunal Parmar (pkunal-parmar) wrote : | # |
> Thanks for your time and the big patch Kunal!
>
> Looking to the design guideline I have noticed some things:
> - Page 4 of UDS presentation: In the year view also the name of the month is
> in the rounded box
> - Page 4 of UDS presentation: In the year view there is a label, on right of
> the name of the month, with the year
> - There is no animation when you click on a month
> - Page 5 of UDS presentation: In the month view also the name of the month is
> in the rounded box
> - Page 5 of UDS presentation: In the year view there is a label, on right of
> the name of the month, with the year
> - Page 5 of UDS presentation: There is no current date in design guideline, in
> month view
>
> Also, when you switch tab from month to year, start month is Jan, I think that
> the start month has to be the current one.
>
> However, they are details, great job Kunal!
Hi, I addressed your comments except scrolling one and animation. I will create another merge request for scrolling to current month. I need some time for that. and animation we are not focusing right now.
Kunal Parmar (pkunal-parmar) wrote : | # |
> I second Riccardo, that looks really good!
>
> One minor remark:
>
> 506 + text: Qt.formatDateTime( new Date(),"d MMMM yyyy");
>
> The format string should probably be internationalized, with a comment for
> translators.
Hi, I just changed looks according to new visuals from UDS. As per that there is not Today label anymore. So i just removed it.
Hoe that's fine.
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote : | # |
FAILED: Continuous integration, rev:97
http://
Executed test runs:
UNSTABLE: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
Click here to trigger a rebuild:
http://
Olivier Tilloy (osomon) wrote : | # |
Looks pretty good!
One minor glitch that I’ve noticed: in the year view, today is marked selected both in the current month and in the previous month (happens because the previous month also displays a few days from the current month, greyed out).
I think today should be marked selected only in the current month.
Olivier Tilloy (osomon) wrote : | # |
Another not so minor issue: in the month view, days are shifted by one, i.e. with my current locale settings (fr_FR) the month view displays the first of September as a Monday, whereas it was a Sunday. This is a regression compared to the current implementation, which correctly displays the first of September as a Sunday.
The year view is also affected, so this is a bug, but not a regression as the bug was already present in the year view in the current implementation.
Kunal Parmar (pkunal-parmar) wrote : | # |
> Another not so minor issue: in the month view, days are shifted by one, i.e.
> with my current locale settings (fr_FR) the month view displays the first of
> September as a Monday, whereas it was a Sunday. This is a regression compared
> to the current implementation, which correctly displays the first of September
> as a Sunday.
>
> The year view is also affected, so this is a bug, but not a regression as the
> bug was already present in the year view in the current implementation.
Tried to fix, it looks fine to me, Can you confirm ?
Kunal Parmar (pkunal-parmar) wrote : | # |
> Looks pretty good!
>
> One minor glitch that I’ve noticed: in the year view, today is marked selected
> both in the current month and in the previous month (happens because the
> previous month also displays a few days from the current month, greyed out).
> I think today should be marked selected only in the current month.
Fixed, please check
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote : | # |
FAILED: Continuous integration, rev:98
http://
Executed test runs:
UNSTABLE: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
Click here to trigger a rebuild:
http://
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote : | # |
FAILED: Continuous integration, rev:99
http://
Executed test runs:
UNSTABLE: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
Click here to trigger a rebuild:
http://
Olivier Tilloy (osomon) wrote : | # |
> > Another not so minor issue: in the month view, days are shifted by one, i.e.
> > with my current locale settings (fr_FR) the month view displays the first
> of
> > September as a Monday, whereas it was a Sunday. This is a regression
> compared
> > to the current implementation, which correctly displays the first of
> September
> > as a Sunday.
> >
> > The year view is also affected, so this is a bug, but not a regression as
> the
> > bug was already present in the year view in the current implementation.
>
> Tried to fix, it looks fine to me, Can you confirm ?
I can confirm this is fixed. Thanks!
Olivier Tilloy (osomon) wrote : | # |
> > Looks pretty good!
> >
> > One minor glitch that I’ve noticed: in the year view, today is marked
> selected
> > both in the current month and in the previous month (happens because the
> > previous month also displays a few days from the current month, greyed out).
> > I think today should be marked selected only in the current month.
>
> Fixed, please check
Works. Thanks!
Olivier Tilloy (osomon) wrote : | # |
Looks pretty good and works well. Nice job!
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote : | # |
PASSED: Continuous integration, rev:100
http://
Executed test runs:
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
Click here to trigger a rebuild:
http://
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote : | # |
FAILED: Autolanding.
More details in the following jenkins job:
http://
Executed test runs:
FAILURE: http://
FAILURE: http://
FAILURE: http://
FAILURE: http://
FAILURE: http://
Olivier Tilloy (osomon) wrote : | # |
There is a conflict when merging into the latest trunk, can you resolve it and push a new revision?
- 101. By Kunal Parmar
-
Trunk code merged
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote : | # |
PASSED: Continuous integration, rev:101
http://
Executed test runs:
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
Click here to trigger a rebuild:
http://
Preview Diff
1 | === modified file 'MonthComponent.qml' |
2 | --- MonthComponent.qml 2013-09-03 00:51:30 +0000 |
3 | +++ MonthComponent.qml 2013-09-03 23:46:33 +0000 |
4 | @@ -5,103 +5,155 @@ |
5 | |
6 | Item{ |
7 | id: root |
8 | - property var date; |
9 | - |
10 | - signal monthSelected(var date); |
11 | + objectName: "MonthComponent" |
12 | + |
13 | + property var monthDate; |
14 | + |
15 | + property string dayLabelFontSize: "medium" |
16 | + property string dateLabelFontSize: "large" |
17 | + property string monthLabelFontSize: "large" |
18 | + property string yearLabelFontSize: "medium" |
19 | |
20 | property alias dayLabelDelegate : dayLabelRepeater.delegate |
21 | property alias dateLabelDelegate : dateLabelRepeater.delegate |
22 | |
23 | - objectName: "MonthComponent" |
24 | - |
25 | - width: monthGrid.width |
26 | - height: monthGrid.height + units.gu(0.5)+ monthName.height |
27 | - |
28 | - MouseArea{ |
29 | + signal dateSelected(var date) |
30 | + |
31 | + height: ubuntuShape.height |
32 | + |
33 | + UbuntuShape { |
34 | + id: ubuntuShape |
35 | + |
36 | anchors.fill: parent |
37 | - onClicked: { |
38 | - root.monthSelected( root.date ); |
39 | - } |
40 | - } |
41 | - |
42 | - Label{ |
43 | - id: monthName |
44 | - width: parent.width |
45 | - horizontalAlignment: Text.AlignHCenter |
46 | - font.bold: true |
47 | - text: { |
48 | - Qt.locale().standaloneMonthName(root.date.getMonth()) |
49 | - } |
50 | - } |
51 | - |
52 | - Row{ |
53 | - id: dayLabelRow |
54 | - anchors.top: monthName.bottom |
55 | - anchors.topMargin: units.gu(0.5) |
56 | - spacing: units.gu(0.5) |
57 | - width: parent.width |
58 | - Repeater{ |
59 | - id: dayLabelRepeater |
60 | - model:7 |
61 | - delegate: dafaultDayLabelComponent |
62 | - } |
63 | - } |
64 | - |
65 | - Grid{ |
66 | - id: monthGrid |
67 | - property var monthStart: DateExt.getFirstDateofWeek(root.date.getFullYear(),root.date.getMonth()) |
68 | - |
69 | - rows: DateExt.weekCount(root.date.getFullYear(), root.date.getMonth()) |
70 | - columns: 7 |
71 | - spacing: units.gu(0.5) |
72 | - |
73 | - anchors.top: dayLabelRow.bottom |
74 | - anchors.topMargin: units.gu(0.5) |
75 | - |
76 | - Repeater{ |
77 | - id: dateLabelRepeater |
78 | - model: monthGrid.rows * monthGrid.columns |
79 | - delegate: defaultDateLabelComponent |
80 | + radius: "medium" |
81 | + |
82 | + Column{ |
83 | + id: column |
84 | + |
85 | + anchors.top: parent.top |
86 | + anchors.topMargin: units.gu(1.5) |
87 | + anchors.fill: parent |
88 | + spacing: units.gu(1.5) |
89 | + |
90 | + Item{ |
91 | + id: monthHeader |
92 | + width: parent.width |
93 | + height: monthLabel.height |
94 | + |
95 | + Label{ |
96 | + id: monthLabel |
97 | + fontSize: monthLabelFontSize |
98 | + text: Qt.locale().standaloneMonthName(root.monthDate.getMonth()) |
99 | + anchors.leftMargin: units.gu(1) |
100 | + anchors.left: parent.left |
101 | + //color:"white" |
102 | + anchors.verticalCenter: parent.verticalCenter |
103 | + } |
104 | + |
105 | + Label{ |
106 | + id: yearLabel |
107 | + fontSize: yearLabelFontSize |
108 | + text: root.monthDate.getFullYear() |
109 | + anchors.right: parent.right |
110 | + anchors.rightMargin: units.gu(1) |
111 | + color:"#AEA79F" |
112 | + anchors.verticalCenter: parent.verticalCenter |
113 | + } |
114 | + } |
115 | + |
116 | + Row{ |
117 | + id: dayLabelRow |
118 | + width: parent.width |
119 | + anchors.horizontalCenter: parent.horizontalCenter |
120 | + |
121 | + Repeater{ |
122 | + id: dayLabelRepeater |
123 | + model:7 |
124 | + delegate: dafaultDayLabelComponent |
125 | + } |
126 | + } |
127 | + |
128 | + Grid{ |
129 | + id: monthGrid |
130 | + |
131 | + property int weekCount : 6 |
132 | + property var monthStart: root.monthDate.weekStart( Qt.locale().firstDayOfWeek ) |
133 | + |
134 | + width: parent.width |
135 | + height: parent.height - monthHeader.height - dayLabelRow.height - units.gu(3) |
136 | + |
137 | + rows: weekCount |
138 | + columns: 7 |
139 | + |
140 | + Repeater{ |
141 | + id: dateLabelRepeater |
142 | + model: monthGrid.rows * monthGrid.columns |
143 | + delegate: defaultDateLabelComponent |
144 | + } |
145 | + } |
146 | } |
147 | } |
148 | |
149 | Component{ |
150 | id: defaultDateLabelComponent |
151 | |
152 | - Text { |
153 | - id: dateLabel |
154 | - |
155 | - property var day: parent.monthStart.addDays(index) |
156 | - property var isToday: day.isSameDay(intern.now) |
157 | - property bool isPaddingDate: day.getMonth() != root.date.getMonth() |
158 | - |
159 | - text: day.getDate() |
160 | - horizontalAlignment: Text.AlignHCenter |
161 | - width: dummy.width |
162 | - height: dummy.height |
163 | - font.pointSize: dummy.font.pointSize |
164 | - color: isToday ? Color.ubuntuOrange : (isPaddingDate ? Color.warmGrey : dummy.color) |
165 | - scale: isToday ? 1.5 : 1. |
166 | + Item{ |
167 | + id: dateRootItem |
168 | + |
169 | + property var date: parent.monthStart.addDays(index); |
170 | + property bool isCurrentMonth: DateExt.isSameMonth(root.monthDate,date) |
171 | + |
172 | + width: parent.width / 7; |
173 | + height: parent.height / parent.weekCount |
174 | + |
175 | + UbuntuShape{ |
176 | + id: highLightRect |
177 | + |
178 | + width: parent.width |
179 | + height: width |
180 | + anchors.centerIn: parent |
181 | + |
182 | + color: "white" |
183 | + visible: date.isSameDay(DateExt.today()) && isCurrentMonth |
184 | + } |
185 | + |
186 | + Label{ |
187 | + id: dateLabel |
188 | + anchors.centerIn: parent |
189 | + text: date.getDate() |
190 | + horizontalAlignment: Text.AlignHCenter |
191 | + fontSize: root.dateLabelFontSize |
192 | + color: { |
193 | + if( date.isSameDay(DateExt.today()) && isCurrentMonth ) { |
194 | + "#2C001E" |
195 | + } else if( parent.isCurrentMonth ) { |
196 | + "#333333" |
197 | + } else { |
198 | + "#AEA79F" |
199 | + } |
200 | + } |
201 | + } |
202 | + |
203 | + MouseArea{ |
204 | + anchors.fill: parent |
205 | + onClicked: { |
206 | + root.dateSelected(date); |
207 | + } |
208 | + } |
209 | } |
210 | } |
211 | |
212 | Component{ |
213 | id: dafaultDayLabelComponent |
214 | - Text{ |
215 | - //FIXME: how to get localized day initial ? |
216 | - text: Qt.locale().standaloneDayName( (intern.weekstartDay + index), Locale.ShortFormat).charAt(0) |
217 | + |
218 | + Label{ |
219 | + id: weekDay |
220 | + width: parent.width / 7 |
221 | + property var day :Qt.locale().standaloneDayName(( Qt.locale().firstDayOfWeek + index), Locale.ShortFormat) |
222 | + text: day.toUpperCase(); |
223 | horizontalAlignment: Text.AlignHCenter |
224 | - width: dummy.width |
225 | - height: dummy.height |
226 | - font.pointSize: dummy.font.pointSize |
227 | - font.bold: true |
228 | + fontSize: root.dayLabelFontSize |
229 | + color: "#AEA79F" |
230 | } |
231 | } |
232 | - |
233 | - Text{ |
234 | - id: dummy |
235 | - text: "00" |
236 | - visible: false |
237 | - font.pointSize: 7.5 |
238 | - } |
239 | } |
240 | |
241 | === modified file 'MonthView.qml' |
242 | --- MonthView.qml 2013-08-04 02:26:31 +0000 |
243 | +++ MonthView.qml 2013-09-03 23:46:33 +0000 |
244 | @@ -3,204 +3,70 @@ |
245 | import "dateExt.js" as DateExt |
246 | import "colorUtils.js" as Color |
247 | |
248 | -ListView { |
249 | - id: monthView |
250 | - |
251 | - // FIXME: change monthview to use this date as start date |
252 | - property alias startDay: intern.currentDayStart |
253 | - |
254 | - readonly property var monthStart: currentItem != null ? currentItem.monthStart : (new Date()).monthStart() |
255 | - readonly property var monthEnd: currentItem != null ? currentItem.monthEnd : (new Date()).monthStart().addMonths(1) |
256 | - readonly property var currentDayStart: intern.currentDayStart |
257 | - |
258 | - property bool compressed: false |
259 | - readonly property real compressedHeight: intern.squareUnit + intern.verticalMargin * 2 |
260 | - readonly property real expandedHeight: intern.squareUnit * 6 + intern.verticalMargin * 2 |
261 | - |
262 | - signal incrementCurrentDay |
263 | - signal decrementCurrentDay |
264 | - |
265 | - signal gotoNextMonth(int month) |
266 | - signal focusOnDay(var dayStart) |
267 | - |
268 | - onCurrentItemChanged: { |
269 | - if (currentItem == null) { |
270 | - intern.currentDayStart = intern.currentDayStart |
271 | - return |
272 | - } |
273 | - if (currentItem.monthStart <= intern.currentDayStart && intern.currentDayStart < currentItem.monthEnd) |
274 | - return |
275 | - if (currentItem.monthStart <= intern.today && intern.today < currentItem.monthEnd) |
276 | - intern.currentDayStart = intern.today |
277 | - else |
278 | - intern.currentDayStart = currentItem.monthStart |
279 | - } |
280 | - |
281 | - onIncrementCurrentDay: { |
282 | - var t = intern.currentDayStart.addDays(1) |
283 | - if (t < monthEnd) { |
284 | - intern.currentDayStart = t |
285 | - } |
286 | - else if (currentIndex < count - 1) { |
287 | - intern.currentDayStart = t |
288 | - currentIndex = currentIndex + 1 |
289 | - } |
290 | - } |
291 | - |
292 | - onDecrementCurrentDay: { |
293 | - var t = intern.currentDayStart.addDays(-1) |
294 | - if (t >= monthStart) { |
295 | - intern.currentDayStart = t |
296 | - } |
297 | - else if (currentIndex > 0) { |
298 | - intern.currentDayStart = t |
299 | - currentIndex = currentIndex - 1 |
300 | - } |
301 | - } |
302 | - |
303 | - onGotoNextMonth: { |
304 | - if (monthStart.getMonth() != month) { |
305 | - var i = intern.monthIndex0, m = intern.today.getMonth() |
306 | - while (m != month) { |
307 | - m = (m + 1) % 12 |
308 | - i = i + 1 |
309 | - } |
310 | - currentIndex = i |
311 | - } |
312 | - } |
313 | - |
314 | - onFocusOnDay: { |
315 | - if (dayStart < monthStart) { |
316 | - if (currentIndex > 0) { |
317 | - intern.currentDayStart = dayStart |
318 | - currentIndex = currentIndex - 1 |
319 | - } |
320 | - } |
321 | - else if (dayStart >= monthEnd) { |
322 | - if (currentIndex < count - 1) { |
323 | - intern.currentDayStart = dayStart |
324 | - currentIndex = currentIndex + 1 |
325 | - } |
326 | - } |
327 | - else intern.currentDayStart = dayStart |
328 | - } |
329 | - |
330 | - function goToToday() { |
331 | - var today = (new Date()).midnight(); |
332 | - intern.currentDayStart = today |
333 | - currentIndex= intern.monthIndex0 |
334 | - } |
335 | - |
336 | - focus: true |
337 | - Keys.onLeftPressed: decrementCurrentDay() |
338 | - Keys.onRightPressed: incrementCurrentDay() |
339 | - |
340 | - QtObject { |
341 | - id: intern |
342 | - |
343 | - property int squareUnit: monthView.width / 8 |
344 | - property int verticalMargin: units.gu(1) |
345 | - property int weekstartDay: Qt.locale().firstDayOfWeek |
346 | - property int monthCount: 49 // months for +-2 years |
347 | - |
348 | - property var today: (new Date()).midnight() // TODO: update at midnight |
349 | - property var currentDayStart: today |
350 | - property int monthIndex0: Math.floor(monthCount / 2) |
351 | - property var monthStart0: today.monthStart() |
352 | - } |
353 | - |
354 | - width: parent.width |
355 | - height: compressed ? compressedHeight : expandedHeight |
356 | - |
357 | - interactive: !compressed |
358 | - clip: true |
359 | - orientation: ListView.Horizontal |
360 | - snapMode: ListView.SnapOneItem |
361 | - cacheBuffer: width + 1 |
362 | - |
363 | - highlightRangeMode: ListView.StrictlyEnforceRange |
364 | - preferredHighlightBegin: 0 |
365 | - preferredHighlightEnd: width |
366 | - |
367 | - model: intern.monthCount |
368 | - currentIndex: intern.monthIndex0 |
369 | - |
370 | - delegate: Item { |
371 | - id: monthItem |
372 | - |
373 | - property var monthStart: intern.monthStart0.addMonths(index - intern.monthIndex0) |
374 | - property var monthEnd: monthStart.addMonths(1) |
375 | - property var gridStart: monthStart.weekStart(intern.weekstartDay) |
376 | - property int currentWeekRow: Math.floor((currentDayStart.getTime() - gridStart.getTime()) / Date.msPerWeek) |
377 | - |
378 | - width: monthView.width |
379 | - height: monthView.height |
380 | - |
381 | - Grid { |
382 | - id: monthGrid |
383 | - |
384 | - rows: 6 |
385 | - columns: 7 |
386 | - |
387 | - x: intern.squareUnit / 2 |
388 | - y: intern.verticalMargin |
389 | - width: intern.squareUnit * columns |
390 | - height: intern.squareUnit * rows |
391 | - |
392 | - Repeater { |
393 | - model: monthGrid.rows * monthGrid.columns |
394 | - delegate: Item { |
395 | - id: dayItem |
396 | - property var dayStart: gridStart.addDays(index) |
397 | - property bool isCurrentMonth: monthStart <= dayStart && dayStart < monthEnd |
398 | - property bool isToday: dayStart.getTime() === intern.today.getTime() |
399 | - property bool isCurrent: dayStart.getTime() === intern.currentDayStart.getTime() |
400 | - property int weekday: (index % 7 + intern.weekstartDay) % 7 |
401 | - property bool isSunday: weekday == 0 |
402 | - property int row: Math.floor(index / 7) |
403 | - property bool isCurrentWeek: row == currentWeekRow |
404 | - property real topMargin: (row == 0 || (monthView.compressed && isCurrentWeek)) ? -intern.verticalMargin : 0 |
405 | - property real bottomMargin: (row == 5 || (monthView.compressed && isCurrentWeek)) ? -intern.verticalMargin : 0 |
406 | - visible: monthView.compressed ? isCurrentWeek : true |
407 | - width: intern.squareUnit |
408 | - height: intern.squareUnit |
409 | - Rectangle { |
410 | - visible: isSunday |
411 | - anchors.fill: parent |
412 | - anchors.topMargin: dayItem.topMargin |
413 | - anchors.bottomMargin: dayItem.bottomMargin |
414 | - color: Color.warmGrey |
415 | - opacity: 0.1 |
416 | - } |
417 | - Text { |
418 | - anchors.centerIn: parent |
419 | - text: dayStart.getDate() |
420 | - font: themeDummy.font |
421 | - color: isToday ? Color.ubuntuOrange : themeDummy.color |
422 | - scale: isCurrent ? 1.8 : 1. |
423 | - opacity: isCurrentMonth ? 1. : 0.3 |
424 | - Behavior on scale { |
425 | - NumberAnimation { duration: 50 } |
426 | - } |
427 | - } |
428 | - MouseArea { |
429 | - anchors.fill: parent |
430 | - anchors.topMargin: dayItem.topMargin |
431 | - anchors.bottomMargin: dayItem.bottomMargin |
432 | - onReleased: monthView.focusOnDay(dayStart) |
433 | - } |
434 | - // Component.onCompleted: console.log(dayStart, intern.currentDayStart) |
435 | - } |
436 | - } |
437 | - } |
438 | - |
439 | - // Component.onCompleted: console.log("Created delegate for month", index, monthStart, gridStart, currentWeekRow, currentWeekRowReal) |
440 | - } |
441 | - |
442 | - Label { |
443 | - visible: false |
444 | - id: themeDummy |
445 | - fontSize: "large" |
446 | - // Component.onCompleted: console.log(color, Qt.lighter(color, 1.74)) |
447 | +Page { |
448 | + id: monthViewPage |
449 | + |
450 | + property var currentMonth: DateExt.today(); |
451 | + |
452 | + signal dateSelected(var date); |
453 | + |
454 | + PathViewBase{ |
455 | + id: monthViewPath |
456 | + |
457 | + property var startMonth: addMonth(currentMonth,-1); |
458 | + |
459 | + anchors.top:parent.top |
460 | + |
461 | + width:parent.width |
462 | + height: parent.height |
463 | + |
464 | + onNextItemHighlighted: { |
465 | + nextMonth(); |
466 | + } |
467 | + |
468 | + onPreviousItemHighlighted: { |
469 | + previousMonth(); |
470 | + } |
471 | + |
472 | + function nextMonth() { |
473 | + currentMonth = addMonth(currentMonth,1); |
474 | + } |
475 | + |
476 | + function previousMonth(){ |
477 | + currentMonth = addMonth(currentMonth,-1); |
478 | + } |
479 | + |
480 | + function addMonth(date,month){ |
481 | + var temp = new Date(date.getFullYear(),date.getMonth(),1,0,0,0); |
482 | + temp.setMonth(date.getMonth() + month); |
483 | + return temp; |
484 | + } |
485 | + |
486 | + delegate: MonthComponent{ |
487 | + width: parent.width - units.gu(5) |
488 | + height: parent.height - units.gu(5) |
489 | + |
490 | + monthDate: getMonthDate(); |
491 | + |
492 | + function getMonthDate() { |
493 | + //previous page |
494 | + if (index === monthViewPath.currentIndex) { |
495 | + return monthViewPath.startMonth; |
496 | + } |
497 | + |
498 | + //next page |
499 | + var previousIndex = monthViewPath.currentIndex > 0 ? monthViewPath.currentIndex - 1 : 2 |
500 | + if ( index === previousIndex ) { |
501 | + return monthViewPath.addMonth(monthViewPath.startMonth,2); |
502 | + } |
503 | + |
504 | + //current page |
505 | + return monthViewPath.addMonth(monthViewPath.startMonth,1); |
506 | + } |
507 | + |
508 | + onDateSelected: { |
509 | + monthViewPage.dateSelected(date); |
510 | + } |
511 | + } |
512 | } |
513 | } |
514 | |
515 | === modified file 'YearView.qml' |
516 | --- YearView.qml 2013-07-09 14:35:09 +0000 |
517 | +++ YearView.qml 2013-09-03 23:46:33 +0000 |
518 | @@ -1,20 +1,23 @@ |
519 | import QtQuick 2.0 |
520 | import Ubuntu.Components 0.1 |
521 | |
522 | +import "dateExt.js" as DateExt |
523 | + |
524 | PathViewBase { |
525 | id: root |
526 | |
527 | + property var currentYear: DateExt.today(); |
528 | + |
529 | + signal monthSelected(var date); |
530 | + |
531 | anchors.fill: parent |
532 | - property var year: getDateFromYear(intern.now.getFullYear()-1); |
533 | - |
534 | - signal monthSelected(var date); |
535 | |
536 | onNextItemHighlighted: { |
537 | - year = getDateFromYear(year.getFullYear() + 1); |
538 | + currentYear = getDateFromYear(currentYear.getFullYear() + 1); |
539 | } |
540 | |
541 | onPreviousItemHighlighted: { |
542 | - year = getDateFromYear(year.getFullYear() - 1); |
543 | + currentYear = getDateFromYear(currentYear.getFullYear() - 1); |
544 | } |
545 | |
546 | function getDateFromYear(year) { |
547 | @@ -23,54 +26,62 @@ |
548 | |
549 | QtObject{ |
550 | id: intern |
551 | - property var now: new Date() |
552 | - property int weekstartDay: Qt.locale().firstDayOfWeek |
553 | + property var startYear: getDateFromYear(currentYear.getFullYear()-1); |
554 | } |
555 | |
556 | - delegate: Item{ |
557 | + delegate: Flickable{ |
558 | id: yearView |
559 | - |
560 | - property var year: { |
561 | + clip: true |
562 | + |
563 | + property var year: getYear(); |
564 | + |
565 | + function getYear(){ |
566 | if (index === root.currentIndex) { |
567 | - return root.year; |
568 | + return intern.startYear; |
569 | } |
570 | var previousIndex = root.currentIndex > 0 ? root.currentIndex - 1 : 2 |
571 | |
572 | if ( index === previousIndex ) { |
573 | - return getDateFromYear(root.year.getFullYear()-1); |
574 | + return getDateFromYear(intern.startYear.getFullYear() - 1); |
575 | } |
576 | |
577 | - return getDateFromYear(root.year.getFullYear()+ 1); |
578 | + return getDateFromYear(intern.startYear.getFullYear() + 1); |
579 | } |
580 | |
581 | width: parent.width |
582 | height: parent.height |
583 | |
584 | - Label{ |
585 | - id: yearLabel |
586 | - text: year.getFullYear() |
587 | - fontSize: "large" |
588 | - anchors.horizontalCenter: parent.horizontalCenter |
589 | - font.bold: true |
590 | - } |
591 | + contentHeight: yearGrid.height + units.gu(2) |
592 | + contentWidth: width |
593 | |
594 | Grid{ |
595 | id: yearGrid |
596 | - rows: 4 |
597 | - columns: 3 |
598 | - |
599 | - width: parent.width |
600 | - height: parent.height |
601 | - anchors.top: yearLabel.bottom |
602 | - spacing: units.gu(2.5) |
603 | + rows: 6 |
604 | + columns: 2 |
605 | + |
606 | + anchors.top: parent.top |
607 | + anchors.topMargin: units.gu(1.5) |
608 | + |
609 | + width: parent.width - ((columns-1) * yearGrid.spacing) |
610 | + spacing: units.gu(2) |
611 | + anchors.horizontalCenter: parent.horizontalCenter |
612 | |
613 | Repeater{ |
614 | model: yearGrid.rows * yearGrid.columns |
615 | delegate: MonthComponent{ |
616 | - date: new Date(year.getFullYear(),index,1,0,0,0,0) |
617 | + monthDate: new Date(yearView.year.getFullYear(),index,1,0,0,0,0) |
618 | + width: (parent.width - units.gu(2))/2 |
619 | + height: width * 1.5 |
620 | + dayLabelFontSize:"x-small" |
621 | + dateLabelFontSize: "medium" |
622 | + monthLabelFontSize: "medium" |
623 | + yearLabelFontSize: "small" |
624 | |
625 | - onMonthSelected: { |
626 | - root.monthSelected(date); |
627 | + MouseArea{ |
628 | + anchors.fill: parent |
629 | + onClicked: { |
630 | + root.monthSelected(monthDate); |
631 | + } |
632 | } |
633 | } |
634 | } |
635 | |
636 | === modified file 'calendar.qml' |
637 | --- calendar.qml 2013-08-20 14:32:27 +0000 |
638 | +++ calendar.qml 2013-09-03 23:46:33 +0000 |
639 | @@ -24,8 +24,8 @@ |
640 | property var currentDay: DateExt.today(); |
641 | |
642 | onCurrentDayChanged: { |
643 | - if( monthView.startDay !== undefined && !monthView.startDay.isSameDay(currentDay)) |
644 | - monthView.startDay = currentDay.midnight(); |
645 | + if( monthView.currentMonth !== undefined && !monthView.currentMonth.isSameDay(currentDay)) |
646 | + monthView.currentMonth = currentDay.midnight(); |
647 | |
648 | if( !dayView.currentDay.isSameDay(currentDay)) |
649 | dayView.currentDay = currentDay |
650 | @@ -60,7 +60,6 @@ |
651 | text: i18n.tr("Today"); |
652 | onTriggered: { |
653 | tabPage.currentDay = (new Date()).midnight(); |
654 | - monthView.goToToday(); |
655 | } |
656 | } |
657 | } |
658 | @@ -76,13 +75,12 @@ |
659 | YearView{ |
660 | onMonthSelected: { |
661 | tabs.selectedTabIndex = 1 |
662 | - var now = new Date(); |
663 | + var now = DateExt.today(); |
664 | if( date.getMonth() === now.getMonth() |
665 | && date.getFullYear() === now.getFullYear()) { |
666 | - monthView.goToToday(); |
667 | + monthView.currentMonth = now |
668 | } else { |
669 | - monthView.startDay = date.midnight(); |
670 | - monthView.gotoNextMonth(date.getMonth()); |
671 | + monthView.currentMonth = date.midnight(); |
672 | } |
673 | } |
674 | } |
675 | @@ -91,24 +89,14 @@ |
676 | Tab { |
677 | id: monthTab |
678 | title: i18n.tr("Month") |
679 | - page: Page{ |
680 | + page: MonthView{ |
681 | anchors.fill: parent |
682 | tools: commonToolBar |
683 | - Column { |
684 | - anchors.fill: parent |
685 | - Label{ |
686 | - id: monthLabel |
687 | - fontSize: "large" |
688 | - text: Qt.formatDateTime(monthView.startDay,"MMMM yyyy"); |
689 | - } |
690 | + id: monthView |
691 | |
692 | - MonthView { |
693 | - id: monthView |
694 | - onFocusOnDay: { |
695 | - tabs.selectedTabIndex = 3 |
696 | - tabPage.currentDay = dayStart; |
697 | - } |
698 | - } |
699 | + onDateSelected: { |
700 | + tabs.selectedTabIndex = 3 |
701 | + tabPage.currentDay = date; |
702 | } |
703 | } |
704 | } |
705 | |
706 | === modified file 'dateExt.js' |
707 | --- dateExt.js 2013-09-03 01:52:17 +0000 |
708 | +++ dateExt.js 2013-09-03 23:46:33 +0000 |
709 | @@ -104,3 +104,8 @@ |
710 | date.setHours(0,0,0,0); |
711 | return date |
712 | } |
713 | + |
714 | +function isSameMonth(date1, date2) { |
715 | + return ( date1.getMonth() === date2.getMonth() |
716 | + && date1.getFullYear() === date2.getFullYear()) |
717 | +} |
718 | |
719 | === modified file 'tests/autopilot/calendar_app/tests/test_monthview.py' |
720 | --- tests/autopilot/calendar_app/tests/test_monthview.py 2013-08-28 16:19:06 +0000 |
721 | +++ tests/autopilot/calendar_app/tests/test_monthview.py 2013-09-03 23:46:33 +0000 |
722 | @@ -24,7 +24,7 @@ |
723 | |
724 | def get_currentDayStart(self): |
725 | month_view = self.main_view.get_month_view() |
726 | - return datetime.fromtimestamp(month_view.currentDayStart) |
727 | + return datetime.fromtimestamp(month_view.currentMonth) |
728 | |
729 | def change_month(self, delta): |
730 | month_view = self.main_view.get_month_view() |
PASSED: Continuous integration, rev:95 91.189. 93.70:8080/ job/ubuntu- calendar- app-ci/ 28/ 91.189. 93.70:8080/ job/generic- mediumtests/ 119 91.189. 93.70:8080/ job/ubuntu- calendar- app-precise- amd64-ci/ 28 91.189. 93.70:8080/ job/ubuntu- calendar- app-quantal- amd64-ci/ 28 91.189. 93.70:8080/ job/ubuntu- calendar- app-raring- amd64-ci/ 28 91.189. 93.70:8080/ job/ubuntu- calendar- app-saucy- amd64-ci/ 28
http://
Executed test runs:
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
SUCCESS: http://
Click here to trigger a rebuild: 91.189. 93.70:8080/ job/ubuntu- calendar- app-ci/ 28/rebuild
http://