Changed orientation button location, adjusted call functins

CURA-4527

resources/qml/Cura.qml

@@ -403,89 +403,6 @@ UM.MainWindow
                 }
             }
 
-
-            //View orientation Item
-            Item
-            {
-                height: 90
-                width: 90
-
-                anchors.top: topbar.bottom;
-                anchors.topMargin: - UM.Theme.getSize("default_margin").height * 2;
-                anchors.right: sidebar.left
-                anchors.rightMargin: 250
-
-                //Rotate_top
-                Button
-                {
-                    id: orientation_rotate_top;
-                    iconSource: UM.Theme.getIcon("arrow_top")
-                    style: UM.Theme.styles.orientation_button
-                    anchors.top: parent.top
-                    anchors.left: parent.left
-                    anchors.leftMargin: 30
-
-
-                }
-
-                //Rotate_right
-                Button
-                {
-                    id: orientation_rotate_right;
-                    iconSource: UM.Theme.getIcon("arrow_right")
-                    style: UM.Theme.styles.orientation_button
-                    anchors.bottom: parent.bottom
-                    anchors.bottomMargin: 30
-                    anchors.right: parent.right
-                    onClicked:{
-                        UM.Controller.rotateView("x", -90);
-                    }
-                }
-
-                //Rotate_bottom
-                Button
-                {
-                    id: orientation_rotate_bottom;
-                    iconSource: UM.Theme.getIcon("arrow_bottom")
-                    style: UM.Theme.styles.orientation_button
-                    anchors.bottom: parent.bottom
-                    anchors.left: parent.left
-                    anchors.leftMargin: 30
-                }
-
-                //Rotate_left
-                Button
-                {
-                    id: orientation_rotate_left;
-                    iconSource: UM.Theme.getIcon("arrow_left")
-                    style: UM.Theme.styles.orientation_button
-                    anchors.bottom: parent.bottom
-                    anchors.bottomMargin: 30
-                    anchors.left: parent.left
-                    onClicked:{
-                        UM.Controller.rotateView("x", 90);
-                    }
-
-                }
-
-                //Rotate_front
-                Button
-                {
-                    id: orientation_rotate_front;
-                    iconSource: UM.Theme.getIcon("category_machine")
-                    style: UM.Theme.styles.orientation_button
-                    anchors.bottom: parent.bottom
-                    anchors.bottomMargin: 30
-                    anchors.left: parent.left
-                    anchors.leftMargin: 30
-
-                    onClicked:{
-                        UM.Controller.rotateView("home" , 0);
-                    }
-                }
-            }
-
-
             Loader
             {
                 sourceComponent: Cura.MachineManager.printerOutputDevices.length > 0 ? Cura.MachineManager.printerOutputDevices[0].monitorItem: null

resources/qml/Topbar.qml

@@ -220,6 +220,76 @@ Rectangle
         menu: PrinterMenu { }
     }
 
+        //View orientation Item
+    Row
+    {
+        id: viewOrientationControl
+        height: 30
+        width: 155
+        spacing: 2
+
+        anchors {
+            verticalCenter: base.verticalCenter
+            right: viewModeButton.right
+            rightMargin: UM.Theme.getSize("default_margin").width + viewModeButton.width
+        }
+
+        // #1 3d view
+        Button
+        {
+            iconSource: UM.Theme.getIcon("category_machine")
+            style: UM.Theme.styles.orientation_button
+            anchors.verticalCenter: viewOrientationControl.verticalCenter
+            onClicked:{
+                UM.Controller.rotateView("3d", 0);
+            }
+        }
+
+        // #2 Front view
+        Button
+        {
+            iconSource: UM.Theme.getIcon("category_machine")
+            style: UM.Theme.styles.orientation_button
+            anchors.verticalCenter: viewOrientationControl.verticalCenter
+            onClicked:{
+                UM.Controller.rotateView("home", 0);
+            }
+        }
+
+        // #3 Top view
+        Button
+        {
+            iconSource: UM.Theme.getIcon("category_machine")
+            style: UM.Theme.styles.orientation_button
+            anchors.verticalCenter: viewOrientationControl.verticalCenter
+            onClicked:{
+                UM.Controller.rotateView("y", 90);
+            }
+        }
+
+        // #4 Left view
+        Button
+        {
+            iconSource: UM.Theme.getIcon("category_machine")
+            style: UM.Theme.styles.orientation_button
+            anchors.verticalCenter: viewOrientationControl.verticalCenter
+            onClicked:{
+                UM.Controller.rotateView("x", 90);
+            }
+        }
+
+        // #5 Left view
+        Button
+        {
+            iconSource: UM.Theme.getIcon("category_machine")
+            style: UM.Theme.styles.orientation_button
+            anchors.verticalCenter: viewOrientationControl.verticalCenter
+            onClicked:{
+                UM.Controller.rotateView("x", -90);
+            }
+        }
+    }
+
     ComboBox
     {
         id: viewModeButton

resources/themes/cura-light/styles.qml

@@ -383,8 +383,8 @@ QtObject {
     property Component orientation_button: Component {
         ButtonStyle {
             background: Item {
-                implicitWidth: 30;
+                implicitWidth: 25;
-                implicitHeight: 30;
+                implicitHeight: 25;
 
                 Rectangle {
                     id: buttonFace2;
@@ -403,7 +403,7 @@ QtObject {
                             return Theme.getColor("button_hover");
                         } else {
                             //return Theme.getColor("button");
-                            return "red"
+                            return "transparent"
                         }
                     }
                     Behavior on color { ColorAnimation { duration: 50; } }
@@ -469,11 +469,13 @@ QtObject {
                         }
                         else if(control.hovered)
                         {
-                            return Theme.getColor("button_text_hover");
+                            //return Theme.getColor("button_text_hover");
+                            return "white"
                         }
                         else
                         {
-                            return Theme.getColor("button_text");
+                            //return Theme.getColor("button_text");
+                            return "black"
                         }
                     }