ModelTweak: Refactored ConfigPane into ButtonBar and ModelProperties

Also added a little lock png as well for locking the 3 rotations.

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

5 files changed, 255 insertions, 225 deletions

diff --git a/util/qt3d/modeltweak/qml/ButtonBarPane.qml b/util/qt3d/modeltweak/qml/ButtonBarPane.qml
new file mode 100644
index 00000000..b59874a9
--- /dev/null
+++ b/util/qt3d/modeltweak/qml/ButtonBarPane.qml
@@ -0,0 +1,94 @@
+import QtQuick 1.0
+import Qt3D 1.0
+import ModelTweak 1.0
+
+Flow {
+    width: buttonWidth * 2 + 8
+    spacing: 8
+
+    property double buttonWidth: 80
+
+    BlenderToggle {
+        width: buttonWidth
+        buttonText: "Save!"
+        function onClicked() {
+            var saveData =
+                    "import QtQuick 1.0\n" +
+                    "import Qt3D 1.0\n" +
+                    "\n" +
+                    "Item3D {\n" +
+                    "    Translation3D {\n" +
+                    "        id: transformTranslate\n" +
+                    "        translate: Qt.vector3d(" +
+                        transformTranslate.translate.x + ", " +
+                        transformTranslate.translate.y + ", " +
+                        transformTranslate.translate.z + ")\n" +
+                    "    }\n" +
+                    "\n" +
+                    "    Rotation3D {\n" +
+                    "        id: transformRotateX\n" +
+                    "        angle: " + transformRotateX.angle + "\n" +
+                    "        axis: Qt.vector3d(1, 0, 0)\n" +
+                    "    }\n" +
+                    "\n" +
+                    "    Rotation3D {\n" +
+                    "        id: transformRotateY\n" +
+                    "        angle: " + transformRotateY.angle + "\n" +
+                    "        axis: Qt.vector3d(0, 1, 0)\n" +
+                    "    }\n" +
+                    "\n" +
+                    "    Rotation3D {\n" +
+                    "        id: transformRotateZ\n" +
+                    "        angle: " + transformRotateZ.angle + "\n" +
+                    "        axis: Qt.vector3d(0, 0, 1)\n" +
+                    "    }\n" +
+                    "\n" +
+                    "    Scale3D {\n" +
+                    "        id: transformScale\n" +
+                    "        scale: Qt.vector3d(" +
+                        transformScale.scale.x + ", " +
+                        transformScale.scale.y + ", " +
+                        transformScale.scale.z + ")\n" +
+                    "    }\n" +
+                    "\n" +
+                    "    Mesh {\n" +
+                    "        id: source_mesh\n" +
+                    "        source: \"%1\"\n" +
+                    "    }\n" +
+                    "\n" +
+                    "    mesh: source_mesh\n" +
+                    "    effect: Effect {}\n" +
+                    "    transform: [\n" +
+                    "        transformScale\n" +
+                    "        transformRotateX,\n" +
+                    "        transformRotateY,\n" +
+                    "        transformRotateZ,\n" +
+                    "        transformTranslate,\n" +
+                    "    ]\n" +
+                    "}\n";
+
+            quickSave.filename = source_mesh.source
+            quickSave.data = saveData
+            var result = quickSave.save
+            console.log("If there was an error it will be after here:" + result)
+        }
+    }
+
+    BlenderToggle {
+        width: buttonWidth
+        buttonText: "Load!"
+        function onClicked() { console.log(quickLoad.openModelFile); }
+    }
+
+    BlenderToggle {
+        width: buttonWidth
+        buttonText: "Help!"
+        function onClicked() { helpOverlay.visible = true }
+    }
+
+    BlenderToggle {
+        width: buttonWidth
+        buttonText: "To let."
+        function onClicked() { console.log("Dunno what this does yet...") }
+    }
+}
diff --git a/util/qt3d/modeltweak/qml/ConfigPane.qml b/util/qt3d/modeltweak/qml/ConfigPane.qml
deleted file mode 100644
index e1f61a01..00000000
--- a/util/qt3d/modeltweak/qml/ConfigPane.qml
+++ /dev/null
@@ -1,224 +0,0 @@
-import QtQuick 1.0
-import Qt3D 1.0
-import ModelTweak 1.0
-
-Row {
-    x: 16
-    y: parent.height/2 + 16
-    width: parent.width/2 - 16 - 16
-    height: parent.height/2 - 16 - 16
-    spacing: 16
-
-    Column {
-        width: parent.width/2
-        height: parent.height
-        spacing: 4
-
-        // POSITION
-        Text {
-            text: "Position";
-            color: "#FFFFFF"
-            width: parent.width
-            horizontalAlignment: Text.AlignHCenter
-        }
-        BlenderValueSlider {
-            focus: true
-            id: posX
-            label: "X:"
-            value: transformTranslate.translate.x.toFixed(3)
-            function update (f)  {
-                transformTranslate.translate = Qt.vector3d(f, transformTranslate.translate.y, transformTranslate.translate.z);
-            }
-            Keys.onTabPressed:   { updateMe(); focus = false; posY.focus = true; }
-        }
-        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(); focus = false; posZ.focus = true; }
-        }
-        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(); focus = false; rotX.focus = true; }
-        }
-
-        // ROTATE
-        Text {
-            text: "Rotation";
-            color: "#FFFFFF"
-            anchors.horizontalCenter: parent.horizontalCenter
-        }
-        BlenderValueSlider {
-            id: rotX
-            label: "X:"
-            delta: 1
-            min: 0;   limitMin: true
-            max: 360; limitMax: true
-            value: transformRotateX.angle.toFixed(3)
-            function update (f)  { transformRotateX.angle = f }
-            Keys.onTabPressed:   { updateMe(); focus = false; rotY.focus = true; }
-        }
-        BlenderValueSlider {
-            id: rotY
-            label: "Y:"
-            delta: 1
-            min: 0;   limitMin: true
-            max: 360; limitMax: true
-            value: transformRotateY.angle.toFixed(3)
-            function update (f)  { transformRotateY.angle = f }
-            Keys.onTabPressed:   { updateMe(); focus = false; rotZ.focus = true; }
-        }
-        BlenderValueSlider {
-            id: rotZ
-            label: "Z:"
-            delta: 1
-            min: 0;   limitMin: true
-            max: 360; limitMax: true
-            value: transformRotateZ.angle.toFixed(3)
-            function update (f)  { transformRotateZ.angle = f }
-            Keys.onTabPressed:   { updateMe(); focus = false; scaleX.focus = true; }
-        }
-
-        // SCALE
-        Text {
-            text: "Scale";
-            color: "#FFFFFF"
-            anchors.horizontalCenter: parent.horizontalCenter
-        }
-        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(); focus = false; scaleY.focus = true; }
-        }
-        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(); focus = false; scaleZ.focus = true; }
-        }
-        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(); focus = false; posX.focus = true; }
-        }
-
-    }
-    Column {
-        width: parent.width/2 - 16
-        height: parent.height
-        spacing: 8
-
-        Row {
-            width: parent.width
-            height: childrenRect.height
-            spacing: 8
-
-            BlenderToggle {
-                width: parent.width / 2 - 4
-                buttonText: "Save!"
-                function onClicked() {
-                    var saveData =
-                            "import QtQuick 1.0\n" +
-                            "import Qt3D 1.0\n" +
-                            "\n" +
-                            "Item3D {\n" +
-                            "    Translation3D {\n" +
-                            "        id: transformTranslate\n" +
-                            "        translate: Qt.vector3d(" +
-                                transformTranslate.translate.x + ", " +
-                                transformTranslate.translate.y + ", " +
-                                transformTranslate.translate.z + ")\n" +
-                            "    }\n" +
-                            "\n" +
-                            "    Rotation3D {\n" +
-                            "        id: transformRotateX\n" +
-                            "        angle: " + transformRotateX.angle + "\n" +
-                            "        axis: Qt.vector3d(1, 0, 0)\n" +
-                            "    }\n" +
-                            "\n" +
-                            "    Rotation3D {\n" +
-                            "        id: transformRotateY\n" +
-                            "        angle: " + transformRotateY.angle + "\n" +
-                            "        axis: Qt.vector3d(0, 1, 0)\n" +
-                            "    }\n" +
-                            "\n" +
-                            "    Rotation3D {\n" +
-                            "        id: transformRotateZ\n" +
-                            "        angle: " + transformRotateZ.angle + "\n" +
-                            "        axis: Qt.vector3d(0, 0, 1)\n" +
-                            "    }\n" +
-                            "\n" +
-                            "    Scale3D {\n" +
-                            "        id: transformScale\n" +
-                            "        scale: Qt.vector3d(" +
-                                transformScale.scale.x + ", " +
-                                transformScale.scale.y + ", " +
-                                transformScale.scale.z + ")\n" +
-                            "    }\n" +
-                            "\n" +
-                            "    Mesh {\n" +
-                            "        id: source_mesh\n" +
-                            "        source: \"%1\"\n" +
-                            "    }\n" +
-                            "\n" +
-                            "    mesh: source_mesh\n" +
-                            "    effect: Effect {}\n" +
-                            "    transform: [\n" +
-                            "        transformScale\n" +
-                            "        transformRotateX,\n" +
-                            "        transformRotateY,\n" +
-                            "        transformRotateZ,\n" +
-                            "        transformTranslate,\n" +
-                            "    ]\n" +
-                            "}\n";
-
-                    quickSave.filename = source_mesh.source
-                    quickSave.data = saveData
-                    var result = quickSave.save
-                    console.log("If there was an error it will be after here:" + result)
-                }
-            }
-
-            BlenderToggle {
-                width: parent.width / 2 - 4
-                buttonText: "Load!"
-                function onClicked() { console.log(quickLoad.openModelFile); }
-            }
-
-        }
-
-        Row {
-            width: parent.width
-            height: childrenRect.height
-            spacing: 8
-
-            BlenderToggle {
-                width: parent.width / 2 - 4
-                buttonText: "Help!"
-                function onClicked() { helpOverlay.visible = true }
-            }
-
-            BlenderToggle {
-                width: parent.width / 2 - 4
-                buttonText: "To let."
-                function onClicked() { console.log("Dunno what this does yet...") }
-            }
-        }
-    }
-}
diff --git a/util/qt3d/modeltweak/qml/ModelPropertiesPane.qml b/util/qt3d/modeltweak/qml/ModelPropertiesPane.qml
new file mode 100644
index 00000000..d8489cfc
--- /dev/null
+++ b/util/qt3d/modeltweak/qml/ModelPropertiesPane.qml
@@ -0,0 +1,149 @@
+import QtQuick 1.0
+import Qt3D 1.0
+import ModelTweak 1.0
+
+Column {
+    width: posX.width
+    height: parent.height
+    spacing: 4
+
+    // POSITION
+    Item {
+        width: parent.width
+        height: imageP.height
+
+        Text {
+            anchors.left: parent.left
+            anchors.leftMargin: 8
+            text: "Position";
+            color: "#FFFFFF"
+        }
+        Image {
+            id: imageP
+            anchors.right: parent.right
+            anchors.rightMargin: 8
+            source: "images/lock.png"
+        }
+    }
+    BlenderValueSlider {
+        focus: true
+        id: posX
+        label: "X:"
+        value: transformTranslate.translate.x.toFixed(3)
+        function update (f)  {
+            transformTranslate.translate = Qt.vector3d(f, transformTranslate.translate.y, transformTranslate.translate.z);
+        }
+        Keys.onTabPressed:   { updateMe(); focus = false; posY.focus = true; }
+    }
+    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(); focus = false; posZ.focus = true; }
+    }
+    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(); focus = false; rotX.focus = true; }
+    }
+
+    // ROTATE
+    Item {
+        width: parent.width
+        height: imageR.height
+
+        Text {
+            anchors.left: parent.left
+            anchors.leftMargin: 8
+            text: "Rotation";
+            color: "#FFFFFF"
+        }
+        Image {
+            id: imageR
+            anchors.right: parent.right
+            anchors.rightMargin: 8
+            source: "images/lock.png"
+        }
+    }
+    BlenderValueSlider {
+        id: rotX
+        label: "X:"
+        delta: 1
+        min: 0;   limitMin: true
+        max: 360; limitMax: true
+        value: transformRotateX.angle.toFixed(3)
+        function update (f)  { transformRotateX.angle = f }
+        Keys.onTabPressed:   { updateMe(); focus = false; rotY.focus = true; }
+    }
+    BlenderValueSlider {
+        id: rotY
+        label: "Y:"
+        delta: 1
+        min: 0;   limitMin: true
+        max: 360; limitMax: true
+        value: transformRotateY.angle.toFixed(3)
+        function update (f)  { transformRotateY.angle = f }
+        Keys.onTabPressed:   { updateMe(); focus = false; rotZ.focus = true; }
+    }
+    BlenderValueSlider {
+        id: rotZ
+        label: "Z:"
+        delta: 1
+        min: 0;   limitMin: true
+        max: 360; limitMax: true
+        value: transformRotateZ.angle.toFixed(3)
+        function update (f)  { transformRotateZ.angle = f }
+        Keys.onTabPressed:   { updateMe(); focus = false; scaleX.focus = true; }
+    }
+
+    // SCALE
+    Item {
+        width: parent.width
+        height: imageS.height
+
+        Text {
+            anchors.left: parent.left
+            anchors.leftMargin: 8
+            text: "Scale";
+            color: "#FFFFFF"
+        }
+        Image {
+            id: imageS
+            anchors.right: parent.right
+            anchors.rightMargin: 8
+            source: "images/lock.png"
+        }
+    }
+    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(); focus = false; scaleY.focus = true; }
+    }
+    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(); focus = false; scaleZ.focus = true; }
+    }
+    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(); focus = false; posX.focus = true; }
+    }
+
+}
diff --git a/util/qt3d/modeltweak/qml/ModelTweak.qml b/util/qt3d/modeltweak/qml/ModelTweak.qml
index d4426d4f..61340b34 100644
--- a/util/qt3d/modeltweak/qml/ModelTweak.qml
+++ b/util/qt3d/modeltweak/qml/ModelTweak.qml
@@ -211,6 +211,7 @@ Rectangle {
     }
 
     Rectangle {
+        id: meshName
         anchors.horizontalCenter: parent.horizontalCenter
         anchors.bottomMargin: 10
         anchors.bottom: parent.bottom
@@ -228,10 +229,20 @@ Rectangle {
         }
     }
 
-    ConfigPane {
+    ModelPropertiesPane {
+        id: modelPropertiesPane
+        x: 16;
+        y: parent.height / 2 + 16
 
     }
 
+    ButtonBarPane {
+        anchors {
+            top: modelPropertiesPane.top;
+            left: modelPropertiesPane.right; leftMargin: 16
+        }
+    }
+
     HelpOverlay {
         id: helpOverlay
         visible: false
diff --git a/util/qt3d/modeltweak/qml/images/lock.png b/util/qt3d/modeltweak/qml/images/lock.png
new file mode 100644
index 00000000..cafd8fc5
--- /dev/null
+++ b/util/qt3d/modeltweak/qml/images/lock.png