Merge lp:~gary-wzl77/ubuntu-calendar-app/dynamic_creation_perf_tunning into lp:ubuntu-calendar-app

[Gary.Wang]

performance tuning

Performance tunning for page transition.
Page Transition between different views will cause dynamic creation(Qt.ResolvedUrl)
for qml object back and forth.Using Qt.CreateComponent for dynamic creation for 1st
time and reuse exsiting obj without re-creating.

related bugs:#1423185,#1309263

[Kunal Parmar (pkunal-parmar)]

Originally we were destroying Pages to conserve memory, but it that's not issue anymore. Then this MR looks good to me.

I will test some more and approve it.

Thanks for MR and taking your time to improve calendar

[Gary.Wang (gary-wzl77)]

Kunal, have u fun with this MR. Still two clear UI bugs has been fixed.
Pls approve.

BTW: Have u check this one on ur devices? it's marked as FIX COMMITTED.
     https://bugs.launchpad.net/ubuntu-calendar-app/+bug/1438910
     I can see it's still exciting with latest repo on 15.04(r211)

[Kunal Parmar (pkunal-parmar)]

sorry forgot about this MR, I will test this today night before calendar meeting and approve.

[Kunal Parmar (pkunal-parmar)]

looks good to me, thanks for MR

review: Approve

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

FAILED: Autolanding.
No commit message was specified in the merge proposal. Hit 'Add commit message' on the merge proposal web page or follow the link below. You can approve the merge proposal yourself to rerun.
https://code.launchpad.net/~gary-wzl77/ubuntu-calendar-app/dynamic_creation_perf_tunning/+merge/258449/+edit-commit-message

review: Needs Fixing (continuous-integration)

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

FAILED: Autolanding.
More details in the following jenkins job:
http://91.189.93.70:8080/job/ubuntu-calendar-app-autolanding/497/
Executed test runs:
    UNSTABLE: http://91.189.93.70:8080/job/generic-mediumtests-utopic/2740
        deb: http://91.189.93.70:8080/job/generic-mediumtests-utopic/2740/artifact/work/output/*zip*/output.zip
    SUCCESS: http://91.189.93.70:8080/job/ubuntu-calendar-app-utopic-amd64-autolanding/282
    SUCCESS: http://91.189.93.70:8080/job/ubuntu-calendar-app-vivid-amd64-autolanding/69

review: Needs Fixing (continuous-integration)

=== modified file 'ContactChoicePopup.qml'
--- ContactChoicePopup.qml	2014-09-20 10:45:35 +0000
+++ ContactChoicePopup.qml	2015-05-14 03:37:54 +0000
@@ -94,7 +94,7 @@
             objectName: "contactPopoverList"
             width: parent.width
             model: contactModel
-            height: units.gu(30)
+            height: units.gu(15)
             clip: true
             delegate: Standard{
                 objectName: "contactPopoverList%1".arg(index)
 
=== modified file 'EventBubble.qml'
--- EventBubble.qml	2015-01-22 19:34:59 +0000
+++ EventBubble.qml	2015-05-14 03:37:54 +0000
@@ -221,8 +221,8 @@
         anchors.fill: parent
         drag.target: isLiveEditing ? infoBubble : null
         drag.axis: Drag.YAxis
-        drag.minimumY: flickable.y
-        drag.maximumY: flickable.contentHeight - infoBubble.height
+        drag.minimumY: flickable === null? 0: flickable.y
+        drag.maximumY: flickable === null? 0 :flickable.contentHeight - infoBubble.height
         onReleased: parent.Drag.drop()
         onClicked: {
             if( isLiveEditing ) {
 
=== modified file 'EventListModel.qml'
--- EventListModel.qml	2014-09-28 05:25:31 +0000
+++ EventListModel.qml	2015-05-14 03:37:54 +0000
@@ -44,7 +44,7 @@
         var newObject = Qt.createQmlObject("import QtQuick 2.3; Timer {interval: 1000; running: true; repeat: false;}",
             eventModel, "EventListMode.qml");
         newObject.onTriggered.connect( function(){
-            var items = getItems(eventModel.startPeriod, eventModel.endPeriod);
+            var items = itemsByTimePeriod(eventModel.startPeriod, eventModel.endPeriod);
             if( isLoading == true && items.length === 0) {
                 isLoading = false;
                 modelChanged();
@@ -53,7 +53,6 @@
         });
     }
 
-
     onModelChanged: {
         isLoading = false
         if(listeners === undefined){
 
=== modified file 'NewEvent.qml'
--- NewEvent.qml	2015-04-05 04:54:54 +0000
+++ NewEvent.qml	2015-05-14 03:37:54 +0000
@@ -219,6 +219,7 @@
             event.collectionId = calendarsOption.model[calendarsOption.selectedIndex].collectionId;
             model.saveItem(event);
             pageStack.pop();
+
             root.eventAdded(event);
         }
     }
 
=== modified file 'YearView.qml'
--- YearView.qml	2015-02-18 19:27:20 +0000
+++ YearView.qml	2015-05-14 03:37:54 +0000
@@ -29,6 +29,12 @@
 
     Keys.forwardTo: [yearPathView]
 
+    function refreshCurrentYear(year) {
+        currentYear = year;
+        var yearViewDelegate = yearPathView.currentItem.item;
+        yearViewDelegate.refresh();
+    }
+
     Action {
         id: calendarTodayAction
         objectName:"todaybutton"
@@ -85,7 +91,7 @@
 
                     scrollMonth: 0;
                     isCurrentItem: index == yearPathView.currentIndex
-                    year: (yearViewPage.currentYear + yearPathView.indexType(index))
+                    year: (currentYear + yearPathView.indexType(index))
 
                     anchors.fill: parent
                 }
 
=== modified file 'YearViewDelegate.qml'
--- YearViewDelegate.qml	2014-11-29 09:40:53 +0000
+++ YearViewDelegate.qml	2015-05-14 03:37:54 +0000
@@ -18,6 +18,19 @@
     model: 12 /* months in a year */
 
     onYearChanged: {
+        refresh();
+    }
+
+    //scroll in case content height changed
+    onHeightChanged: {
+        yearView.positionViewAtIndex(scrollMonth, GridView.Beginning);
+    }
+
+    Component.onCompleted: {
+        yearView.positionViewAtIndex(scrollMonth, GridView.Beginning);
+    }
+
+    function refresh() {
         scrollMonth = 0;
         var today = new Date();
         if(year == today.getFullYear()) {
@@ -26,15 +39,6 @@
         yearView.positionViewAtIndex(scrollMonth, GridView.Beginning);
     }
 
-    //scroll in case content height changed
-    onHeightChanged: {
-        yearView.positionViewAtIndex(scrollMonth, GridView.Beginning);
-    }
-
-    Component.onCompleted: {
-        yearView.positionViewAtIndex(scrollMonth, GridView.Beginning);
-    }
-
     Connections{
         target: yearPathView
         onScrollUp: {
 
=== modified file 'calendar.qml'
--- calendar.qml	2015-01-22 20:07:30 +0000
+++ calendar.qml	2015-05-14 03:37:54 +0000
@@ -186,7 +186,7 @@
 
         Tabs{
             id: tabs
-            Keys.forwardTo: [tabs.currentPage.item]
+            Keys.forwardTo: [tabs.currentPage]
 
             property var currentDay: DateExt.today();
 
@@ -316,156 +316,139 @@
                 }
             }
 
+            onSelectedTabChanged: {
+                switch (tabs.selectedTab) {
+                case yearTab:{
+                    if (yearTab.page === null) {
+                        var yearViewCom = Qt.createComponent("YearView.qml");
+                        if (yearViewCom.status === Component.Ready) {
+                            var yearViewObj = yearViewCom.createObject(mainView);
+
+                            yearViewObj.monthSelected.connect(function (date){
+                                var now = DateExt.today();
+                                if( date.getMonth() === now.getMonth()
+                                        && date.getFullYear() === now.getFullYear()) {
+                                    tabs.currentDay = now;
+                                } else {
+                                    tabs.currentDay = date.midnight();
+                                }
+                                tabs.selectedTabIndex = monthTab.index;
+                            })
+
+                            yearTab.page = yearViewObj;
+                        }
+                    } else {
+                        yearTab.page.refreshCurrentYear(DateExt.today().getFullYear());
+                    }
+                } break;
+                case monthTab: {
+                    if (monthTab.page === null) {
+                        var monthViewCom = Qt.createComponent("MonthView.qml");
+                        if (monthViewCom.status === Component.Ready) {
+                            var monthViewObj = monthViewCom.createObject(mainView);
+
+                            monthViewObj.dateSelected.connect(function (date) {
+                                tabs.currentDay = date;
+                                tabs.selectedTabIndex = dayTab.index;
+                            })
+
+                            monthTab.page = monthViewObj;
+                        }
+                    } else {
+                        monthTab.page.currentMonth = tabs.currentDay.midnight();
+                    }
+                } break;
+                case weekTab: {
+                    if (weekTab.page === null) {
+                        var weekViewCom = Qt.createComponent("WeekView.qml");
+                        if (weekViewCom.status === Component.Ready) {
+                            var weekViewObj = weekViewCom.createObject(mainView);
+
+                            weekViewObj.isCurrentPage = Qt.binding(function() { return tabs.selectedTab == weekTab })
+                            weekViewObj.onDayStartChanged.connect(function (){
+                                tabs.currentDay = weekViewObj.dayStart;
+                            });
+                            weekViewObj.dateSelected.connect(function (date){
+                                tabs.currentDay = date;
+                                tabs.selectedTabIndex = dayTab.index;
+                            });
+
+                            weekTab.page = weekViewObj;
+                        }
+                    } else {
+                        weekTab.page.dayStart = tabs.currentDay;
+                    }
+                } break;
+                case dayTab: {
+                    if (dayTab.page === null) {
+                        var dayViewCom = Qt.createComponent("DayView.qml");
+                        if (dayViewCom.status === Component.Ready) {
+                            var dayViewObj = dayViewCom.createObject(mainView);
+
+                            dayViewObj.isCurrentPage= Qt.binding(function() { return tabs.selectedTab == dayTab })
+                            dayViewObj.onCurrentDayChanged.connect(function (){
+                                tabs.currentDay = dayViewObj.currentDay;
+                            });
+                            dayViewObj.dateSelected.connect(function (date) {
+                                tabs.currentDay = date;
+                            });
+
+                            dayTab.page  =dayViewObj;
+                        }
+                    } else {
+                        dayTab.page.currentDay = tabs.currentDay;
+                    }
+                } break;
+                case agendaTab: {
+                    var agendaViewCom = Qt.createComponent("AgendaView.qml");
+                    if (agendaViewCom.status === Component.Ready) {
+                        var agendaViewObj = agendaViewCom.createObject(mainView);
+
+                        agendaViewObj.dateSelected.connect(function (date){
+                            tabs.currentDay = date;
+                            tabs.selectedTabIndex = dayTab.index;
+                        })
+                        agendaTab.page = agendaViewObj;
+                    }
+                } break;
+                default:
+                    break;
+                }
+            }
+
             Tab{
                 id: yearTab
                 objectName: "yearTab"
                 title: i18n.tr("Year")
-                page: Loader{
-                    id: yearViewLoader
-                    objectName: "yearViewLoader"
-                    source: tabs.selectedTab == yearTab ? Qt.resolvedUrl("YearView.qml"):""
-                    onLoaded: {
-                        item.currentYear = tabs.currentDay.getFullYear();
-                    }
-
-                    anchors{
-                        left: parent.left
-                        right: parent.right
-                        bottom: parent.bottom
-                    }
-
-                    Connections{
-                        target: yearViewLoader.item
-                        onMonthSelected: {
-                            var now = DateExt.today();
-                            if( date.getMonth() === now.getMonth()
-                                    && date.getFullYear() === now.getFullYear()) {
-                                tabs.currentDay = now;
-                            } else {
-                                tabs.currentDay = date.midnight();
-                            }
-                            tabs.selectedTabIndex = monthTab.index;
-                        }
-                    }
-                }
+                page: null
             }
 
             Tab{
                 id: monthTab
                 objectName: "monthTab"
                 title: i18n.tr("Month")
-                page: Loader{
-                    id: monthViewLoader
-                    objectName: "monthViewLoader"
-                    source: tabs.selectedTab == monthTab ? Qt.resolvedUrl("MonthView.qml"):""
-                    onLoaded: {
-                        item.currentMonth = tabs.currentDay.midnight();
-                    }
-
-                    anchors{
-                        left: parent.left
-                        right: parent.right
-                        bottom: parent.bottom
-                    }
-
-                    Connections{
-                        target: monthViewLoader.item
-                        onDateSelected: {
-                            tabs.currentDay = date;
-                            tabs.selectedTabIndex = dayTab.index;
-                        }
-                    }
-                }
+                page: null
             }
 
             Tab{
                 id: weekTab
                 objectName: "weekTab"
                 title: i18n.tr("Week")
-                page: Loader{
-                    id: weekViewLoader
-                    objectName: "weekViewLoader"
-                    source: tabs.selectedTab == weekTab ? Qt.resolvedUrl("WeekView.qml"):""
-                    onLoaded: {
-                        item.isCurrentPage= Qt.binding(function() { return tabs.selectedTab == weekTab })
-                        item.dayStart = tabs.currentDay;
-                    }
-
-                    anchors{
-                        left: parent.left
-                        right: parent.right
-                        bottom: parent.bottom
-                    }
-
-                    Connections{
-                        target: weekViewLoader.item
-                        onDayStartChanged: {
-                            tabs.currentDay = weekViewLoader.item.dayStart;
-                        }
-
-                        onDateSelected: {
-                            tabs.currentDay = date;
-                            tabs.selectedTabIndex = dayTab.index;
-                        }
-                    }
-                }
+                page: null
             }
 
             Tab{
                 id: dayTab
                 objectName: "dayTab"
                 title: i18n.tr("Day")
-                page: Loader{
-                    id: dayViewLoader
-                    objectName: "dayViewLoader"
-                    source: tabs.selectedTab == dayTab ? Qt.resolvedUrl("DayView.qml"):""
-                    onLoaded: {
-                        item.isCurrentPage= Qt.binding(function() { return tabs.selectedTab == dayTab })
-                        item.currentDay = tabs.currentDay;
-                    }
-
-                    anchors{
-                        left: parent.left
-                        right: parent.right
-                        bottom: parent.bottom
-                    }
-
-                    Connections{
-                        target: dayViewLoader.item
-                        onCurrentDayChanged: {
-                            tabs.currentDay = dayViewLoader.item.currentDay;
-                        }
-
-                        onDateSelected: {
-                            tabs.currentDay = date;
-                        }
-                    }
-                }
+                page: null
             }
 
             Tab {
                 id: agendaTab
                 objectName: "agendaTab"
                 title: i18n.tr("Agenda")
-                page: Loader {
-                    id: agendaViewLoader
-                    objectName: "agendaViewLoader"
-                    source: tabs.selectedTab == agendaTab ? Qt.resolvedUrl("AgendaView.qml"):""
-
-                    anchors{
-                        left: parent.left
-                        right: parent.right
-                        bottom: parent.bottom
-                    }
-
-                    Connections{
-                        target: agendaViewLoader.item
-                        onDateSelected: {
-                            tabs.currentDay = date;
-                            tabs.selectedTabIndex = dayTab.index;
-                        }
-                    }
-                }
+                page: null
             }
         }
     }
 
=== modified file 'po/com.ubuntu.calendar.pot'
--- po/com.ubuntu.calendar.pot	2015-04-17 05:05:13 +0000
+++ po/com.ubuntu.calendar.pot	2015-05-14 03:37:54 +0000
@@ -8,7 +8,7 @@
 msgstr ""
 "Project-Id-Version: \n"
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2015-04-17 07:04+0200\n"
+"POT-Creation-Date: 2015-05-14 11:34+0800\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <[e-mail]>\n"
@@ -19,7 +19,7 @@
 "Plural-Forms: nplurals=INTEGER; plural=EXPRESSION;\n"
 
 #: ../AgendaView.qml:51 ../DayView.qml:40 ../MonthView.qml:37
-#: ../WeekView.qml:42 ../YearView.qml:36
+#: ../WeekView.qml:42 ../YearView.qml:42
 msgid "Today"
 msgstr ""
 
@@ -37,7 +37,7 @@
 
 #. TRANSLATORS: the first argument (%1) refers to a start time for an event,
 #. while the second one (%2) refers to the end time
-#: ../AgendaView.qml:168 ../EventBubble.qml:131
+#: ../AgendaView.qml:168 ../EventBubble.qml:133
 #, qt-format
 msgid "%1 - %2"
 msgstr ""
@@ -59,7 +59,7 @@
 msgstr[0] ""
 msgstr[1] ""
 
-#: ../CalendarChoicePopup.qml:33 ../EventActions.qml:59
+#: ../CalendarChoicePopup.qml:33 ../EventActions.qml:60
 msgid "Calendars"
 msgstr ""
 
@@ -77,15 +77,15 @@
 msgid "Syncing"
 msgstr ""
 
-#: ../CalendarChoicePopup.qml:70
+#: ../CalendarChoicePopup.qml:71
 msgid "Add new Calendar"
 msgstr ""
 
-#: ../ColorPickerDialog.qml:24
+#: ../ColorPickerDialog.qml:25
 msgid "Select Color"
 msgstr ""
 
-#: ../ColorPickerDialog.qml:53 ../DeleteConfirmationDialog.qml:60
+#: ../ColorPickerDialog.qml:55 ../DeleteConfirmationDialog.qml:60
 #: ../EditEventConfirmationDialog.qml:53
 msgid "Cancel"
 msgstr ""
@@ -101,7 +101,7 @@
 #. TRANSLATORS: this is a time formatting string,
 #. see http://qt-project.org/doc/qt-5/qml-qtqml-date.html#details for valid expressions.
 #. It's used in the header of the month and week views
-#: ../DayView.qml:59 ../MonthView.qml:57 ../WeekView.qml:61
+#: ../DayView.qml:59 ../MonthView.qml:58 ../WeekView.qml:61
 msgid "MMMM yyyy"
 msgstr ""
 
@@ -136,7 +136,7 @@
 msgid "Delete"
 msgstr ""
 
-#: ../EditEventConfirmationDialog.qml:29 ../NewEvent.qml:283
+#: ../EditEventConfirmationDialog.qml:29 ../NewEvent.qml:287
 msgid "Edit Event"
 msgstr ""
 
@@ -154,18 +154,18 @@
 msgid "Edit this"
 msgstr ""
 
-#: ../EventActions.qml:50 ../NewEvent.qml:283
+#: ../EventActions.qml:50 ../NewEvent.qml:287
 msgid "New Event"
 msgstr ""
 
 #. TRANSLATORS: the first argument (%1) refers to a time for an event,
 #. while the second one (%2) refers to title of event
-#: ../EventBubble.qml:142 ../EventBubble.qml:147
+#: ../EventBubble.qml:144 ../EventBubble.qml:149
 #, qt-format
 msgid "%1 <b>%2</b>"
 msgstr ""
 
-#: ../EventDetails.qml:42 ../NewEvent.qml:393
+#: ../EventDetails.qml:42 ../NewEvent.qml:398
 msgid "Event Details"
 msgstr ""
 
@@ -189,11 +189,11 @@
 msgid "Edit"
 msgstr ""
 
-#: ../EventDetails.qml:347 ../NewEvent.qml:479
+#: ../EventDetails.qml:347 ../NewEvent.qml:500
 msgid "Guests"
 msgstr ""
 
-#: ../EventDetails.qml:390 ../EventReminder.qml:35 ../NewEvent.qml:578
+#: ../EventDetails.qml:390 ../EventReminder.qml:35 ../NewEvent.qml:599
 msgid "Reminder"
 msgstr ""
 
@@ -201,26 +201,26 @@
 #. and it is shown as the header of the page to choose repetition
 #. and as the header of the list item that shows the repetition
 #. summary in the page that displays the event details
-#: ../EventRepetition.qml:41 ../EventRepetition.qml:132
+#: ../EventRepetition.qml:41 ../EventRepetition.qml:150
 msgid "Repeat"
 msgstr ""
 
-#: ../EventRepetition.qml:151
+#: ../EventRepetition.qml:169
 msgid "Repeats On:"
 msgstr ""
 
-#: ../EventRepetition.qml:196
+#: ../EventRepetition.qml:214
 msgid "Recurring event ends"
 msgstr ""
 
 #. TRANSLATORS: this refers to how often a recurrent event repeats
 #. and it is shown as the header of the option selector to choose
 #. its repetition
-#: ../EventRepetition.qml:219 ../NewEvent.qml:560
+#: ../EventRepetition.qml:237 ../NewEvent.qml:581
 msgid "Repeats"
 msgstr ""
 
-#: ../EventRepetition.qml:244
+#: ../EventRepetition.qml:262
 msgid "Date"
 msgstr ""
 
@@ -259,51 +259,51 @@
 msgid "After Date"
 msgstr ""
 
-#: ../NewEvent.qml:59
+#: ../NewEvent.qml:61
 msgid "Save"
 msgstr ""
 
-#: ../NewEvent.qml:165
+#: ../NewEvent.qml:170
 msgid "End time can't be before start time"
 msgstr ""
 
-#: ../NewEvent.qml:293
+#: ../NewEvent.qml:297
 msgid "Error"
 msgstr ""
 
-#: ../NewEvent.qml:295
+#: ../NewEvent.qml:299
 msgid "OK"
 msgstr ""
 
-#: ../NewEvent.qml:347
+#: ../NewEvent.qml:352
 msgid "From"
 msgstr ""
 
-#: ../NewEvent.qml:360
+#: ../NewEvent.qml:365
 msgid "To"
 msgstr ""
 
-#: ../NewEvent.qml:377
+#: ../NewEvent.qml:382
 msgid "All day event"
 msgstr ""
 
-#: ../NewEvent.qml:406
+#: ../NewEvent.qml:411
 msgid "Event Name"
 msgstr ""
 
-#: ../NewEvent.qml:419
+#: ../NewEvent.qml:429
 msgid "Description"
 msgstr ""
 
-#: ../NewEvent.qml:432
+#: ../NewEvent.qml:447
 msgid "Location"
 msgstr ""
 
-#: ../NewEvent.qml:441 com.ubuntu.calendar_calendar.desktop.in.in.h:1
+#: ../NewEvent.qml:462 com.ubuntu.calendar_calendar.desktop.in.in.h:1
 msgid "Calendar"
 msgstr ""
 
-#: ../NewEvent.qml:483
+#: ../NewEvent.qml:504
 msgid "Add Guest"
 msgstr ""
 
@@ -390,6 +390,10 @@
 msgid "2 weeks"
 msgstr ""
 
+#: ../TimeLineBase.qml:73
+msgid "Untitled"
+msgstr ""
+
 #. TRANSLATORS: W refers to Week, followed by the actual week number (%1)
 #: ../TimeLineHeader.qml:49
 #, qt-format
@@ -400,7 +404,7 @@
 msgid "All Day"
 msgstr ""
 
-#: ../YearView.qml:54
+#: ../YearView.qml:60
 #, qt-format
 msgid "Year %1"
 msgstr ""
@@ -412,23 +416,23 @@
 "about them"
 msgstr ""
 
-#: ../calendar.qml:322
+#: ../calendar.qml:422
 msgid "Year"
 msgstr ""
 
-#: ../calendar.qml:356
+#: ../calendar.qml:429
 msgid "Month"
 msgstr ""
 
-#: ../calendar.qml:384
+#: ../calendar.qml:436
 msgid "Week"
 msgstr ""
 
-#: ../calendar.qml:417
+#: ../calendar.qml:443
 msgid "Day"
 msgstr ""
 
-#: ../calendar.qml:449
+#: ../calendar.qml:450
 msgid "Agenda"
 msgstr ""