Merge lp:~nik90/ubuntu-clock-app/dynamic-pageheadstate-load into lp:ubuntu-clock-app

[Nekhelesh Ramananthan]

Dynamically load/unload the search mode in world city list and multiselect view in the alarm page which reduces the creation time by a few ms.

This MP implements the following,
- Dynamically load/unload the alarm page multiselection PageHeadState which reduces the creation time by 5ms.
- Dynamically load/unload the search mode in the worldcitypage which reduces the creation time by 7ms.
- Unload the Empty alarm state when not required

[Nekhelesh Ramananthan (nik90)]

Dont let the big code diff trick you ;). It is just moving some code into a Component{} and using a Loader{}. No UI changes. Just performance patches.

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

PASSED: Continuous integration, rev:155
http://91.189.93.70:8080/job/ubuntu-clock-app-ci/567/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/generic-mediumtests-utopic-python3/977
        deb: http://91.189.93.70:8080/job/generic-mediumtests-utopic-python3/977/artifact/work/output/*zip*/output.zip

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

review: Approve (continuous-integration)

[lp:~nik90/ubuntu-clock-app/dynamic-pageheadstate-load]

156. By Nekhelesh Ramananthan on 2014-10-16

Removed clip whereever it is unnecessary

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

PASSED: Continuous integration, rev:156
http://91.189.93.70:8080/job/ubuntu-clock-app-ci/568/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/generic-mediumtests-utopic-python3/989
        deb: http://91.189.93.70:8080/job/generic-mediumtests-utopic-python3/989/artifact/work/output/*zip*/output.zip

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

review: Approve (continuous-integration)

[Riccardo Padovani (rpadovani)]

lgtm

review: Approve

=== modified file 'app/alarm/AlarmPage.qml'
--- app/alarm/AlarmPage.qml	2014-10-11 11:46:39 +0000
+++ app/alarm/AlarmPage.qml	2014-10-16 19:04:00 +0000
@@ -61,68 +61,76 @@
                 }
             }
 
-            contents: Item {
+            contents: Loader {
+                id: selectionStateLoader
+                active: alarmPage.state === "selection"
+                sourceComponent: selectionStateComponent
+                height: parent ? parent.height : undefined
                 anchors.right: parent ? parent.right: undefined
-                height: parent ? parent.height : undefined
-
-                HeaderButton {
-                    id: selectButton
-
-                    anchors {
-                        right: deleteButton.left
-                        rightMargin: units.gu(1)
-                    }
-
-                    text: {
-                        if(alarmListView.selectedItems.count === alarmListView.count) {
-                            return i18n.tr("Select None")
-                        } else {
-                            return i18n.tr("Select All")
-                        }
-                    }
-
-                    iconSource: {
-                        if(alarmListView.selectedItems.count === alarmListView.count) {
-                            return Qt.resolvedUrl("../graphics/select-none.svg")
-                        } else {
-                            return Qt.resolvedUrl("../graphics/select.svg")
-                        }
-                    }
-
-                    onTriggered: {
-                        if(alarmListView.selectedItems.count === alarmListView.count) {
-                            alarmListView.clearSelection()
-                        } else {
-                            alarmListView.selectAll()
-                        }
-                    }
-                }
-
-                HeaderButton {
-                    id: deleteButton
-
-                    anchors.right: parent.right
-                    anchors.rightMargin: units.gu(2)
-
-                    iconName: "delete"
-                    text: i18n.tr("Delete")
-                    enabled: alarmListView.selectedItems.count !== 0
-
-                    onTriggered: {
-                        var items = alarmListView.selectedItems
-
-                        for(var i=0; i < items.count; i++) {
-                            var alarm = alarmModel.get(items.get(i).itemsIndex)
-                            alarm.cancel()
-                        }
-
-                        alarmListView.endSelection()
-                    }
-                }
             }
         }
     ]
 
+    Component {
+        id: selectionStateComponent
+        Item {
+            HeaderButton {
+                id: selectButton
+
+                anchors {
+                    right: deleteButton.left
+                    rightMargin: units.gu(1)
+                }
+
+                text: {
+                    if(alarmListView.selectedItems.count === alarmListView.count) {
+                        return i18n.tr("Select None")
+                    } else {
+                        return i18n.tr("Select All")
+                    }
+                }
+
+                iconSource: {
+                    if(alarmListView.selectedItems.count === alarmListView.count) {
+                        return Qt.resolvedUrl("../graphics/select-none.svg")
+                    } else {
+                        return Qt.resolvedUrl("../graphics/select.svg")
+                    }
+                }
+
+                onTriggered: {
+                    if(alarmListView.selectedItems.count === alarmListView.count) {
+                        alarmListView.clearSelection()
+                    } else {
+                        alarmListView.selectAll()
+                    }
+                }
+            }
+
+            HeaderButton {
+                id: deleteButton
+
+                anchors.right: parent.right
+                anchors.rightMargin: units.gu(2)
+
+                iconName: "delete"
+                text: i18n.tr("Delete")
+                enabled: alarmListView.selectedItems.count !== 0
+
+                onTriggered: {
+                    var items = alarmListView.selectedItems
+
+                    for(var i=0; i < items.count; i++) {
+                        var alarm = alarmModel.get(items.get(i).itemsIndex)
+                        alarm.cancel()
+                    }
+
+                    alarmListView.endSelection()
+                }
+            }
+        }
+    }
+
     AlarmList {
         id: alarmListView
         listModel: alarmModel
@@ -130,12 +138,17 @@
         localTime: clockTime
     }
 
-    EmptyState {
-        visible: alarmModel ? alarmModel.count === 0 : true
-        anchors.verticalCenter: parent.verticalCenter
-
-        iconName: "alarm-clock"
-        title: i18n.tr("No saved alarms")
-        subTitle: i18n.tr("Tap the + icon to add an alarm")
+    Loader {
+        id: emptyStateLoader
+        anchors.centerIn: parent
+        active: alarmModel ? alarmModel.count === 0 : true
+        Component.onCompleted: {
+            setSource(Qt.resolvedUrl("../components/EmptyState.qml"),
+                      {
+                          "iconName": "alarm-clock",
+                          "title": i18n.tr("No saved alarms"),
+                          "subTitle": i18n.tr("Tap the + icon to add an alarm")
+                      })
+        }
     }
 }

=== modified file 'app/alarm/AlarmSettingsPage.qml'
--- app/alarm/AlarmSettingsPage.qml	2014-10-15 20:59:05 +0000
+++ app/alarm/AlarmSettingsPage.qml	2014-10-16 19:04:00 +0000
@@ -28,7 +28,7 @@
 
     title: i18n.tr("Settings")
     visible: false
-    flickable: null
+    flickable: settingsPlugin
 
     Connections {
         target: clockApp
@@ -74,7 +74,6 @@
 
         contentHeight: _settingsColumn.height
         anchors.fill: parent
-        clip: true
 
         Column {
             id: _settingsColumn
@@ -169,11 +168,12 @@
 
                     ListView {
                         id: _resultsList
-                        clip: true
+
                         interactive: false
                         model: durationModel
                         width: parent.width
                         height: units.gu(24)
+
                         delegate: ListItem.Standard {
                             text: model.text
                             onClicked: {
@@ -237,7 +237,7 @@
 
                     ListView {
                         id: _snoozeResultsList
-                        clip: true
+
                         interactive: false
                         model: snoozeModel
                         width: parent.width

=== modified file 'app/alarm/AlarmSound.qml'
--- app/alarm/AlarmSound.qml	2014-09-25 11:26:43 +0000
+++ app/alarm/AlarmSound.qml	2014-10-16 19:04:00 +0000
@@ -53,7 +53,6 @@
     Flickable {
         id: _pageFlickable
 
-        clip: true
         anchors.fill: parent
         contentHeight: soundModel.count * units.gu(7)
 

=== modified file 'app/alarm/EditAlarmPage.qml'
--- app/alarm/EditAlarmPage.qml	2014-10-15 09:52:24 +0000
+++ app/alarm/EditAlarmPage.qml	2014-10-16 19:04:00 +0000
@@ -262,7 +262,6 @@
                 margins: units.gu(-2)
             }
 
-            clip: true
             mode: "Hours|Minutes"
             date: {
                 if(isNewAlarm) {

=== modified file 'app/components/EmptyState.qml'
--- app/components/EmptyState.qml	2014-09-12 15:36:38 +0000
+++ app/components/EmptyState.qml	2014-10-16 19:04:00 +0000
@@ -19,14 +19,20 @@
 import QtQuick 2.3
 import Ubuntu.Components 1.1
 
+/*
+ Component which displays an empty state (approved by design). It offers an
+ icon, title and subtitle to describe the empty state.
+*/
+
 Item {
+    id: emptyState
 
+    // Public APIs
     property alias iconName: emptyIcon.name
     property alias title: emptyLabel.text
     property alias subTitle: emptySublabel.text
 
     height: childrenRect.height
-    width: parent.width
 
     Icon {
         id: emptyIcon

=== modified file 'app/worldclock/WorldCityList.qml'
--- app/worldclock/WorldCityList.qml	2014-10-15 20:42:24 +0000
+++ app/worldclock/WorldCityList.qml	2014-10-16 19:04:00 +0000
@@ -64,8 +64,9 @@
                     text: i18n.tr("City")
                     onTriggered: {
                         worldCityList.state = "search"
+                        searchComponentLoader.sourceComponent = searchComponent
                         jsonTimeZoneModelLoader.sourceComponent = jsonTimeZoneModelComponent
-                        searchField.forceActiveFocus()
+                        searchComponentLoader.item.forceActiveFocus()
                     }
                 }
             ]
@@ -79,59 +80,66 @@
                 text: i18n.tr("Back")
                 onTriggered: {
                     cityList.forceActiveFocus()
-                    searchField.text = ""
+                    searchComponentLoader.item.text = ""
                     worldCityList.state = "default"
                     isOnlineMode = false
+                    searchComponentLoader.sourceComponent = undefined
                     jsonTimeZoneModelLoader.sourceComponent = undefined
                 }
             }
 
-            contents: TextField {
-                id: searchField
-                objectName: "searchField"
-
-                inputMethodHints: Qt.ImhNoPredictiveText
-                placeholderText: i18n.tr("Search...")
-
+            contents: Loader {
+                id: searchComponentLoader
                 anchors {
                     left: parent ? parent.left : undefined
                     right: parent ? parent.right : undefined
                     rightMargin: units.gu(2)
                 }
-
-                Timer {
-                    id: search_timer
-                    interval: isOnlineMode ? 1 : 500
-                    repeat: false
-                    onTriggered:  {
-                        isOnlineMode = false
-                        console.log("Search string: " + searchField.text)
-
-                        if(!isOnlineMode && sortedTimeZoneModel.count === 0) {
-                            console.log("Enabling online mode")
-                            isOnlineMode = true
-                        }
-
-                        if(isOnlineMode) {
-                            var url = String("%1%2%3")
-                            .arg("http://geoname-lookup.ubuntu.com/?query=")
-                            .arg(searchField.text)
-                            .arg("&app=com.ubuntu.clock&version=3.2.x")
-                            console.log("Online URL: " + url)
-                            if (jsonTimeZoneModelLoader.status === Loader.Ready) {
-                                jsonTimeZoneModel.source = Qt.resolvedUrl(url)
-                            }
-                        }
-                    }
-                }
-
-                onTextChanged: {
-                    search_timer.restart()
-                }
             }
         }
     ]
 
+    Component {
+        id: searchComponent
+        TextField {
+            id: searchField
+            objectName: "searchField"
+
+            inputMethodHints: Qt.ImhNoPredictiveText
+            placeholderText: i18n.tr("Search...")
+
+            Timer {
+                id: search_timer
+                interval: isOnlineMode ? 1 : 500
+                repeat: false
+                onTriggered:  {
+                    isOnlineMode = false
+                    console.log("Search string: " + searchField.text)
+
+                    if(!isOnlineMode && sortedTimeZoneModel.count === 0) {
+                        console.log("Enabling online mode")
+                        isOnlineMode = true
+                    }
+
+                    if(isOnlineMode) {
+                        var url = String("%1%2%3")
+                        .arg("http://geoname-lookup.ubuntu.com/?query=")
+                        .arg(searchField.text)
+                        .arg("&app=com.ubuntu.clock&version=3.2.x")
+                        console.log("Online URL: " + url)
+                        if (jsonTimeZoneModelLoader.status === Loader.Ready) {
+                            jsonTimeZoneModel.source = Qt.resolvedUrl(url)
+                        }
+                    }
+                }
+            }
+
+            onTextChanged: {
+                search_timer.restart()
+            }
+        }
+    }
+
     Connections {
         target: clockApp
         onApplicationStateChanged: {
@@ -193,7 +201,8 @@
         sort.property: "city"
         sort.order: Qt.AscendingOrder
         filter.property: "city"
-        filter.pattern: RegExp(searchField.text, "gi")
+        filter.pattern: searchComponentLoader.status === Loader.Ready ? RegExp(searchComponentLoader.item.text, "gi")
+                                                                      : RegExp("", "gi")
     }
 
     Label {

=== modified file 'debian/changelog'
--- debian/changelog	2014-10-15 21:01:31 +0000
+++ debian/changelog	2014-10-16 19:04:00 +0000
@@ -21,6 +21,8 @@
     dynamically (LP: #1381429)
   * Replaced ListItem.Base with ListItem.Empty throughout the clock app to reduce
     creation time (performance).
+  * Dynamically load/unload the search mode in world city list and multiselect view in
+    alarm page which reduces the creation time by a few ms.
   * Customised splash screen (white background) (LP: #1377638)
 
   [Akiva Shammai Avraham]