Merge lp:~tpeeters/ubuntu-ui-toolkit/panelColor into lp:ubuntu-ui-toolkit/staging

[Tim Peeters]

Fix the panel colors for the tabs and actions overflow in the header.

[lp:~tpeeters/ubuntu-ui-toolkit/panelColor]

1317. By Tim Peeters on 2014-11-03

revert unrelated change

1318. By Tim Peeters on 2014-11-03

revert unrelated change

[Zsombor Egri (zsombi)]

Small comments inline.

review: Needs Information

[PS Jenkins bot (ps-jenkins)]

FAILED: Continuous integration, rev:1318
http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-ci/1193/
Executed test runs:
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-utopic-touch/6410
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-amd64-ci/1026
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-armhf-ci/1025
        deb: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-armhf-ci/1025/artifact/work/output/*zip*/output.zip
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-i386-ci/1025
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-mako/6014
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/7662
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/7662/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/15357

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-ci/1193/rebuild

review: Needs Fixing (continuous-integration)

[lp:~tpeeters/ubuntu-ui-toolkit/panelColor]

1319. By Tim Peeters on 2014-11-03

REVIEW COMMENT: Remove deprecated properties

[Tim Peeters (tpeeters)]

The inline comments disappear when I push an update.

I removed the deprecated properties, but did not change the property square. I did not touch that property (only documented it), so if we want to change that we can do it in a separate MR.

Ready to be approved if you like it like this.

[lp:~tpeeters/ubuntu-ui-toolkit/panelColor]

1320. By Tim Peeters on 2014-11-03

rename panelColor to panelBackgroundColor because more panel colors will be added later.

[Tim Peeters (tpeeters)]

There is a follow-up MR here: https://code.launchpad.net/~tpeeters/ubuntu-ui-toolkit/phsProperties/+merge/240500

[PS Jenkins bot (ps-jenkins)]

FAILED: Continuous integration, rev:1319
http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-ci/1195/
Executed test runs:
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-utopic-touch/6419
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-amd64-ci/1028
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-armhf-ci/1027
        deb: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-armhf-ci/1027/artifact/work/output/*zip*/output.zip
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-i386-ci/1027
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-mako/6023
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/7671
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/7671/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/15370

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-ci/1195/rebuild

review: Needs Fixing (continuous-integration)

[PS Jenkins bot (ps-jenkins)]

FAILED: Continuous integration, rev:1320
http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-ci/1197/
Executed test runs:
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-utopic-touch/6423
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-amd64-ci/1030
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-armhf-ci/1029
        deb: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-armhf-ci/1029/artifact/work/output/*zip*/output.zip
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-utopic-i386-ci/1029
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-mako/6026
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/7675
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/7675/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/15374

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-ci/1197/rebuild

review: Needs Fixing (continuous-integration)

[Zsombor Egri (zsombi)]

Looks good. Thx!

review: Approve

[PS Jenkins bot (ps-jenkins)]

review: Approve (continuous-integration)

=== modified file 'modules/Ubuntu/Components/AppHeader.qml'
--- modules/Ubuntu/Components/AppHeader.qml	2014-10-24 16:24:46 +0000
+++ modules/Ubuntu/Components/AppHeader.qml	2014-11-03 20:32:09 +0000
@@ -42,6 +42,11 @@
      */
     property color dividerColor
 
+    /*!
+      The background color of the panel. Value set by MainView.
+     */
+    property color panelColor
+
     Behavior on y {
         enabled: animate && !(header.flickable && header.flickable.moving)
         SmoothedAnimation {

=== modified file 'modules/Ubuntu/Components/MainView.qml'
--- modules/Ubuntu/Components/MainView.qml	2014-10-24 13:13:11 +0000
+++ modules/Ubuntu/Components/MainView.qml	2014-11-03 20:32:09 +0000
@@ -336,6 +336,7 @@
             property real bottomY: headerItem.y + headerItem.height
             animate: canvas.animate
             dividerColor: Qt.darker(background.headerColor, 1.1)
+            panelColor: Qt.lighter(background.headerColor, 1.1)
 
             title: internal.activePage ? internal.activePage.title : ""
             flickable: internal.activePage ? internal.activePage.flickable : null

=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/BubbleShape.qml'
--- modules/Ubuntu/Components/Themes/Ambiance/BubbleShape.qml	2014-08-26 14:12:52 +0000
+++ modules/Ubuntu/Components/Themes/Ambiance/BubbleShape.qml	2014-11-03 20:32:09 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2013 Canonical Ltd.
+ * Copyright 2013-2014 Canonical Ltd.
  *
  * This program is free software; you can redistribute it and/or modify
  * it under the terms of the GNU Lesser General Public License as published by
@@ -20,16 +20,23 @@
 Item {
     id: bubbleShape
 
+    /*!
+      Do not use an UbuntuShape but a Rectangle as the background of the BubbleShape.
+     */
+    property bool square: false
+
+    /*!
+      The background color of the bubble.
+     */
+    property color color: square ? Theme.palette.normal.background : Theme.palette.normal.overlay
+
     property point target
     property string direction: "down"
     property bool clipContent: false
     default property alias children: content.children
-    property alias bubbleColor: colorRect.color
-    property alias bubbleOpacity: colorRect.opacity
     // FIXME: This should not be necessary. See
     // https://bugs.launchpad.net/ubuntu-ui-toolkit/+bug/1214978
     property alias arrowSource: arrow.source
-    property bool square: false
 
     implicitWidth: units.gu(10)
     implicitHeight: units.gu(8)
@@ -128,7 +135,7 @@
         Rectangle {
             id: colorRect
             anchors.fill: parent
-            color: square ? Theme.palette.normal.background : Theme.palette.normal.overlay
+            color: bubbleShape.color
             visible: bubbleShape.clipContent
         }
     }

=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/PageHeadStyle.qml'
--- modules/Ubuntu/Components/Themes/Ambiance/PageHeadStyle.qml	2014-10-31 14:46:33 +0000
+++ modules/Ubuntu/Components/Themes/Ambiance/PageHeadStyle.qml	2014-11-03 20:32:09 +0000
@@ -33,6 +33,11 @@
     textLeftMargin: units.gu(2)
     maximumNumberOfActions: 3
 
+    /*!
+      The background color of the tabs panel and the actions overflow panel.
+     */
+    property color panelBackgroundColor: styledItem.panelColor
+
     implicitHeight: headerStyle.contentHeight + divider.height
 
     // FIXME: Workaround to get sectionsRepeater.count in autopilot tests,
@@ -313,6 +318,14 @@
                         callerMargin: -units.gu(1) + units.dp(4)
                         contentWidth: units.gu(20)
 
+                        Binding {
+                            target: tabsPopover.__foreground.__styleInstance
+                            property: "color"
+                            value: headerStyle.panelBackgroundColor
+                            when: tabsPopover.__foreground &&
+                                  tabsPopover.__foreground.__styleInstance
+                        }
+
                         Column {
                             anchors {
                                 left: parent.left
@@ -488,6 +501,14 @@
                         callerMargin: -units.gu(1) + units.dp(4)
                         contentWidth: units.gu(20)
 
+                        Binding {
+                            target: actionsOverflowPopover.__foreground.__styleInstance
+                            property: "color"
+                            value: headerStyle.panelBackgroundColor
+                            when: actionsOverflowPopover.__foreground &&
+                                  actionsOverflowPopover.__foreground.__styleInstance
+                        }
+
                         // Ensure the popover closes when actions change and
                         // the list item below may be destroyed before its
                         // onClicked is executed. See bug

=== modified file 'tests/resources/header/header.qml'
--- tests/resources/header/header.qml	2014-10-22 21:33:48 +0000
+++ tests/resources/header/header.qml	2014-11-03 20:32:09 +0000
@@ -19,8 +19,8 @@
 
 MainView {
     id: mainView
-    width: units.gu(40)
-    height: units.gu(50)
+    width: units.gu(50)
+    height: units.gu(70)
     useDeprecatedToolbar: false
 
     PageStack {
@@ -32,6 +32,21 @@
             Tab {
                 title: "Colors"
                 page: Page {
+                    head.actions: [
+                        Action {
+                            iconName: "close"
+                            text: "one"
+                        },
+                        Action {
+                            iconName: "close"
+                            text: "two"
+                        },
+                        Action {
+                            iconName: "close"
+                            text: "three"
+                        }
+                    ]
+
                     Column {
                         height: childrenRect.height
                         width: parent.width - units.gu(8)