053b312 · unity8 · git.iko.soy

plugins/Dash/CardAttributes.qml+1

compare with xenial

unifiedsplit

@@ -50,6 +50,7 @@ GridLayout {

50 height: units.gu(2)

51 sets: ["actions", "status", "apps"]

52 source: "icon" in modelData && modelData["icon"] || ""

53+ color: grid.color

53 }

54 }

54 Label {

55 Label {

55 id: label

56 id: label

plugins/Dash/CardCreator.js+8−7

@@ -29,7 +29,7 @@ var kBackgroundLoaderCode = 'Loader {\n\

29 gradientColor: getColor(1) || color; \n\

30 anchors.fill: parent; \n\

31 image: backgroundImage.source ? backgroundImage : null; \n\

32− property real luminance: 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b; \n\

32+ property real luminance: Style.luminance(color); \n\

33 property Image backgroundImage: Image { \n\

34 objectName: "backgroundImage"; \n\

35 source: { \n\

@@ -108,7 +108,7 @@ var kOverlayLoaderCode = 'Loader { \n\

108 sourceComponent: ShaderEffect { \n\

109 id: overlay; \n\

110 height: (fixedHeaderHeight > 0 ? fixedHeaderHeight : headerHeight) + units.gu(2); \n\

111− property real luminance: 0.2126 * overlayColor.r + 0.7152 * overlayColor.g + 0.0722 * overlayColor.b; \n\

111+ property real luminance: Style.luminance(overlayColor); \n\

112 property color overlayColor: cardData && cardData["overlayColor"] || "#99000000"; \n\

113 property var source: ShaderEffectSource { \n\

114 id: shaderSource; \n\

@@ -440,20 +440,20 @@ function cardString(template, components) {

440 mascotCode = kMascotImageCode.arg(mascotAnchors).arg(mascotImageVisible);

441 }

442

443− var summaryColorWithBackground = 'backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey")';

443+ var summaryColorWithBackground = 'backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white")';

444

445 var hasTitleContainer = hasTitle && (hasEmblem || (hasMascot && (hasSubtitle || hasAttributes)));

446 var titleSubtitleCode = '';

447 if (hasTitle) {

448 var titleColor;

449 if (headerAsOverlay) {

450− titleColor = 'overlayLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey")';

450+ titleColor = 'root.scopeStyle ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white")';

451 } else if (hasSummary) {

452 titleColor = 'summary.color';

453 } else if (hasBackground) {

454 titleColor = summaryColorWithBackground;

455 } else {

456− titleColor = 'root.scopeStyle ? root.scopeStyle.foreground : "grey"';

456+ titleColor = 'root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText';

457 }

458

459 var titleAnchors;

@@ -605,7 +605,7 @@ function cardString(template, components) {

605 if (hasBackground) {

606 summaryColor = summaryColorWithBackground;

607 } else {

608− summaryColor = 'root.scopeStyle ? root.scopeStyle.foreground : "grey"';

608+ summaryColor = 'root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText';

609 }

610

611 var summaryTopMargin = (hasMascot || hasSubtitle || hasAttributes ? 'anchors.margins' : '0');

@@ -650,7 +650,8 @@ function cardString(template, components) {

650function createCardComponent(parent, template, components) {

651 var imports = 'import QtQuick 2.2; \n\

652 import Ubuntu.Components 1.1; \n\

653− import Dash 0.1;\n';

653+ import Dash 0.1;\n\

654+ import Utils 0.1;\n';

654 var card = cardString(template, components);

655 var card = cardString(template, components);

655 var code = imports + 'Component {\n' + card + '}\n';

656 var code = imports + 'Component {\n' + card + '}\n';

656

657

plugins/Dash/ScopeStyle.qml+38−40

@@ -15,6 +15,8 @@

15 */

16

17import QtQuick 2.2

18+import Utils 0.1

19+import Ubuntu.Components 1.1

18

20

19/*! \brief Helper for processing scope customization options.

21/*! \brief Helper for processing scope customization options.

20

22

@@ -27,69 +29,65 @@ QtObject {

27 /// Style object passed from the scope

29 /// Style object passed from the scope

28 property var style: Object()

30 property var style: Object()

29

31

30− /*! \brief Calculate luminance of the passed color

31−

32− \note If not fully opaque, luminance is dependant on blending.

33− */

34− function luminance(color) {

35− return 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b;

36− }

37−

38 /// Color used for text and symbolic icons

32 /// Color used for text and symbolic icons

39 readonly property color foreground: "foreground-color" in style ? style["foreground-color"] : d.defaultDark

33 readonly property color foreground: "foreground-color" in style ? style["foreground-color"] : d.defaultDark

40

34

41 /// Luminance of the foreground color

35 /// Luminance of the foreground color

42− readonly property real foregroundLuminance: foreground ? luminance(foreground) : d.defaultForegroundLuminance

36+ readonly property real foregroundLuminance: foreground ? Style.luminance(foreground) : Style.luminance(d.defaultDark)

43

37

44 /// Color used for the overall background

38 /// Color used for the overall background

45− readonly property color background: "background-color" in style ? style["background-color"] : "transparent"

39+ readonly property color background: "background-color" in style ? style["background-color"] : "#00f5f5f5"

46−

47− /// Luminance of the foreground color

48− readonly property real backgroundLuminance: background ? luminance(background) : d.defaultBackgroundLuminance

49−

50− /*! \brief Luminance threshold for switching between fore and background color

51−

52− \note If background colour is not fully opaque, the defaultLightLuminance it's taken into account instead of it.

53− */

54− readonly property real threshold: background.a !== 1.0 ? (foregroundLuminance + d.defaultLightLuminance) / 2

55− : (foregroundLuminance + backgroundLuminance) / 2

56−

57− /*! \brief The lighter of foreground and background colors

58−

59− \note If background color is not fully opaque, it's not taken into account

60− and defaults to the theme-provided light color.

61− */

62− readonly property color light: {

63− if (background.a !== 1.0) return foregroundLuminance > d.defaultLightLuminance ? foreground : d.defaultLight;

64− return foregroundLuminance > backgroundLuminance ? foreground : background;

65− }

66

40

67− /*! \brief The darker of foreground and background colors

41+ /// Luminance of the background color

42+ readonly property real backgroundLuminance: background ? Style.luminance(background) : Style.luminance(d.defaultLight)

68

43

44+ /*! \brief Get the most contrasting available color based on luminance

45+ *

69− \note If background color is not fully opaque, it's not taken into account

46+ * If background color is transparent, theme provided colors are taken into account

70− and defaults to the theme-provided dark color.

71 */

47 */

72− readonly property color dark: {

48+ function getTextColor(luminance) {

73− if (background.a !== 1.0) return foregroundLuminance < d.defaultDarkLuminance ? foreground : d.defaultDark;

49+ if (Math.abs(foregroundLuminance - luminance) >

74− return foregroundLuminance < backgroundLuminance ? foreground : background;

50+ Math.abs(d.opaqueBackgroundLuminance - luminance)) {

51+ return foreground;

52+ } else {

53+ return d.opaqueBackground;

54+ }

75 }

55 }

76

56

77 /// Source of the logo image for the header

57 /// Source of the logo image for the header

78 readonly property url headerLogo: "logo" in d.headerStyle ? d.headerStyle["logo"] : ""

58 readonly property url headerLogo: "logo" in d.headerStyle ? d.headerStyle["logo"] : ""

79

59

80 /// Background style for the header

60 /// Background style for the header

81− readonly property url headerBackground: "background" in d.headerStyle ? d.headerStyle["background"] : ""

61+ readonly property url headerBackground: "background" in d.headerStyle ? d.headerStyle["background"] : "color:///#f5f5f5"

82

62

83 /// Foreground color for the header

63 /// Foreground color for the header

84 readonly property color headerForeground: "foreground-color" in d.headerStyle ? d.headerStyle["foreground-color"] : foreground

64 readonly property color headerForeground: "foreground-color" in d.headerStyle ? d.headerStyle["foreground-color"] : foreground

85

65

66+ /// Color of the header divider

67+ readonly property color headerDividerColor: "divider-color" in d.headerStyle ? d.headerStyle["divider-color"] : "#e0e0e0"

68+

69+ /// Background style for the navigation

70+ readonly property url navigationBackground: "navigation-background" in d.headerStyle ? d.headerStyle["navigation-background"] : "color:///#f5f5f5"

71+

72+ /// Color of the primary preview button

73+ readonly property color previewButtonColor: "preview-button-color" in style ? style["preview-button-color"] : Theme.palette.selected.foreground

74+

86 //! @cond

75 //! @cond

87 property var d: QtObject {

76 property var d: QtObject {

88 // FIXME: should be taken from the theme

77 // FIXME: should be taken from the theme

89 readonly property color defaultLight: "white"

78 readonly property color defaultLight: "white"

90− readonly property color defaultDark: "grey"

79+ readonly property color defaultDark: UbuntuColors.darkGrey

91− readonly property real defaultLightLuminance: luminance(defaultLight)

80+ readonly property real defaultLightLuminance: Style.luminance(defaultLight)

92− readonly property real defaultDarkLuminance: luminance(defaultDark)

81+ readonly property real defaultDarkLuminance: Style.luminance(defaultDark)

82+

83+ readonly property color opaqueBackground: {

84+ background.a > 0 ?

85+ background :

86+ (Math.abs(foregroundLuminance - defaultLightLuminance) >

87+ Math.abs(foregroundLuminance - defaultDarkLuminance)) ?

88+ defaultLight : defaultDark

89+ }

90+ readonly property real opaqueBackgroundLuminance: Style.luminance(opaqueBackground)

93

91

94 readonly property var headerStyle: "page-header" in style ? style["page-header"] : { }

92 readonly property var headerStyle: "page-header" in style ? style["page-header"] : { }

95 }

93 }

plugins/Utils/Style.jsnew file+33

@@ -0,0 +1,33 @@

1+/*

3+ *

4+ * This program is free software; you can redistribute it and/or modify

5+ * it under the terms of the GNU General Public License as published by

6+ * the Free Software Foundation; version 3.

7+ *

8+ * This program is distributed in the hope that it will be useful,

9+ * but WITHOUT ANY WARRANTY; without even the implied warranty of

10+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the

11+ * GNU General Public License for more details.

12+ *

13+ * You should have received a copy of the GNU General Public License

14+ * along with this program. If not, see <http://www.gnu.org/licenses/>.

15+ */

16+

17+.pragma library

18+

19+/*! \brief Calculate average luminance of the passed colors

20+

21+ \note If not fully opaque, luminance is dependant on blending.

22+ */

23+function luminance() {

24+ var sum = 0;

25+ for (var k in arguments) {

26+ // only way to convert string to color

27+ var c = Qt.lighter(arguments[k], 1.0);

28+

29+ sum += 0.2126 * c.r + 0.7152 * c.g + 0.0722 * c.b;

30+ }

31+

32+ return sum / arguments.length;

33+}

plugins/Utils/qmldir+1

@@ -1,3 +1,4 @@

1module Utils

2plugin Utils-qml

3typeinfo Utils.qmltypes

4+Style 0.1 Style.js

qml/Components/Background.qml+6

@@ -15,6 +15,7 @@

15 */

16

17import QtQuick 2.0

18+import Utils 0.1 as Utils

18

19

19Loader {

20Loader {

20 id: root

21 id: root

@@ -23,6 +24,11 @@ Loader {

23 property url style

24 property url style

24 readonly property var parsedStyle: String(style)

25 readonly property var parsedStyle: String(style)

25 .match(/^(color|gradient):\/\/\/(?:(#(?:[0-9a-f]{3,4}){1,2}|[a-z]{3,}))(?:\/(#(?:[0-9a-f]{3,4}){1,2}|[a-z]{3,}))?\/?$/i)

26 .match(/^(color|gradient):\/\/\/(?:(#(?:[0-9a-f]{3,4}){1,2}|[a-z]{3,}))(?:\/(#(?:[0-9a-f]{3,4}){1,2}|[a-z]{3,}))?\/?$/i)

27+ readonly property var luminance: {

28+ if (!parsedStyle) return 0.5;

29+ if (parsedStyle[1] === "color") return Utils.Style.luminance(parsedStyle[2]);

30+ else if (parsedStyle[1] === "gradient") return Utils.Style.luminance(parsedStyle[2], parsedStyle[3]);

31+ }

26

32

27 sourceComponent: {

33 sourceComponent: {

28 if (style == "") return null;

34 if (style == "") return null;

qml/Components/graphics/PageHeaderBaseDivider@18.pngdeleted

Binary file not shown.

qml/Components/graphics/PageHeaderBaseDivider@18.scideleted−5

@@ -1,5 +0,0 @@

1−border.top: 4

2−border.bottom: 4

3−border.left: 0

4−border.right: 0

5−source: PageHeaderBaseDivider@18.png

qml/Dash/DashNavigation.qml+2−2

@@ -80,7 +80,7 @@ AbstractButton {

80 anchors.margins: units.gu(2)

81 verticalAlignment: Text.AlignVCenter

82 text: root.currentNavigation ? root.currentNavigation.label : ""

83− color: root.scopeStyle ? root.scopeStyle.foreground : "grey"

83+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText

84 }

85

86 Icon {

@@ -90,7 +90,7 @@ AbstractButton {

90 name: showList ? "up" : "down"

91 height: units.gu(2)

92 width: height

93− color: root.scopeStyle ? root.scopeStyle.foreground : "grey"

93+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText

94 }

95

96 // navigationListView is outside root

qml/Dash/DashNavigationList.qml+4−3

@@ -16,6 +16,7 @@

16

17import QtQuick 2.2

18import Ubuntu.Components 1.1

19+import "../Components"

19

20

20Item {

21Item {

21 id: root

22 id: root

@@ -27,11 +28,11 @@ Item {

27 signal allNavigationClicked()

28 signal allNavigationClicked()

28

29

29 readonly property int itemHeight: units.gu(5)

30 readonly property int itemHeight: units.gu(5)

30− readonly property color foregroundColor: root.scopeStyle ? root.scopeStyle.foreground : "grey"

31+ readonly property color foregroundColor: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText

31 implicitHeight: flickable.contentHeight

32 implicitHeight: flickable.contentHeight

32

33

33− Rectangle {

34+ Background {

34− color: !root.scopeStyle || Qt.colorEqual(root.scopeStyle.background, "transparent") ? "white" : root.scopeStyle.background

35+ style: root.scopeStyle ? root.scopeStyle.navigationBackground : "color://white"

35 anchors.fill: parent

36 anchors.fill: parent

36 }

37 }

37

38

qml/Dash/GenericScopeView.qml+2−2

@@ -365,7 +365,7 @@ FocusScope {

365 }

366 fontSize: "small"

367 font.weight: Font.Bold

368− color: scopeStyle ? scopeStyle.foreground : "grey"

368+ color: scopeStyle ? scopeStyle.foreground : Theme.palette.normal.baseText

369 visible: baseItem.expandable && !baseItem.headerLink

370 }

371 }

@@ -403,7 +403,7 @@ FocusScope {

403 width: categoryView.width

404 height: section != "" ? units.gu(5) : 0

405 text: section

406− color: scopeStyle ? scopeStyle.foreground : "grey"

406+ color: scopeStyle ? scopeStyle.foreground : Theme.palette.normal.baseText

407 iconName: delegate && delegate.headerLink ? "go-next" : ""

408 onClicked: {

409 if (delegate.headerLink) scopeView.scope.performQuery(delegate.headerLink);

qml/Components/PageHeader.qml → qml/Dash/PageHeader.qmlrenamed+50−24

@@ -19,7 +19,8 @@ import Ubuntu.Components 1.1

19import Ubuntu.Components.Themes.Ambiance 1.1

20import Ubuntu.Components.Popups 1.0

21import Ubuntu.Components.ListItems 1.0

22+import "../Components"

22−import "SearchHistoryModel"

23+import "../Components/SearchHistoryModel"

23

24

24Item {

25Item {

25 id: root

26 id: root

@@ -172,7 +173,7 @@ Item {

172 property var styledItem: searchHeader

173 property var styledItem: searchHeader

173 property string title

174 property string title

174 property var config: PageHeadConfiguration {

175 property var config: PageHeadConfiguration {

175− foregroundColor: root.scopeStyle ? root.scopeStyle.headerForeground : "grey"

176+ foregroundColor: root.scopeStyle ? root.scopeStyle.headerForeground : Theme.palette.normal.baseText

176 backAction: Action {

177 backAction: Action {

177 iconName: "back"

178 iconName: "back"

178 onTriggered: {

179 onTriggered: {

@@ -242,7 +243,7 @@ Item {

242 property var styledItem: header

243 property var styledItem: header

243 property string title: root.title

244 property string title: root.title

244 property var config: PageHeadConfiguration {

245 property var config: PageHeadConfiguration {

245− foregroundColor: root.scopeStyle ? root.scopeStyle.headerForeground : "grey"

246+ foregroundColor: root.scopeStyle ? root.scopeStyle.headerForeground : Theme.palette.normal.baseText

246 backAction: Action {

247 backAction: Action {

247 iconName: "back"

248 iconName: "back"

248 visible: root.showBackButton

249 visible: root.showBackButton

@@ -287,25 +288,6 @@ Item {

287 }

288 }

289 }

289

290

290− Row {

291− spacing: units.gu(.5)

292− Repeater {

293− objectName: "paginationRepeater"

294− model: root.paginationCount

295− Image {

296− objectName: "paginationDots_" + index

297− height: units.gu(1)

298− width: height

299− source: (index == root.paginationIndex) ? "graphics/pagination_dot_on.png" : "graphics/pagination_dot_off.png"

300− }

301− }

302− anchors {

303− top: headerContainer.bottom

304− horizontalCenter: headerContainer.horizontalCenter

305− topMargin: units.gu(.5)

306− }

307− }

308−

309 Component {

291 Component {

310 id: popoverComponent

292 id: popoverComponent

311 Popover {

293 Popover {

@@ -343,7 +325,7 @@ Item {

343 }

325 }

344 }

326 }

345

327

346− BorderImage {

328+ Rectangle {

347 id: bottomBorder

329 id: bottomBorder

348 anchors {

330 anchors {

349 top: headerContainer.bottom

331 top: headerContainer.bottom

@@ -352,7 +334,51 @@ Item {

352 bottom: bottomContainer.top

334 bottom: bottomContainer.top

353 }

335 }

354

336

355− source: "graphics/PageHeaderBaseDivider.sci"

337+ color: scopeStyle ? scopeStyle.headerDividerColor : "#e0e0e0"

338+

339+ Rectangle {

340+ anchors {

341+ top: parent.top

342+ left: parent.left

343+ right: parent.right

344+ }

345+ height: units.dp(1)

346+ color: Qt.darker(parent.color, 1.1)

347+ }

348+ }

349+

350+ Row {

351+ spacing: units.gu(.5)

352+ Repeater {

353+ objectName: "paginationRepeater"

354+ model: root.paginationCount

355+ Image {

356+ objectName: "paginationDots_" + index

357+ height: units.gu(1)

358+ width: height

359+ source: (index == root.paginationIndex) ? "graphics/pagination_dot_on.png" : "graphics/pagination_dot_off.png"

360+ }

361+ }

362+ anchors {

363+ top: headerContainer.bottom

364+ horizontalCenter: headerContainer.horizontalCenter

365+ topMargin: units.gu(.5)

366+ }

367+ }

368+

369+ // FIXME this doesn't work with solid scope backgrounds due to z-ordering

370+ Rectangle {

371+ visible: bottomBorder.visible

372+ anchors {

373+ top: bottomContainer.top

374+ left: parent.left

375+ right: parent.right

376+ }

377+ height: units.dp(1)

378+ opacity: 0.6

379+ color: scopeStyle ?

380+ Qt.lighter(Qt.rgba(scopeStyle.background.r, scopeStyle.background.g, scopeStyle.background.b, 1.0), 1.2) :

381+ "#CCFFFFFF"

356 }

382 }

357

383

358 Item {

384 Item {

qml/Dash/Previews/PreviewAudioPlayback.qml+3−3

@@ -139,7 +139,7 @@ PreviewWidget {

139 objectName: "trackTitleLabel"

140 anchors { top: parent.top; left: parent.left; right: parent.right }

141 opacity: 0.9

142− color: scopeStyle ? scopeStyle.foreground : "grey"

142+ color: scopeStyle ? scopeStyle.foreground : Theme.palette.normal.baseText

143 fontSize: "small"

144 horizontalAlignment: Text.AlignLeft

145 text: modelData["title"]

@@ -152,7 +152,7 @@ PreviewWidget {

152 anchors { top: trackTitleLabel.bottom; left: parent.left; right: parent.right }

153 visible: text !== ""

154 opacity: 0.9

155− color: scopeStyle ? scopeStyle.foreground : "grey"

155+ color: scopeStyle ? scopeStyle.foreground : Theme.palette.normal.baseText

156 font.weight: Font.Light

157 fontSize: "small"

158 horizontalAlignment: Text.AlignLeft

@@ -193,7 +193,7 @@ PreviewWidget {

193 anchors.verticalCenter: parent.verticalCenter

194 width: parent.column3Width

195 opacity: 0.9

196− color: scopeStyle ? scopeStyle.foreground : "grey"

196+ color: scopeStyle ? scopeStyle.foreground : Theme.palette.normal.baseText

197 fontSize: "small"

198 horizontalAlignment: Text.AlignRight

199 text: audio.lengthToString(modelData["length"])

qml/Dash/Previews/PreviewExpandable.qml+1−1

@@ -41,7 +41,7 @@ PreviewWidget {

41 right: expandButton.left

42 }

43 fontSize: "large"

44− color: root.scopeStyle ? root.scopeStyle.foreground : "grey"

44+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText

45 visible: text !== ""

46 opacity: .8

47 text: widgetData["title"] || ""

qml/Dash/Previews/PreviewHeader.qml+1−1

@@ -35,7 +35,7 @@ PreviewWidget {

35 readonly property url mascot: root.widgetData["mascot"] || ""

36 readonly property string title: root.widgetData["title"] || ""

37 readonly property string subtitle: root.widgetData["subtitle"] || ""

38− readonly property color fontColor: root.scopeStyle ? root.scopeStyle.foreground : "grey"

38+ readonly property color fontColor: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText

39

40 implicitHeight: row.height + row.margins * 2

41 width: parent.width

qml/Dash/Previews/PreviewRatingDisplay.qml+2−2

@@ -72,7 +72,7 @@ PreviewWidget {

72 id: authorLabel

73 objectName: "authorLabel"

74 anchors { left: parent.left; right: parent.right }

75− color: scopeStyle ? scopeStyle.foreground : "grey"

75+ color: scopeStyle ? scopeStyle.foreground : Theme.palette.normal.baseText

76 opacity: .8

77 text: modelData["author"] || ""

78 visible: text !== ""

@@ -83,7 +83,7 @@ PreviewWidget {

83 id: reviewLabel

84 objectName: "reviewLabel"

85 anchors { left: parent.left; right: parent.right }

86− color: scopeStyle ? scopeStyle.foreground : "grey"

86+ color: scopeStyle ? scopeStyle.foreground : Theme.palette.normal.baseText

87 opacity: .8

88 text: modelData["review"] || ""

89 visible: text !== ""

qml/Dash/Previews/PreviewRatingInput.qml+2−2

@@ -76,7 +76,7 @@ PreviewWidget {

76 verticalCenter: parent.verticalCenter

77 left: parent.left

78 }

79− color: root.scopeStyle ? root.scopeStyle.foreground : "grey"

79+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText

80 opacity: .8

81 text: widgetData["rating-label"] || i18n.tr("Rate this")

82 }

@@ -121,7 +121,7 @@ PreviewWidget {

121 left: parent.left

122 right: parent.right

123 }

124− color: root.scopeStyle ? root.scopeStyle.foreground : "grey"

124+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText

125 opacity: .8

126 text: widgetData["review-label"] || i18n.tr("Add a review")

127 }

qml/Dash/Previews/PreviewTextSummary.qml+2−2

@@ -39,7 +39,7 @@ PreviewWidget {

39 }

40 height: visible ? implicitHeight : 0

41 fontSize: "large"

42− color: root.scopeStyle ? root.scopeStyle.foreground : "grey"

42+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText

43 visible: text !== ""

44 opacity: .8

45 text: widgetData["title"] || ""

@@ -61,7 +61,7 @@ PreviewWidget {

61 clip: true

62 fontSize: "small"

63 lineHeight: 1.2

64− color: root.scopeStyle ? root.scopeStyle.foreground : "grey"

64+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText

65 opacity: .8

66 text: widgetData["text"]

67 wrapMode: Text.Wrap

qml/Dash/ScopesOverview.qml+7−2

@@ -148,7 +148,12 @@ Item {

148

149 ScopeStyle {

150 id: overviewScopeStyle

151+ style: { "foreground-color" : "white",

151− style: { "foreground-color" : "white", "background-color" : "transparent" }

152+ "background-color" : "transparent",

153+ "page-header": {

154+ "background": "color:///transparent"

155+ }

156+ }

152 }

157 }

153

158

154 DashBackground {

159 DashBackground {

@@ -400,7 +405,7 @@ Item {

400 border.color: "white"

405 border.color: "white"

401 border.width: units.dp(1)

406 border.width: units.dp(1)

402 radius: units.dp(10)

407 radius: units.dp(10)

403− color: parent.pressed ? "gray" : "transparent"

408+ color: parent.pressed ? Theme.palette.normal.baseText : "transparent"

404 }

409 }

405 Label {

410 Label {

406 id: label

411 id: label

qml/Components/graphics/pagination_dot_off@30.png → qml/Dash/graphics/pagination_dot_off@30.pngrenamed

Binary file not shown.

qml/Components/graphics/pagination_dot_on@30.png → qml/Dash/graphics/pagination_dot_on@30.pngrenamed

Binary file not shown.

qml/Hud/HudParametrizedActionsPage.qml+9−2

@@ -15,7 +15,8 @@

15 */

16

17import QtQuick 2.0

18−import Ubuntu.Components 0.1

18+import Ubuntu.Components 1.1

19+import Ubuntu.Components.Themes.Ambiance 1.1

19import "../Components"

20import "../Components"

20

21

21Item {

22Item {

@@ -89,12 +90,18 @@ Item {

89 anchors.left: parent.left

90 anchors.left: parent.left

90 anchors.right: parent.right

91 anchors.right: parent.right

91

92

92− PageHeader {

93+ PageHeadStyle {

93 id: header

94 id: header

94 anchors.top: parent.top

95 anchors.top: parent.top

95 anchors.left: parent.left

96 anchors.left: parent.left

96 anchors.right: parent.right

97 anchors.right: parent.right

97 anchors.topMargin: units.gu(1)

98 anchors.topMargin: units.gu(1)

99+ height: units.gu(6.5)

100+ contentHeight: height

101+ separatorSource: ""

102+ property var styledItem: header

103+ property string title

104+ property var config: PageHeadConfiguration { }

98 }

105 }

99 }

106 }

100 }

107 }

tests/mocks/Unity/fake_scope.cpp+3−1

@@ -226,7 +226,9 @@ QVariantMap Scope::customizations() const

226 m["page-header"] = h;

227 } else if (m_id == "MockScope5") {

228 h["background"] = "gradient:///lightgrey/grey";

229− h["logo"] = QUrl("../../../tests/qmltests/Components/tst_PageHeader/logo-ubuntu-orange.svg");

229+ h["logo"] = QUrl("../../../tests/qmltests/Dash/tst_PageHeader/logo-ubuntu-orange.svg");

230+ h["divider-color"] = "red";

231+ h["navigation-background"] = "color:///black";

230 m["page-header"] = h;

232 m["page-header"] = h;

231 }

233 }

232 return m;

234 return m;

tests/plugins/Dash/cardcreator/1.res+1−1

@@ -70,7 +70,7 @@ Label {

70 wrapMode: Text.Wrap;

71 maximumLineCount: 2;

72 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

73− color: root.scopeStyle ? root.scopeStyle.foreground : "grey";

73+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;

74 visible: showHeader ;

75 text: root.title;

76 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;

tests/plugins/Dash/cardcreator/2.res+3−3

@@ -26,7 +26,7 @@ Loader {

26 gradientColor: getColor(1) || color;

27 anchors.fill: parent;

28 image: backgroundImage.source ? backgroundImage : null;

29− property real luminance: 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b;

29+ property real luminance: Style.luminance(color);

30 property Image backgroundImage: Image {

31 objectName: "backgroundImage";

32 source: {

@@ -94,7 +94,7 @@ Image {

94 wrapMode: Text.Wrap;

95 maximumLineCount: 2;

96 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

97− color: backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey");

97+ color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");

98 visible: showHeader ;

99 text: root.title;

100 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;

@@ -112,7 +112,7 @@ Image {

112 elide: Text.ElideRight;

113 fontSize: "small";

114 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

115− color: backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey");

115+ color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");

116 visible: titleLabel.visible && titleLabel.text;

117 text: cardData && cardData["subtitle"] || "";

118 font.weight: Font.Light;

tests/plugins/Dash/cardcreator/3.res+2−2

@@ -70,7 +70,7 @@ Label {

70 wrapMode: Text.Wrap;

71 maximumLineCount: 2;

72 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

73− color: root.scopeStyle ? root.scopeStyle.foreground : "grey";

73+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;

74 visible: showHeader ;

75 text: root.title;

76 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;

@@ -88,7 +88,7 @@ Label {

88 elide: Text.ElideRight;

89 fontSize: "small";

90 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

91− color: root.scopeStyle ? root.scopeStyle.foreground : "grey";

91+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;

92 visible: titleLabel.visible && titleLabel.text;

93 text: cardData && cardData["subtitle"] || "";

94 font.weight: Font.Light;

tests/plugins/Dash/cardcreator/4.res+2−2

@@ -74,7 +74,7 @@ Label {

74 wrapMode: Text.Wrap;

75 maximumLineCount: 2;

76 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

77− color: root.scopeStyle ? root.scopeStyle.foreground : "grey";

77+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;

78 visible: showHeader ;

79 text: root.title;

80 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;

@@ -92,7 +92,7 @@ Label {

92 elide: Text.ElideRight;

93 fontSize: "small";

94 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

95− color: root.scopeStyle ? root.scopeStyle.foreground : "grey";

95+ color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;

96 visible: titleLabel.visible && titleLabel.text;

97 text: cardData && cardData["subtitle"] || "";

98 font.weight: Font.Light;

tests/plugins/Dash/cardcreator/5.res+3−3

@@ -69,7 +69,7 @@ Loader {

69 sourceComponent: ShaderEffect {

70 id: overlay;

71 height: (fixedHeaderHeight > 0 ? fixedHeaderHeight : headerHeight) + units.gu(2);

72− property real luminance: 0.2126 * overlayColor.r + 0.7152 * overlayColor.g + 0.0722 * overlayColor.b;

72+ property real luminance: Style.luminance(overlayColor);

73 property color overlayColor: cardData && cardData["overlayColor"] || "#99000000";

74 property var source: ShaderEffectSource {

75 id: shaderSource;

@@ -113,7 +113,7 @@ Label {

113 wrapMode: Text.Wrap;

114 maximumLineCount: 2;

115 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

116− color: overlayLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey");

116+ color: root.scopeStyle ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");

117 visible: showHeader && overlayLoader.active;

118 text: root.title;

119 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;

@@ -131,7 +131,7 @@ Label {

131 elide: Text.ElideRight;

132 fontSize: "small";

133 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

134− color: overlayLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey");

134+ color: root.scopeStyle ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");

135 visible: titleLabel.visible && titleLabel.text;

136 text: cardData && cardData["subtitle"] || "";

137 font.weight: Font.Light;

tests/plugins/Dash/cardcreator/6.res+4−4

@@ -26,7 +26,7 @@ Loader {

26 gradientColor: getColor(1) || color;

27 anchors.fill: parent;

28 image: backgroundImage.source ? backgroundImage : null;

29− property real luminance: 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b;

29+ property real luminance: Style.luminance(color);

30 property Image backgroundImage: Image {

31 objectName: "backgroundImage";

32 source: {

@@ -70,7 +70,7 @@ Item {

70 wrapMode: Text.Wrap;

71 maximumLineCount: 2;

72 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

73− color: backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey");

73+ color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");

74 visible: showHeader ;

75 text: root.title;

76 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;

@@ -88,7 +88,7 @@ Item {

88 elide: Text.ElideRight;

89 fontSize: "small";

90 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

91− color: backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey");

91+ color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");

92 visible: titleLabel.visible && titleLabel.text;

93 text: cardData && cardData["subtitle"] || "";

94 font.weight: Font.Light;

@@ -103,7 +103,7 @@ Item {

103 rightMargin: units.gu(1);

104 }

105 source: cardData && cardData["emblem"] || "";

106− color: backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey");

106+ color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");

107 width: height;

108 height: source != "" ? titleLabel.font.pixelSize : 0;

109 }

tests/plugins/Dash/cardcreator/7.res+4−4

@@ -26,7 +26,7 @@ Loader {

26 gradientColor: getColor(1) || color;

27 anchors.fill: parent;

28 image: backgroundImage.source ? backgroundImage : null;

29− property real luminance: 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b;

29+ property real luminance: Style.luminance(color);

30 property Image backgroundImage: Image {

31 objectName: "backgroundImage";

32 source: {

@@ -95,7 +95,7 @@ Image {

95 wrapMode: Text.Wrap;

96 maximumLineCount: 2;

97 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

98− color: backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey");

98+ color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");

99 visible: showHeader ;

100 text: root.title;

101 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;

@@ -113,7 +113,7 @@ Image {

113 elide: Text.ElideRight;

114 fontSize: "small";

115 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);

116− color: backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey");

116+ color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");

117 visible: titleLabel.visible && titleLabel.text;

118 text: cardData && cardData["subtitle"] || "";

119 font.weight: Font.Light;

@@ -127,7 +127,7 @@ Image {

127 rightMargin: units.gu(1);

128 top: subtitleLabel.bottom;

129 }

130− color: backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < (root.scopeStyle ? root.scopeStyle.threshold : 0.7) ? (root.scopeStyle ? root.scopeStyle.light : "white") : (root.scopeStyle ? root.scopeStyle.dark : "grey");

130+ color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");

131 model: cardData && cardData["attributes"];

132 }

133

tests/plugins/Dash/tst_ScopeStyle.qml+73−68

@@ -18,6 +18,7 @@ import QtQuick 2.2

18import QtTest 1.0

19import Dash 0.1

20import Ubuntu.Components 1.1

21+import Utils 0.1

21

22

22Rectangle {

23Rectangle {

23 width: units.gu(40)

24 width: units.gu(40)

@@ -35,39 +36,23 @@ Rectangle {

35 property color color

36 property color color

36 property var styles: [

37 property var styles: [

37 {},

38 {},

38− { "foreground-color": "red", "background-color": "black", "page-header": { "logo": "/foo/bar" } },

39+ { "foreground-color": "red", "background-color": "black", "page-header": { "logo": "/foo/bar" },

40+ "preview-button-color": "red"},

39− { "foreground-color": "green", "background-color": "white", "page-header": { "foreground-color": "black" } },

41+ { "foreground-color": "green", "background-color": "white",

42+ "page-header": { "foreground-color": "black",

43+ "divider-color": "blue" } },

40− { "foreground-color": "blue", "background-color": "darkgrey", "page-header": { "background": "gradient:///white/blue" } },

44+ { "foreground-color": "blue", "background-color": "darkgrey",

45+ "page-header": { "background": "gradient:///white/blue",

46+ "navigation-background": "gradient:///white/blue" } },

41 ]

47 ]

42

48

43 function cleanup() {

49 function cleanup() {

44 testCase.color = "transparent";

50 testCase.color = "transparent";

45 }

51 }

46

52

47− function test_luminance_data() {

48− return [

49− { tag: "#F00", luminance: 0.2126 },

50− { tag: "#0F0", luminance: 0.7152 },

51− { tag: "#00F", luminance: 0.0722 },

52− { tag: "white", luminance: 1.0 },

53− { tag: "black", luminance: 0.0 },

54− { tag: "lightgrey", luminance: 0.8275 },

55− { tag: "grey", luminance: 0.5020 },

56− { tag: "darkgrey", luminance: 0.6627 },

57− { tag: "red", luminance: 0.2126 },

58− { tag: "green", luminance: 0.3590 },

59− { tag: "blue", luminance: 0.0722 },

60− ];

61− }

62−

63− function test_luminance(data) {

64− testCase.color = data.tag;

65− compare(tool.luminance(testCase.color).toFixed(4), data.luminance.toFixed(4));

66− }

67−

68 function test_foreground_data() {

53 function test_foreground_data() {

69 return [

54 return [

70− { tag: "default", index: 0, foreground: "grey", luminance: 0.5020 },

55+ { tag: "default", index: 0, foreground: UbuntuColors.darkGrey, luminance: 0.3647 },

71 { tag: "red on black", index: 1, foreground: "red", luminance: 0.2126 },

56 { tag: "red on black", index: 1, foreground: "red", luminance: 0.2126 },

72 { tag: "green on white", index: 2, foreground: "green", luminance: 0.3590 },

57 { tag: "green on white", index: 2, foreground: "green", luminance: 0.3590 },

73 { tag: "blue on darkgrey", index: 3, foreground: "blue", luminance: 0.0722 },

58 { tag: "blue on darkgrey", index: 3, foreground: "blue", luminance: 0.0722 },

@@ -83,7 +68,7 @@ Rectangle {

83

68

84 function test_background_data() {

69 function test_background_data() {

85 return [

70 return [

86− { tag: "default", index: 0, background: "transparent" },

71+ { tag: "default", index: 0, background: "#00f5f5f5", luminance: 0.9608 },

87 { tag: "red on black", index: 1, background: "black", luminance: 0 },

72 { tag: "red on black", index: 1, background: "black", luminance: 0 },

88 { tag: "green on white", index: 2, background: "white", luminance: 1 },

73 { tag: "green on white", index: 2, background: "white", luminance: 1 },

89 { tag: "blue on darkgrey", index: 3, background: "darkgrey", luminance: 0.6627 },

74 { tag: "blue on darkgrey", index: 3, background: "darkgrey", luminance: 0.6627 },

@@ -94,53 +79,35 @@ Rectangle {

94 tool.style = testCase.styles[data.index];

79 tool.style = testCase.styles[data.index];

95 verify(Qt.colorEqual(tool.background, data.background),

80 verify(Qt.colorEqual(tool.background, data.background),

96 "Background color not equal: %1 != %2".arg(tool.background).arg(data.background));

81 "Background color not equal: %1 != %2".arg(tool.background).arg(data.background));

97− if (data.hasOwnProperty("luminance")) {

98− compare(tool.backgroundLuminance.toFixed(4), data.luminance.toFixed(4));

82+ compare(tool.backgroundLuminance.toFixed(4), data.luminance.toFixed(4));

99− }

100 }

83 }

101

84

102− function test_threshold_data() {

85+ function test_getTextColor_data() {

103 return [

86 return [

104− { tag: "default", index: 0, threshold: 0.7510 },

87+ { tag: "default on black", background: "black", index: 0, textColor: "white" },

105− { tag: "red on black", index: 1, threshold: 0.1063 },

88+ { tag: "default on lightgrey", background: "lightgrey", index: 0, textColor: UbuntuColors.darkGrey },

106− { tag: "green on white", index: 2, threshold: 0.6795 },

89+ { tag: "default on white", background: "white", index: 0, textColor: UbuntuColors.darkGrey },

107− { tag: "blue on darkgrey", index: 3, threshold: 0.3675 },

90+ { tag: "default on yellow", background: "yellow", index: 0, textColor: UbuntuColors.darkGrey },

91+ { tag: "red/black on black", background: "black", index: 1, textColor: "red" },

92+ { tag: "red/black on lightgrey", background: "lightgrey", index: 1, textColor: "black" },

93+ { tag: "red/black on white", background: "white", index: 1, textColor: "black" },

94+ { tag: "red/black on yellow", background: "yellow", index: 1, textColor: "black" },

95+ { tag: "green/white on black", background: "black", index: 2, textColor: "white" },

96+ { tag: "green/white on lightgrey", background: "lightgrey", index: 2, textColor: "green" },

97+ { tag: "green/white on white", background: "white", index: 2, textColor: "green" },

98+ { tag: "green/white on yellow", background: "yellow", index: 2, textColor: "green" },

99+ { tag: "blue/darkgrey on black", background: "black", index: 3, textColor: "darkgrey" },

100+ { tag: "blue/darkgrey on lightgrey", background: "lightgrey", index: 3, textColor: "blue" },

101+ { tag: "blue/darkgrey on white", background: "white", index: 3, textColor: "blue" },

102+ { tag: "blue/darkgrey on yellow", background: "yellow", index: 3, textColor: "blue" },

108 ];

103 ];

109 }

104 }

110

105

111− function test_threshold(data) {

106+ function test_getTextColor(data) {

112 tool.style = testCase.styles[data.index];

107 tool.style = testCase.styles[data.index];

113− compare(tool.threshold.toFixed(4), data.threshold.toFixed(4), "Luminance threshold was incorrect.");

108+ var textColor = tool.getTextColor(Style.luminance(data.background));

114− }

115−

116− function test_light_data() {

117− return [

118− { tag: "default", index: 0, light: "white" },

119− { tag: "red on black", index: 1, light: "red" },

120− { tag: "green on white", index: 2, light: "white" },

121− { tag: "blue on darkgrey", index: 3, light: "darkgrey" },

122− ];

123− }

124−

125− function test_light(data) {

126− tool.style = testCase.styles[data.index];

127− verify(Qt.colorEqual(tool.light, data.light),

128− "Light color not equal: %1 != %2".arg(tool.light).arg(data.light));

129− }

130−

131− function test_dark_data() {

132− return [

133− { tag: "default", index: 0, dark: "grey" },

134− { tag: "red on black", index: 1, dark: "black" },

135− { tag: "green on white", index: 2, dark: "green" },

136− { tag: "blue on darkgrey", index: 3, dark: "blue" },

137− ];

138− }

139−

140− function test_dark(data) {

141− tool.style = testCase.styles[data.index];

142− verify(Qt.colorEqual(tool.dark, data.dark),

109+ verify(Qt.colorEqual(textColor, data.textColor),

143− "Dark color not equal: %1 != %2".arg(tool.dark).arg(data.dark));

110+ "TextColor not equal: %1 != %2".arg(textColor).arg(data.textColor));

144 }

111 }

145

112

146 function test_headerLogo_data() {

113 function test_headerLogo_data() {

@@ -157,7 +124,7 @@ Rectangle {

157

124

158 function test_headerForeground_data() {

125 function test_headerForeground_data() {

159 return [

126 return [

160− { tag: "default", index: 0, headerForeground: "grey" },

127+ { tag: "default", index: 0, headerForeground: UbuntuColors.darkGrey },

161 { tag: "black", index: 2, headerForeground: "black" },

128 { tag: "black", index: 2, headerForeground: "black" },

162 ];

129 ];

163 }

130 }

@@ -170,7 +137,7 @@ Rectangle {

170

137

171 function test_headerBackground_data() {

138 function test_headerBackground_data() {

172 return [

139 return [

173− { tag: "default", index: 0, headerBackground: "" },

140+ { tag: "default", index: 0, headerBackground: "color:///#f5f5f5" },

174 { tag: "black", index: 3, headerBackground: "gradient:///white/blue" },

141 { tag: "black", index: 3, headerBackground: "gradient:///white/blue" },

175 ];

142 ];

176 }

143 }

@@ -179,5 +146,43 @@ Rectangle {

179 tool.style = testCase.styles[data.index];

146 tool.style = testCase.styles[data.index];

180 compare(tool.headerBackground, data.headerBackground, "Header background was incorrect.");

147 compare(tool.headerBackground, data.headerBackground, "Header background was incorrect.");

181 }

148 }

149+

150+ function test_headerDividerColor_data() {

151+ return [

152+ { tag: "default", index: 0, headerDividerColor: "#e0e0e0" },

153+ { tag: "blue", index: 2, headerDividerColor: "blue" },

154+ ];

155+ }

156+

157+ function test_headerDividerColor(data) {

158+ tool.style = testCase.styles[data.index];

159+ verify(Qt.colorEqual(tool.headerDividerColor, data.headerDividerColor),

160+ "Header divider color not equal: %1 != %2".arg(tool.headerDividerColor).arg(data.headerDividerColor));

161+ }

162+

163+ function test_navigationBackground_data() {

164+ return [

165+ { tag: "default", index: 0, navigationBackground: "color:///#f5f5f5" },

166+ { tag: "black", index: 3, navigationBackground: "gradient:///white/blue" },

167+ ];

168+ }

169+

170+ function test_navigationBackground(data) {

171+ tool.style = testCase.styles[data.index];

172+ compare(tool.navigationBackground, data.navigationBackground, "Navigation background was incorrect.");

173+ }

174+

175+ function test_previewButtonColor_data() {

176+ return [

177+ { tag: "default", index: 0, previewButtonColor: Theme.palette.selected.foreground },

178+ { tag: "red", index: 1, previewButtonColor: "red" },

179+ ];

180+ }

181+

182+ function test_previewButtonColor(data) {

183+ tool.style = testCase.styles[data.index];

184+ verify(Qt.colorEqual(tool.previewButtonColor, data.previewButtonColor),

185+ "Preview button color not equal: %1 != %2".arg(tool.previewButtonColor).arg(data.previewButtonColor));

186+ }

182 }

187 }

183}

188}

tests/plugins/Utils/CMakeLists.txt+5

@@ -27,3 +27,8 @@ run_tests(

27 qsortfilterproxymodeltest

28 timeformattertest

29 )

30+

31+# plain qml test

32+set(qmltest_DEFAULT_TARGETS qmltests)

33+set(qmltest_DEFAULT_PROPERTIES ENVIRONMENT "QT_QPA_PLATFORM=minimal")

34+add_qml_test(. UtilsStyle IMPORT_PATHS ${CMAKE_BINARY_DIR}/plugins)

tests/plugins/Utils/tst_UtilsStyle.qmlnew file+47

@@ -0,0 +1,47 @@

1+/*

3+ *

4+ * This program is free software; you can redistribute it and/or modify

5+ * it under the terms of the GNU General Public License as published by

6+ * the Free Software Foundation; version 3.

7+ *

8+ * This program is distributed in the hope that it will be useful,

9+ * but WITHOUT ANY WARRANTY; without even the implied warranty of

10+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the

11+ * GNU General Public License for more details.

12+ *

13+ * You should have received a copy of the GNU General Public License

14+ * along with this program. If not, see <http://www.gnu.org/licenses/>.

15+ */

16+

17+import QtQuick 2.2

18+import QtTest 1.0

19+import Utils 0.1

20+

21+TestCase {

22+ id: testCase

23+ name: "UtilsStyle"

24+

25+ property color color

26+

27+ function test_luminance_data() {

28+ return [

29+ { tag: "#F00", luminance: 0.2126 },

30+ { tag: "#0F0", luminance: 0.7152 },

31+ { tag: "#00F", luminance: 0.0722 },

32+ { tag: "white", luminance: 1.0 },

33+ { tag: "black", luminance: 0.0 },

34+ { tag: "lightgrey", luminance: 0.8275 },

35+ { tag: "grey", luminance: 0.5020 },

36+ { tag: "darkgrey", luminance: 0.6627 },

37+ { tag: "red", luminance: 0.2126 },

38+ { tag: "green", luminance: 0.3590 },

39+ { tag: "blue", luminance: 0.0722 },

40+ ];

41+ }

42+

43+ function test_luminance(data) {

44+ testCase.color = data.tag;

45+ compare(Style.luminance(testCase.color).toFixed(4), data.luminance.toFixed(4));

46+ }

47+}

tests/qmltests/CMakeLists.txt+1−1

@@ -31,7 +31,6 @@ add_qml_test(Components ResponsiveFlowView)

31add_qml_test(Components ResponsiveGridView)

32add_qml_test(Components ResponsiveVerticalJournal IMPORT_PATHS ${qmltest_DEFAULT_IMPORT_PATHS} ${CMAKE_BINARY_DIR}/plugins)

33add_qml_test(Components Showable)

34−add_qml_test(Components PageHeader)

35add_qml_test(Components ZoomableImage)

34add_qml_test(Components ZoomableImage)

36add_qml_test(Dash Dash)

35add_qml_test(Dash Dash)

37add_qml_test(Dash DashContent)

36add_qml_test(Dash DashContent)

@@ -39,6 +38,7 @@ add_qml_test(Dash Card)

39add_qml_benchmark(Dash CardBenchmark 1000)

38add_qml_benchmark(Dash CardBenchmark 1000)

40add_qml_test(Dash CardTool)

39add_qml_test(Dash CardTool)

41add_qml_test(Dash GenericScopeView)

40add_qml_test(Dash GenericScopeView)

41+add_qml_test(Dash PageHeader)

42add_qml_test(Dash PreviewListView)

43add_qml_test(Dash/Previews Preview)

44add_qml_test(Dash/Previews PreviewActions)

tests/qmltests/Components/tst_Background.qml+5−4

@@ -46,10 +46,10 @@ Rectangle {

46

47 function test_style_data() {

48 return [

49− { tag: "empty", style: "" },

49+ { tag: "empty", style: "", luminance: 0.5 },

50− { tag: "solid", style: "color:///black" },

50+ { tag: "solid", style: "color:///black", luminance: 0 },

51− { tag: "gradient", style: "gradient:///black/red" },

51+ { tag: "gradient", style: "gradient:///black/red", luminance: 0.1063 },

52− { tag: "image", style: "/some/path" },

52+ { tag: "image", style: "/some/path", luminance: 0.5 },

53 ];

54 }

55

@@ -58,6 +58,7 @@ Rectangle {

58 expectFail("empty", "Empty style should not create a background.");

59 loadedSpy.wait();

60 compare(background.item.objectName, data.tag, "Background should be %1".arg(data.style));

61+ compare(background.luminance, data.luminance);

61 }

62 }

62

63

63 function test_solid() {

64 function test_solid() {

tests/qmltests/Components/tst_LazyImage.qml+1−1

@@ -32,7 +32,7 @@ Rectangle {

32 rightMargin: 2 * parent.width / 3

33 }

34

35− color: "grey"

35+ color: Theme.palette.normal.baseText

36

37 Column {

38 anchors { fill: parent; margins: units.gu(5) }

tests/qmltests/Dash/tst_Card.qml+1−1

@@ -452,7 +452,7 @@ Rectangle {

452

453 background.color = data.tag;

454

455− var fontColor = data.dark ? "grey" : "white";

455+ var fontColor = data.dark ? Theme.palette.normal.baseText : "white";

456

457 tryCompareFunction(function() { return Qt.colorEqual(summary.color, fontColor); }, true);

458 tryCompareFunction(function() { return Qt.colorEqual(title.color, fontColor); }, true);

tests/qmltests/Dash/tst_GenericScopeView.qml+4−4

@@ -333,10 +333,10 @@ Item {

333

334 function test_header_style_data() {

335 return [

336− { tag: "Default", index: 0, foreground: "grey", background: "", logo: "" },

336+ { tag: "Default", index: 0, foreground: Theme.palette.normal.baseText, background: "color:///#f5f5f5", logo: "" },

337− { tag: "Foreground", index: 1, foreground: "yellow", background: "", logo: "" },

337+ { tag: "Foreground", index: 1, foreground: "yellow", background: "color:///#f5f5f5", logo: "" },

338− { tag: "Logo+Background", index: 2, foreground: "grey", background: "gradient:///lightgrey/grey",

338+ { tag: "Logo+Background", index: 2, foreground: Theme.palette.normal.baseText, background: "gradient:///lightgrey/grey",

339− logo: Qt.resolvedUrl("../Components/tst_PageHeader/logo-ubuntu-orange.svg") },

339+ logo: Qt.resolvedUrl("../Dash/tst_PageHeader/logo-ubuntu-orange.svg") },

340 ];

341 }

342

tests/qmltests/Components/tst_PageHeader.qml → tests/qmltests/Dash/tst_PageHeader.qmlrenamed+2−2

@@ -17,7 +17,7 @@

17import QtQuick 2.0

18import QtTest 1.0

19import ".."

20−import "../../../qml/Components"

20+import "../../../qml/Dash"

21import Ubuntu.Components 0.1

22import Unity 0.2

23import Unity.Test 0.1 as UT

@@ -242,7 +242,7 @@ Item {

242 searchEntryEnabled: true

243 title: "%^$%^%^&%^&%^$%GHR%"

244 scopeStyle: QtObject {

245− readonly property color foreground: "grey"

245+ readonly property color foreground: Theme.palette.normal.baseText

246 readonly property url headerLogo: showImageCheckBox.checked ? pageHeader.titleImageSource : ""

247 }

248 showBackButton: showBackButtonCheckBox.checked

tests/qmltests/Components/tst_PageHeader/logo-ubuntu-orange.svg → tests/qmltests/Dash/tst_PageHeader/logo-ubuntu-orange.svgrenamed

The content is the same.