Update enterprise controls demos to version 1.1

Task-number: QTEE-482
Change-Id: I79f665de133cbe1c77962a8d93acdddd2e05fcc1
Reviewed-by: Samuli Piippo <samuli.piippo@digia.com>

20 files changed, 192 insertions, 109 deletions

diff --git a/basicsuite/enterprise-dashboard/DashboardGaugeStyle.qml b/basicsuite/enterprise-dashboard/DashboardGaugeStyle.qml
index 7958fca..632b63b 100644
--- a/basicsuite/enterprise-dashboard/DashboardGaugeStyle.qml
+++ b/basicsuite/enterprise-dashboard/DashboardGaugeStyle.qml
@@ -19,7 +19,7 @@
 ****************************************************************************/
 
 import QtQuick 2.0
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 CircularGaugeStyle {
     tickmarkInset: toPixels(0.04)
diff --git a/basicsuite/enterprise-dashboard/IconGaugeStyle.qml b/basicsuite/enterprise-dashboard/IconGaugeStyle.qml
index 0b24351..a04d0e9 100644
--- a/basicsuite/enterprise-dashboard/IconGaugeStyle.qml
+++ b/basicsuite/enterprise-dashboard/IconGaugeStyle.qml
@@ -19,7 +19,7 @@
 ****************************************************************************/
 
 import QtQuick 2.0
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 DashboardGaugeStyle {
     id: fuelGaugeStyle
diff --git a/basicsuite/enterprise-dashboard/TachometerStyle.qml b/basicsuite/enterprise-dashboard/TachometerStyle.qml
index c4649da..15a2601 100644
--- a/basicsuite/enterprise-dashboard/TachometerStyle.qml
+++ b/basicsuite/enterprise-dashboard/TachometerStyle.qml
@@ -19,7 +19,7 @@
 ****************************************************************************/
 
 import QtQuick 2.0
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 DashboardGaugeStyle {
     id: tachometerStyle
diff --git a/basicsuite/enterprise-dashboard/TurnIndicator.qml b/basicsuite/enterprise-dashboard/TurnIndicator.qml
index 9dd7d5f..22d0ea9 100644
--- a/basicsuite/enterprise-dashboard/TurnIndicator.qml
+++ b/basicsuite/enterprise-dashboard/TurnIndicator.qml
@@ -19,7 +19,7 @@
 ****************************************************************************/
 
 import QtQuick 2.0
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 Item {
     // This enum is actually keyboard-related, but it serves its purpose
diff --git a/basicsuite/enterprise-dashboard/fonts/DejaVuSans.ttf b/basicsuite/enterprise-dashboard/fonts/DejaVuSans.ttf
new file mode 100644
index 0000000..19ed0b4
--- /dev/null
+++ b/basicsuite/enterprise-dashboard/fonts/DejaVuSans.ttf
diff --git a/basicsuite/enterprise-dashboard/main.qml b/basicsuite/enterprise-dashboard/main.qml
index da5f296..7f8ee75 100644
--- a/basicsuite/enterprise-dashboard/main.qml
+++ b/basicsuite/enterprise-dashboard/main.qml
@@ -22,8 +22,8 @@ import QtQuick 2.0
 import QtQuick.Window 2.1
 import QtQuick.Controls 1.0
 import QtQuick.Controls.Styles 1.0
-import QtQuick.Enterprise.Controls 1.0
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls 1.1
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 Rectangle {
     id: root
diff --git a/basicsuite/enterprise-gallery/CircularGaugeDarkStyle.qml b/basicsuite/enterprise-gallery/CircularGaugeDarkStyle.qml
index fb85f86..0de1180 100644
--- a/basicsuite/enterprise-gallery/CircularGaugeDarkStyle.qml
+++ b/basicsuite/enterprise-gallery/CircularGaugeDarkStyle.qml
@@ -19,7 +19,7 @@
 ****************************************************************************/
 
 import QtQuick 2.0
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 CircularGaugeStyle {
     id: root
diff --git a/basicsuite/enterprise-gallery/CircularGaugeDefaultStyle.qml b/basicsuite/enterprise-gallery/CircularGaugeDefaultStyle.qml
index 7aec7b6..23b25c4 100644
--- a/basicsuite/enterprise-gallery/CircularGaugeDefaultStyle.qml
+++ b/basicsuite/enterprise-gallery/CircularGaugeDefaultStyle.qml
@@ -19,7 +19,7 @@
 ****************************************************************************/
 
 import QtQuick 2.0
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 CircularGaugeStyle {
     labelStepSize: 20
diff --git a/basicsuite/enterprise-gallery/CircularGaugeLightStyle.qml b/basicsuite/enterprise-gallery/CircularGaugeLightStyle.qml
index 7d00c1f..87afa7d 100644
--- a/basicsuite/enterprise-gallery/CircularGaugeLightStyle.qml
+++ b/basicsuite/enterprise-gallery/CircularGaugeLightStyle.qml
@@ -19,7 +19,7 @@
 ****************************************************************************/
 
 import QtQuick 2.0
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 CircularGaugeStyle {
     id: root
diff --git a/basicsuite/enterprise-gallery/CircularGaugeView.qml b/basicsuite/enterprise-gallery/CircularGaugeView.qml
index 92ee6c5..a24b980 100644
--- a/basicsuite/enterprise-gallery/CircularGaugeView.qml
+++ b/basicsuite/enterprise-gallery/CircularGaugeView.qml
@@ -20,7 +20,7 @@
 
 import QtQuick 2.0
 import QtQuick.Controls 1.0
-import QtQuick.Enterprise.Controls 1.0
+import QtQuick.Enterprise.Controls 1.1
 
 ControlView {
     id: controlView
@@ -66,8 +66,8 @@ ControlView {
         id: gauge
         minimumValue: customizerItem.minimumValue
         maximumValue: customizerItem.maximumValue
-        width: root.toPixels(0.65)
-        height: width
+        width: controlBounds.width
+        height: controlBounds.height
 
         value: accelerating ? maximumValue : 0
         style: styleMap[customizerItem.currentStylePath]
@@ -174,7 +174,7 @@ ControlView {
             minimumValue: 0
             value: 0
             maximumValue: 360
-            stepSize: labelStepSizeSlider.stepSize
+            stepSize: 1
         }
 
         CustomizerLabel {
@@ -184,9 +184,9 @@ ControlView {
         CustomizerSlider {
             id: maximumValueSlider
             minimumValue: 0
-            value: 220
+            value: 240
             maximumValue: 300
-            stepSize: labelStepSizeSlider.stepSize
+            stepSize: 1
         }
 
         CustomizerLabel {
diff --git a/basicsuite/enterprise-gallery/ControlLabel.qml b/basicsuite/enterprise-gallery/ControlLabel.qml
new file mode 100644
index 0000000..0335342
--- /dev/null
+++ b/basicsuite/enterprise-gallery/ControlLabel.qml
@@ -0,0 +1,28 @@
+/****************************************************************************
+**
+** Copyright (C) 2014 Digia Plc
+** All rights reserved.
+** For any questions to Digia, please use contact form at http://qt.digia.com
+**
+** This file is part of the QtQuick Enterprise Controls Add-on.
+**
+** $QT_BEGIN_LICENSE$
+** Licensees holding valid Qt Commercial licenses may use this file in
+** accordance with the Qt Commercial License Agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and Digia.
+**
+** If you have questions regarding the use of this file, please use
+** contact form at http://qt.digia.com
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Text {
+    font.pixelSize: Math.min(32, root.toPixels(0.045))
+    color: "#4e4e4e"
+    styleColor: "#ffffff"
+    style: Text.Raised
+}
diff --git a/basicsuite/enterprise-gallery/ControlViewToolbar.qml b/basicsuite/enterprise-gallery/ControlViewToolbar.qml
index 5aac041..f3dd07b 100644
--- a/basicsuite/enterprise-gallery/ControlViewToolbar.qml
+++ b/basicsuite/enterprise-gallery/ControlViewToolbar.qml
@@ -76,7 +76,6 @@ BlackButtonBackground {
         Image {
             source: "images/icon-settings.png"
             anchors.centerIn: parent
-            scale: -1
         }
     }
 }
diff --git a/basicsuite/enterprise-gallery/CustomizerLabel.qml b/basicsuite/enterprise-gallery/CustomizerLabel.qml
index c4cb69c..c85807c 100644
--- a/basicsuite/enterprise-gallery/CustomizerLabel.qml
+++ b/basicsuite/enterprise-gallery/CustomizerLabel.qml
@@ -21,7 +21,7 @@
 import QtQuick 2.0
 
 Text {
-    color: fontColor
+    color: darkBackground ? root.darkFontColor : root.lightFontColor
     font.pixelSize: root.toPixels(0.04)
     font.family: openSans.name
     anchors.horizontalCenter: parent.horizontalCenter
diff --git a/basicsuite/enterprise-gallery/CustomizerCheckBox.qml b/basicsuite/enterprise-gallery/CustomizerSwitch.qml
index 542e09a..3048aae 100644
--- a/basicsuite/enterprise-gallery/CustomizerCheckBox.qml
+++ b/basicsuite/enterprise-gallery/CustomizerSwitch.qml
@@ -19,27 +19,8 @@
 ****************************************************************************/
 
 import QtQuick 2.0
-import QtQuick.Controls 1.0
-import QtQuick.Controls.Styles 1.0
+import QtQuick.Controls 1.1
 
-CheckBox {
-    id: checkBox
+Switch {
     anchors.horizontalCenter: parent.horizontalCenter
-    width: root.width * 0.04
-    height: width
-
-    style: CheckBoxStyle {
-        indicator: Rectangle {
-            color: "#666"
-            height: control.height
-            width: height
-
-            Rectangle {
-                anchors.fill: parent
-                anchors.margins: Math.round(checkBox.width * 0.1)
-                color: "#111"
-                visible: control.checked
-            }
-        }
-    }
 }
diff --git a/basicsuite/enterprise-gallery/PieMenuControlView.qml b/basicsuite/enterprise-gallery/PieMenuControlView.qml
index cba341b..2c06176 100644
--- a/basicsuite/enterprise-gallery/PieMenuControlView.qml
+++ b/basicsuite/enterprise-gallery/PieMenuControlView.qml
@@ -21,7 +21,7 @@
 import QtQuick 2.0
 import QtGraphicalEffects 1.0
 import QtQuick.Controls 1.0
-import QtQuick.Enterprise.Controls 1.0
+import QtQuick.Enterprise.Controls 1.1
 
 Rectangle {
     id: view
@@ -94,34 +94,7 @@ Rectangle {
             anchors.fill: parent
 
             onClicked: {
-                pieMenu.popup(touchArea.mouseX, touchArea.mouseY)
-            }
-        }
-
-        Item {
-            width: labelText.width
-            height: labelText.height
-            anchors.bottom: pieMenu.top
-            anchors.bottomMargin: 10
-            anchors.horizontalCenter: pieMenu.horizontalCenter
-            visible: pieMenu.visible
-
-            Item {
-                id: labelBlurGuard
-                anchors.centerIn: parent
-                width: labelText.implicitWidth * 2
-                height: labelText.implicitHeight * 2
-
-                Text {
-                    id: labelText
-                    font.pointSize: 20
-                    text: pieMenu.currentIndex !== -1 ? pieMenu.menuItems[pieMenu.currentIndex].text : ""
-                    horizontalAlignment: Text.AlignHCenter
-                    verticalAlignment: Text.AlignVCenter
-                    anchors.centerIn: parent
-                    color: "#ccc"
-                    antialiasing: true
-                }
+                pieMenu.popup(touchArea.mouseX, touchArea.mouseY);
             }
         }
 
diff --git a/basicsuite/enterprise-gallery/PieMenuDarkStyle.qml b/basicsuite/enterprise-gallery/PieMenuDarkStyle.qml
index 354775d..ab03701 100644
--- a/basicsuite/enterprise-gallery/PieMenuDarkStyle.qml
+++ b/basicsuite/enterprise-gallery/PieMenuDarkStyle.qml
@@ -18,7 +18,7 @@
 **
 ****************************************************************************/
 
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 PieMenuStyle {
     backgroundColor: "#222"
diff --git a/basicsuite/enterprise-gallery/PieMenuDefaultStyle.qml b/basicsuite/enterprise-gallery/PieMenuDefaultStyle.qml
index 1ad8480..4b0edb1 100644
--- a/basicsuite/enterprise-gallery/PieMenuDefaultStyle.qml
+++ b/basicsuite/enterprise-gallery/PieMenuDefaultStyle.qml
@@ -18,7 +18,7 @@
 **
 ****************************************************************************/
 
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 PieMenuStyle {
 }
diff --git a/basicsuite/enterprise-gallery/StylePicker.qml b/basicsuite/enterprise-gallery/StylePicker.qml
index 48c1298..f4e097e 100644
--- a/basicsuite/enterprise-gallery/StylePicker.qml
+++ b/basicsuite/enterprise-gallery/StylePicker.qml
@@ -21,8 +21,8 @@
 import QtQuick 2.0
 import QtQuick.Controls 1.0
 import QtQuick.Controls.Styles 1.0
-import QtQuick.Enterprise.Controls 1.0
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls 1.1
+import QtQuick.Enterprise.Controls.Styles 1.1
 
 ListView {
     id: stylePicker
diff --git a/basicsuite/enterprise-gallery/main.qml b/basicsuite/enterprise-gallery/main.qml
index f1f2e17..de60f47 100644
--- a/basicsuite/enterprise-gallery/main.qml
+++ b/basicsuite/enterprise-gallery/main.qml
@@ -24,12 +24,14 @@ import QtQuick.Controls 1.0
 import QtQuick.Controls.Styles 1.0
 import QtQuick.Controls.Private 1.0
 import QtQuick.Dialogs 1.0
-import QtQuick.Enterprise.Controls 1.0
-import QtQuick.Enterprise.Controls.Styles 1.0
+import QtQuick.Enterprise.Controls 1.1
+import QtQuick.Enterprise.Controls.Styles 1.1
+import QtQuick.Layouts 1.0
 import QtQuick.Window 2.1
 
 Rectangle {
     id: root
+    objectName: "window"
     visible: true
     width: 480
     height: 800
@@ -42,8 +44,9 @@ Rectangle {
     }
 
     property bool isScreenPortrait: height > width
-    property color fontColor: "white"
-    readonly property color lightBackgroundColor: "#ccc"
+    property color lightFontColor: "#222"
+    property color darkFontColor: "#e7e7e7"
+    readonly property color lightBackgroundColor: "#cccccc"
     readonly property color darkBackgroundColor: "#161616"
     property real customizerPropertySpacing: 10
     property real colorPickerRowSpacing: 8
@@ -53,34 +56,69 @@ Rectangle {
     property Component dial: ControlView {
         darkBackground: false
 
-        control: Dial {
-            id: dial
-            width: root.toPixels(0.3)
-            height: width
+        control: Column {
+            id: dialColumn
+            width: controlBounds.width
+            height: controlBounds.height - spacing
+            spacing: root.toPixels(0.05)
+
+            Column {
+                id: volumeColumn
+                width: parent.width
+                height: (dialColumn.height - dialColumn.spacing) / 2
+                spacing: height * 0.025
+
+                Dial {
+                    id: volumeDial
+                    width: parent.width
+                    height: volumeColumn.height - volumeText.height - volumeColumn.spacing
+
+                    /*!
+                        Determines whether the dial animates its rotation to the new value when
+                        a single click or touch is received on the dial.
+                    */
+                    property bool animate: customizerItem.animate
+
+                    Behavior on value {
+                        enabled: volumeDial.animate && !volumeDial.pressed
+                        NumberAnimation {
+                            duration: 300
+                            easing.type: Easing.OutSine
+                        }
+                    }
+                }
 
-            /*!
-                Determines whether the dial animates its rotation to the new value when
-                a single click or touch is received on the dial.
-            */
-            property bool animate: customizerItem.animate
-
-            Behavior on value {
-                enabled: dial.animate && !dial.pressed
-                NumberAnimation {
-                    duration: 300
-                    easing.type: Easing.OutSine
+                ControlLabel {
+                    id: volumeText
+                    text: "Volume"
+                    anchors.horizontalCenter: parent.horizontalCenter
                 }
             }
 
-            Text {
-                text: "Volume"
-                anchors.horizontalCenter: parent.horizontalCenter
-                anchors.top: dial.bottom
-                anchors.topMargin: 10
-                font.pixelSize: root.toPixels(0.045)
-                color: "#4e4e4e"
-                styleColor: "#ffffff"
-                style: Text.Raised
+            Column {
+                id: trebleColumn
+                width: parent.width
+                height: (dialColumn.height - dialColumn.spacing) / 2
+                spacing: height * 0.025
+
+                Dial {
+                    id: dial2
+                    width: parent.width
+                    height: trebleColumn.height - trebleText.height - trebleColumn.spacing
+
+                    stepSize: 1
+                    maximumValue: 10
+
+                    style: DialStyle {
+                        labelInset: outerRadius * 0
+                    }
+                }
+
+                ControlLabel {
+                    id: trebleText
+                    text: "Treble"
+                    anchors.horizontalCenter: parent.horizontalCenter
+                }
             }
         }
 
@@ -91,10 +129,9 @@ Rectangle {
 
             CustomizerLabel {
                 text: "Animate"
-                color: "black"
             }
 
-            CustomizerCheckBox {
+            CustomizerSwitch {
                 id: animateCheckBox
             }
         }
@@ -115,8 +152,8 @@ Rectangle {
         id: gaugeView
         control: Gauge {
             id: gauge
-            width: orientation === Qt.Vertical ? root.toPixels(0.15) : gaugeView.controlBounds.width * 0.65
-            height: orientation === Qt.Vertical ? root.toPixels(0.65) : gaugeView.controlBounds.height * 0.15
+            width: orientation === Qt.Vertical ? gaugeView.controlBounds.height * 0.3 : gaugeView.controlBounds.width
+            height: orientation === Qt.Vertical ? gaugeView.controlBounds.height : gaugeView.controlBounds.height * 0.3
             anchors.centerIn: parent
 
             minimumValue: 0
@@ -150,7 +187,7 @@ Rectangle {
                 text: "Vertical orientation"
             }
 
-            CustomizerCheckBox {
+            CustomizerSwitch {
                 id: orientationCheckBox
                 checked: true
             }
@@ -159,7 +196,7 @@ Rectangle {
                 text: controlItem.orientation === Qt.Vertical ? "Left align" : "Top align"
             }
 
-            CustomizerCheckBox {
+            CustomizerSwitch {
                 id: alignCheckBox
                 checked: true
             }
@@ -179,6 +216,67 @@ Rectangle {
 
     property Component pieMenu: PieMenuControlView {}
 
+    property Component statusIndicator: ControlView {
+        id: statusIndicatorView
+        darkBackground: false
+
+        Timer {
+            id: recordingFlashTimer
+            running: true
+            repeat: true
+            interval: 1000
+        }
+
+        ColumnLayout {
+            id: indicatorLayout
+            width: statusIndicatorView.controlBounds.width * 0.25
+            height: statusIndicatorView.controlBounds.height * 0.75
+            anchors.centerIn: parent
+
+            Repeater {
+                model: ListModel {
+                    id: indicatorModel
+                    ListElement {
+                        name: "Power"
+                        indicatorColor: "green"
+                    }
+                    ListElement {
+                        name: "Recording"
+                        indicatorColor: "red"
+                    }
+                }
+
+                ColumnLayout {
+                    Layout.preferredWidth: indicatorLayout.width
+//                    Layout.preferredHeight: indicatorLayout.height * 0.25
+                    spacing: 0
+
+                    StatusIndicator {
+                        id: indicator
+                        color: indicatorColor
+                        Layout.preferredWidth: statusIndicatorView.controlBounds.width * 0.07
+                        Layout.preferredHeight: Layout.preferredWidth
+                        Layout.alignment: Qt.AlignHCenter
+                        on: true
+
+                        Connections {
+                            target: recordingFlashTimer
+                            onTriggered: if (name == "Recording") indicator.on = !indicator.on
+                        }
+                    }
+                    ControlLabel {
+                        id: indicatorLabel
+                        text: name
+//                        elide: Text.ElideRight
+                        Layout.alignment: Qt.AlignHCenter
+                        Layout.maximumWidth: parent.width
+                        horizontalAlignment: Text.AlignHCenter
+                    }
+                }
+            }
+        }
+    }
+
     FontLoader {
         id: openSans
         Component.onCompleted: {
@@ -196,6 +294,7 @@ Rectangle {
         "Dial": dial,
         "Gauge": gauge,
         "PieMenu": pieMenu,
+        "StatusIndicator": statusIndicator,
         "ToggleButton": toggleButton
     }
 
@@ -217,9 +316,12 @@ Rectangle {
                 ListElement {
                     title: "Gauge"
                 }
-                //ListElement {
-                //    title: "PieMenu"
-                //}
+//                ListElement {
+//                    title: "PieMenu"
+//                }
+                ListElement {
+                    title: "StatusIndicator"
+                }
                 ListElement {
                     title: "ToggleButton"
                 }
@@ -238,7 +340,7 @@ Rectangle {
                 }
 
                 style: BlackButtonStyle {
-                    fontColor: root.fontColor
+                    fontColor: root.darkFontColor
                 }
 
                 onClicked: {
diff --git a/basicsuite/enterprise-gallery/preview_l.jpg b/basicsuite/enterprise-gallery/preview_l.jpg
index 8ddcad8..644bac5 100644
--- a/basicsuite/enterprise-gallery/preview_l.jpg
+++ b/basicsuite/enterprise-gallery/preview_l.jpg