ModelTweaker: blender value slider

At Danny's request to make it more "blender-like" :)

Change-Id: I6cd693047554b6da0b8ab1d88b513e415128ad9a
Reviewed-by: Sarah Jane Smith <sarah.j.smith@nokia.com>

3 files changed, 161 insertions, 18 deletions

diff --git a/util/qt3d/modeltweak/qml/BlenderToggle.qml b/util/qt3d/modeltweak/qml/BlenderToggle.qml
index 0af7d445..4b834112 100644
--- a/util/qt3d/modeltweak/qml/BlenderToggle.qml
+++ b/util/qt3d/modeltweak/qml/BlenderToggle.qml
@@ -3,6 +3,7 @@ import QtQuick 1.0
 Rectangle {
     anchors.topMargin: 8
     border.width: 1
+    border.color: "#191919"
     radius: 8
     height: 20
     color: "#999999"
diff --git a/util/qt3d/modeltweak/qml/BlenderValueSlider.qml b/util/qt3d/modeltweak/qml/BlenderValueSlider.qml
new file mode 100644
index 00000000..6e7bc5c0
--- /dev/null
+++ b/util/qt3d/modeltweak/qml/BlenderValueSlider.qml
@@ -0,0 +1,142 @@
+import QtQuick 1.0
+
+Item {
+    id: valueSlider
+
+    property string label: "";
+    property alias value: textInput.text;
+    property double delta: 0.1;
+    property double max: 1;
+    property double min: -1;
+    property bool limitMax: false;
+    property bool limitMin: false;
+
+    width: rect.width
+    height: 20
+
+    property int textWidth: 80
+
+    Rectangle {
+        id: rect
+        anchors.right: parent.right
+        radius: 8
+        border.width: 1
+        border.color: "#191919"
+        color: "#B4B4B4"
+        width: radius/2 + valueSlider.textWidth + plus.width + minus.width
+        height: parent.height
+
+
+        Text {
+            id: textLabel
+            color: "black"
+            width: textInput.width
+            height: textInput.height
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.verticalCenter: parent.verticalCenter
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
+            text: valueSlider.label + " " + textInput.text
+            visible: true
+        }
+
+        TextInput {
+            id: textInput
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.verticalCenter: parent.verticalCenter
+            horizontalAlignment: TextInput.AlignHCenter
+            width: valueSlider.textWidth
+            validator: DoubleValidator{}
+            onAccepted: {
+                parent.parent.update(text)
+                focus = false
+            }
+            visible: false
+            onFocusChanged: {
+                if(focus == false) {
+                    visible = false
+                    textLabel.visible = true
+                }
+                else {
+                    visible = true
+                    textLabel.visible = false
+                }
+            }
+        }
+        Image {
+            id: plus
+            source: "plus.png"
+            anchors.left: textInput.right
+            anchors.verticalCenter: parent.verticalCenter
+        }
+        Image {
+            id: minus
+            source: "minus.png"
+            anchors.right: textInput.left
+            anchors.verticalCenter: parent.verticalCenter
+        }
+        MouseArea {
+            id: mouseArea
+            anchors.fill: parent
+            onEntered: parent.color = "#999999"
+            onExited: parent.color = "#B4B4B4"
+            hoverEnabled: true
+            onClicked: {
+                if(mouse.x<width/3)
+                    decDelta();
+                else if(mouse.x>width/3*2)
+                    incDelta();
+                else {
+                    textLabel.visible = false;
+                    textInput.visible = true;
+                    textInput.focus = true;
+                    textInput.selectAll();
+                }
+
+            }
+            onPressed: parent.color = "#808080"
+            onReleased: parent.color = "#999999"
+        }
+    }
+
+    Timer {
+        interval: 100;
+        running: mouseArea.pressedButtons & Qt.LeftButton && (mouseArea.mouseX > valueSlider.width/3*2)
+        repeat: true
+        onTriggered: incDelta()
+    }
+
+    Timer {
+        interval: 100;
+        running: mouseArea.pressedButtons & Qt.LeftButton && (mouseArea.mouseX < valueSlider.width/3)
+        repeat: true
+        onTriggered: decDelta()
+    }
+
+    function updateMe() {
+        update(textInput.text)
+    }
+
+    function incDelta() {
+        var t = value*1 + delta;
+        if (limitMax)
+            update(t>max ? max : t);
+        else
+            update(t);
+        console.log("updated! " + t);
+
+    }
+
+    function decDelta() {
+        var t = value*1 - delta;
+        if (limitMin)
+            update(t<min ? min : t);
+        else
+            update(t);
+        console.log("updated! " + t);
+    }
+
+    Keys.onUpPressed: incDelta()
+    Keys.onDownPressed: decDelta()
+    Keys.onReturnPressed: updateMe()
+}
diff --git a/util/qt3d/modeltweak/qml/ConfigPane.qml b/util/qt3d/modeltweak/qml/ConfigPane.qml
index e5b24c37..81e46584 100644
--- a/util/qt3d/modeltweak/qml/ConfigPane.qml
+++ b/util/qt3d/modeltweak/qml/ConfigPane.qml
@@ -21,7 +21,7 @@ Row {
             width: parent.width
             horizontalAlignment: Text.AlignHCenter
         }
-        ValueField {
+        BlenderValueSlider {
             focus: true
             id: posX
             label: "X:"
@@ -29,25 +29,25 @@ Row {
             function update (f)  {
                 transformTranslate.translate = Qt.vector3d(f, transformTranslate.translate.y, transformTranslate.translate.z);
             }
-            Keys.onTabPressed:   { updateMe(); posY.focus = true; }
+            Keys.onTabPressed:   { updateMe(); focus = false; posY.focus = true; }
         }
-        ValueField {
+        BlenderValueSlider {
             id: posY
             label: "Y:"
             value: transformTranslate.translate.y.toFixed(3)
             function update (f)  {
                 transformTranslate.translate = Qt.vector3d(transformTranslate.translate.x, f, transformTranslate.translate.z);
             }
-            Keys.onTabPressed:   { updateMe(); posZ.focus = true; }
+            Keys.onTabPressed:   { updateMe(); focus = false; posZ.focus = true; }
         }
-        ValueField {
+        BlenderValueSlider {
             id: posZ
             label: "Z:"
             value: transformTranslate.translate.z.toFixed(3)
             function update (f)  {
                 transformTranslate.translate = Qt.vector3d(transformTranslate.translate.x, transformTranslate.translate.y, f);
             }
-            Keys.onTabPressed:   { updateMe(); rotX.focus = true; }
+            Keys.onTabPressed:   { updateMe(); focus = false; rotX.focus = true; }
         }
 
         // ROTATE
@@ -56,7 +56,7 @@ Row {
             color: "#FFFFFF"
             anchors.horizontalCenter: parent.horizontalCenter
         }
-        ValueField {
+        BlenderValueSlider {
             id: rotX
             label: "X:"
             delta: 1
@@ -64,9 +64,9 @@ Row {
             max: 360; limitMax: true
             value: transformRotateX.angle.toFixed(3)
             function update (f)  { transformRotateX.angle = f }
-            Keys.onTabPressed:   { updateMe(); rotY.focus = true; }
+            Keys.onTabPressed:   { updateMe(); focus = false; rotY.focus = true; }
         }
-        ValueField {
+        BlenderValueSlider {
             id: rotY
             label: "Y:"
             delta: 1
@@ -74,9 +74,9 @@ Row {
             max: 360; limitMax: true
             value: transformRotateY.angle.toFixed(3)
             function update (f)  { transformRotateY.angle = f }
-            Keys.onTabPressed:   { updateMe(); rotZ.focus = true; }
+            Keys.onTabPressed:   { updateMe(); focus = false; rotZ.focus = true; }
         }
-        ValueField {
+        BlenderValueSlider {
             id: rotZ
             label: "Z:"
             delta: 1
@@ -84,7 +84,7 @@ Row {
             max: 360; limitMax: true
             value: transformRotateZ.angle.toFixed(3)
             function update (f)  { transformRotateZ.angle = f }
-            Keys.onTabPressed:   { updateMe(); scaleX.focus = true; }
+            Keys.onTabPressed:   { updateMe(); focus = false; scaleX.focus = true; }
         }
 
         // SCALE
@@ -93,29 +93,29 @@ Row {
             color: "#FFFFFF"
             anchors.horizontalCenter: parent.horizontalCenter
         }
-        ValueField {
+        BlenderValueSlider {
             id: scaleX
             label: "X:"
             min: 0; limitMin: true
             value: transformScale.scale.x.toFixed(3)
             function update (f)  { transformScale.scale = Qt.vector3d(f, transformScale.scale.y, transformScale.scale.z); }
-            Keys.onTabPressed:   { updateMe(); scaleY.focus = true; }
+            Keys.onTabPressed:   { updateMe(); focus = false; scaleY.focus = true; }
         }
-        ValueField {
+        BlenderValueSlider {
             id: scaleY
             label: "Y:"
             min: 0; limitMin: true
             value: transformScale.scale.y.toFixed(3)
             function update (f)  { transformScale.scale = Qt.vector3d(transformScale.scale.x, f, transformScale.scale.z); }
-            Keys.onTabPressed:   { updateMe(); scaleZ.focus = true; }
+            Keys.onTabPressed:   { updateMe(); focus = false; scaleZ.focus = true; }
         }
-        ValueField {
+        BlenderValueSlider {
             id: scaleZ
             label: "Z:"
             min: 0; limitMin: true
             value: transformScale.scale.z.toFixed(3)
             function update (f)  { transformScale.scale = Qt.vector3d(transformScale.scale.x, transformScale.scale.y, f); }
-            Keys.onTabPressed:   { updateMe(); posX.focus = true; }
+            Keys.onTabPressed:   { updateMe(); focus = false; posX.focus = true; }
         }
 
     }