Merge lp:~pkunal-parmar/ubuntu-calendar-app/yearview into lp:ubuntu-calendar-app

[Kunal Parmar]

YearView implemented
Reusable MonthView component created ( needs to use it with yearview and monthview)
Reusable PathViewBase created ( needs to use it with timeline view, weekview )

YearView implemented
Reusable MonthView component created ( needs to use it with yearview and monthview)
Reusable PathViewBase created ( needs to use it with timeline view, weekview )

[Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot)]

PASSED: Continuous integration, rev:65
http://91.189.93.70:8080/job/ubuntu-calendar-app-ci/51/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/ubuntu-calendar-app-quantal-amd64-ci/51
    SUCCESS: http://91.189.93.70:8080/job/ubuntu-calendar-app-raring-amd64-ci/51

Click here to trigger a rebuild:
http://91.189.93.70:8080/job/ubuntu-calendar-app-ci/51/rebuild

review: Approve (continuous-integration)

[Michael Hall (mhall119)]

Looks good to me

review: Approve

=== modified file 'EventDetails.qml'
--- EventDetails.qml	2013-04-13 04:43:04 +0000
+++ EventDetails.qml	2013-07-09 14:45:47 +0000
@@ -91,19 +91,19 @@
             Label{
                 id: timeLabel
                 anchors.left: parent.left
-                anchors.verticalCenter: parent.verticalCenter                
+                anchors.verticalCenter: parent.verticalCenter
                 fontSize: "large"
             }
             Label{
                 id: dateLabel
                 anchors.right: parent.right
-                anchors.verticalCenter: parent.verticalCenter                
+                anchors.verticalCenter: parent.verticalCenter
                 fontSize: "small"
             }
         }
 
         Label{
-            id: titleLabel            
+            id: titleLabel
             fontSize: "x-large"
             width: parent.width
             wrapMode: Text.WordWrap
@@ -114,7 +114,7 @@
             id: descLabel
             // FIXME: temporaty text, in ui there is no field to enter message
             text:"Hi both, please turn up on time, it gets really busy by 1pm! Anna x"
-            wrapMode: Text.WordWrap            
+            wrapMode: Text.WordWrap
             fontSize: "medium"
             width: parent.width
         }
@@ -131,7 +131,7 @@
             }
             Label{
                 id:locationLabel
-                wrapMode: Text.WordWrap                
+                wrapMode: Text.WordWrap
                 fontSize: "medium"
                 width: parent.width
                 //color:"#c94212"
@@ -147,7 +147,7 @@
         }
 
         Label{
-            text: i18n.tr("People");            
+            text: i18n.tr("People");
             fontSize: "small"
         }
         ThinDivider{}
@@ -169,7 +169,7 @@
                 id: contactModel
             }
 
-            Label{                
+            Label{
                 fontSize: "medium"
                 visible: contactModel.count <= 0
                 anchors.verticalCenter: parent.verticalCenter

=== added file 'MonthComponent.qml'
--- MonthComponent.qml	1970-01-01 00:00:00 +0000
+++ MonthComponent.qml	2013-07-09 14:45:47 +0000
@@ -0,0 +1,106 @@
+import QtQuick 2.0
+import Ubuntu.Components 0.1
+import "dateExt.js" as DateExt
+import "colorUtils.js" as Color
+
+Item{
+    id: root
+    property var date;
+
+    signal monthSelected(var date);
+
+    property alias dayLabelDelegate : dayLabelRepeater.delegate
+    property alias dateLabelDelegate : dateLabelRepeater.delegate
+
+    objectName: "MonthComponent"
+
+    width: monthGrid.width
+    height: monthGrid.height + units.gu(0.5)+ monthName.height
+
+    MouseArea{
+        anchors.fill: parent
+        onClicked: {
+            root.monthSelected( root.date );
+        }
+    }
+
+    Label{
+        id: monthName
+        width: parent.width
+        horizontalAlignment: Text.AlignHCenter
+        font.bold: true
+        text: {
+            Qt.locale().standaloneMonthName(root.date.getMonth())
+        }
+    }
+
+    Row{
+        id: dayLabelRow
+        anchors.top: monthName.bottom
+        anchors.topMargin: units.gu(0.5)
+        spacing: units.gu(0.5)
+        width: parent.width
+        Repeater{
+            id: dayLabelRepeater
+            model:7
+            delegate: dafaultDayLabelComponent
+        }
+    }
+
+    Grid{
+        id: monthGrid
+        property var monthStart: DateExt.getFirstDateofWeek(root.date.getFullYear(),root.date.getMonth())
+
+        rows: DateExt.weekCount(root.date.getFullYear(), root.date.getMonth())
+        columns: 7
+        spacing: units.gu(0.5)
+
+        anchors.top: dayLabelRow.bottom
+        anchors.topMargin: units.gu(0.5)
+
+        Repeater{
+            id: dateLabelRepeater
+            model: monthGrid.rows * monthGrid.columns
+            delegate: defaultDateLabelComponent
+        }
+    }
+
+    Component{
+        id: defaultDateLabelComponent
+
+        Text {
+            id: dateLabel
+
+            property var day: parent.monthStart.addDays(index)
+            property var isToday: day.isSameDay(intern.now)
+
+            text: day.getDate()
+            horizontalAlignment: Text.AlignHCenter
+            width: dummy.width
+            height: dummy.height
+            font.pointSize: dummy.font.pointSize
+            color: isToday ? Color.ubuntuOrange : dummy.color
+            scale: isToday ? 1.5 : 1.
+        }
+    }
+
+    Component{
+        id: dafaultDayLabelComponent
+        Text{
+            //FIXME: how to get localized day initial ?
+            text: Qt.locale().standaloneDayName( (intern.weekstartDay + index), Locale.ShortFormat).charAt(0)
+            horizontalAlignment: Text.AlignHCenter
+            width: dummy.width
+            height: dummy.height
+            font.pointSize: dummy.font.pointSize
+            font.bold: true
+        }
+    }
+
+    Text{
+        id: dummy
+        text: "00"
+        visible: false
+        font.pointSize: 7.5
+    }
+}

=== added file 'PathViewBase.qml'
--- PathViewBase.qml	1970-01-01 00:00:00 +0000
+++ PathViewBase.qml	2013-07-09 14:45:47 +0000
@@ -0,0 +1,39 @@
+import QtQuick 2.0
+
+PathView {
+    id: root
+
+    model: 3
+    snapMode: PathView.SnapOneItem
+
+    signal nextItemHighlighted();
+    signal previousItemHighlighted();
+
+    path: Path {
+        startX: -(root.width/2); startY: root.height/2
+        PathLine { relativeX: root.width; relativeY: 0 }
+        PathLine { relativeX: root.width; relativeY: 0 }
+        PathLine { relativeX: root.width; relativeY: 0 }
+    }
+
+    onCurrentIndexChanged: {
+        var diff = currentIndex - intern.previousIndex
+
+        if (intern.previousIndex === count - 1 && currentIndex === 0) diff = 1
+        if (intern.previousIndex === 0 && currentIndex === count - 1) diff = -1
+
+        intern.previousIndex = currentIndex
+
+        if ( diff > 0 ) {
+            root.nextItemHighlighted();
+        }
+        else {
+            root.previousItemHighlighted();
+        }
+    }
+
+    QtObject{
+        id: intern
+        property int previousIndex: root.currentIndex
+    }
+}

=== added file 'YearView.qml'
--- YearView.qml	1970-01-01 00:00:00 +0000
+++ YearView.qml	2013-07-09 14:45:47 +0000
@@ -0,0 +1,79 @@
+import QtQuick 2.0
+import Ubuntu.Components 0.1
+
+PathViewBase {
+    id: root
+
+    anchors.fill: parent
+    property var year: getDateFromYear(intern.now.getFullYear()-1);
+
+    signal monthSelected(var date);
+
+    onNextItemHighlighted: {
+        year = getDateFromYear(year.getFullYear() + 1);
+    }
+
+    onPreviousItemHighlighted: {
+        year = getDateFromYear(year.getFullYear() - 1);
+    }
+
+    function getDateFromYear(year) {
+        return new Date(year,0,1,0,0,0,0);
+    }
+
+    QtObject{
+        id: intern
+        property var now: new Date()
+        property int weekstartDay: Qt.locale().firstDayOfWeek
+    }
+
+    delegate: Item{
+        id: yearView
+
+        property var year: {
+            if (index === root.currentIndex) {
+                return root.year;
+            }
+            var previousIndex = root.currentIndex > 0 ? root.currentIndex - 1 : 2
+
+            if ( index === previousIndex ) {
+                return getDateFromYear(root.year.getFullYear()-1);
+            }
+
+            return getDateFromYear(root.year.getFullYear()+ 1);
+        }
+
+        width: parent.width
+        height: parent.height
+
+        Label{
+            id: yearLabel
+            text: year.getFullYear()
+            fontSize: "large"
+            anchors.horizontalCenter: parent.horizontalCenter
+            font.bold: true
+        }
+
+        Grid{
+            id: yearGrid
+            rows: 4
+            columns: 3
+
+            width: parent.width
+            height: parent.height
+            anchors.top: yearLabel.bottom
+            spacing: units.gu(2.5)
+
+            Repeater{
+                model: yearGrid.rows * yearGrid.columns
+                delegate: MonthComponent{
+                    date: new Date(year.getFullYear(),index,1,0,0,0,0)
+
+                    onMonthSelected: {
+                        root.monthSelected(date);
+                    }
+                }
+            }
+        }
+    }
+}

=== modified file 'calendar.qml'
--- calendar.qml	2013-06-12 15:47:15 +0000
+++ calendar.qml	2013-07-09 14:45:47 +0000
@@ -49,6 +49,11 @@
                         }
                     }
                 }
+                Action {
+                    iconSource: Qt.resolvedUrl("avatar.png")
+                    text: i18n.tr("Year view")
+                    onTriggered: pageStack.push(yearView);
+                }
             }
 
             Tabs {
@@ -110,6 +115,16 @@
                 id: newEventComponent
                 NewEvent {}
             }
+
+            Component{
+                id: yearView
+                YearView{
+                    onMonthSelected: {
+                        // TODO: select month in monthView
+                        pageStack.pop();
+                    }
+                }
+            }
         }
     }
 }

=== modified file 'dateExt.js'
--- dateExt.js	2013-04-21 07:52:56 +0000
+++ dateExt.js	2013-07-09 14:45:47 +0000
@@ -85,3 +85,18 @@
     && this.getMonth() === otherDay.getMonth()
     && this.getFullYear() === otherDay.getFullYear() );
 }
+
+function weekCount(year, month_number) {
+    var firstOfMonth = new Date(year, month_number, 1);
+    var lastOfMonth = new Date(year, month_number+1, 0);
+
+    var used = firstOfMonth.getDay() + lastOfMonth.getDate();
+
+    return Math.ceil( used / 7);
+}
+
+function getFirstDateofWeek( year, month) {
+    var date = new Date(year, month, 1);
+    var first = date.getDate() - date.getDay();
+    return new Date(date.setDate(first));
+}