Sidebar and main view via loader

plugins/MonitorStage/MonitorStage.py

@@ -1,6 +1,8 @@
 # Copyright (c) 2017 Ultimaker B.V.
 # Cura is released under the terms of the LGPLv3 or higher.
+import os.path
 from UM.Application import Application
+from UM.Resources import Resources
 from cura.Stages.CuraStage import CuraStage
 
 
@@ -10,6 +12,11 @@ class MonitorStage(CuraStage):
     def __init__(self):
         super().__init__()
         Application.getInstance().engineCreatedSignal.connect(self._engineCreated)
+        # TODO: connect output device state to icon source
 
     def _engineCreated(self):
+        # Note: currently the sidebar component for prepare and monitor stages is the same, this will change with the printer output device refactor!
+        sidebar_component_path = os.path.join(Resources.getPath(Application.getInstance().ResourceTypes.QmlFiles), "Sidebar.qml")
+        sidebar_component = Application.getInstance().createQmlComponent(sidebar_component_path)
+        self.addDisplayComponent("sidebar", sidebar_component)
         self.setIconSource(Application.getInstance().getTheme().getIcon("tab_status_connected"))

resources/qml/Cura.qml

@@ -358,15 +358,13 @@ UM.MainWindow
             Topbar
             {
                 id: topbar
-                anchors.left:parent.left
+                anchors.left: parent.left
                 anchors.right: parent.right
                 anchors.top: parent.top
-                monitoringPrint: base.showPrintMonitor
-                onStartMonitoringPrint: base.showPrintMonitor = true
-                onStopMonitoringPrint: base.showPrintMonitor = false
             }
 
-            Loader {
+            Loader
+            {
                 id: sidebar
 
                 anchors
@@ -382,39 +380,30 @@ UM.MainWindow
                 sourceComponent: UM.Controller.activeStage.sidebarComponent
             }
 
-            Rectangle
+            Loader
             {
-                id: viewportOverlay
+                id: main
 
-                color: UM.Theme.getColor("viewport_overlay")
                 anchors
                 {
                     top: topbar.bottom
                     bottom: parent.bottom
-                    left:parent.left
+                    left: parent.left
                     right: sidebar.left
+//                    horizontalCenter: parent.horizontalCenter
+//                    verticalCenter: parent.verticalCenter
+//                    horizontalCenterOffset: - UM.Theme.getSize("sidebar").width / 2
+//                    verticalCenterOffset: UM.Theme.getSize("sidebar_header").height / 2
                 }
-                visible: opacity > 0
-                opacity: base.showPrintMonitor ? 1 : 0
-
-                MouseArea {
-                    anchors.fill: parent
-                    acceptedButtons: Qt.AllButtons
 
-                    onWheel: wheel.accepted = true
-                }
-            }
+//                MouseArea
+//                {
+//                    anchors.fill: parent
+//                    acceptedButtons: Qt.AllButtons
+//                    onWheel: wheel.accepted = true
+//                }
 
-            Loader
-            {
-                sourceComponent: Cura.MachineManager.printerOutputDevices.length > 0 ? Cura.MachineManager.printerOutputDevices[0].monitorItem: null
-                visible: base.showPrintMonitor
-                anchors.horizontalCenter: parent.horizontalCenter
-                anchors.verticalCenter: parent.verticalCenter
-                anchors.horizontalCenterOffset: - UM.Theme.getSize("sidebar").width / 2
-                anchors.verticalCenterOffset: UM.Theme.getSize("sidebar_header").height / 2
-                property real maximumWidth: viewportOverlay.width
-                property real maximumHeight: viewportOverlay.height
+                sourceComponent: UM.Controller.activeStage.mainComponent
             }
 
             UM.MessageStack

resources/qml/Settings/SettingView.qml

@@ -24,7 +24,7 @@ Item
     {
         id: globalProfileRow
         height: UM.Theme.getSize("sidebar_setup").height
-        visible: !sidebar.monitoringPrint && !sidebar.hideSettings
+//        visible: !sidebar.monitoringPrint && !sidebar.hideSettings
 
         anchors
         {

resources/qml/Sidebar.qml

@@ -26,7 +26,7 @@ Component
         property var connectedPrinter: Cura.MachineManager.printerOutputDevices.length >= 1 ? Cura.MachineManager.printerOutputDevices[0] : null
         property int backendState: UM.Backend.state
 
-        property bool monitoringPrint: false
+        property bool monitoringPrint: UM.Controller.activeStage.id == "MonitorStage"
 
         property variant printDuration: PrintInformation.currentPrintTime
         property variant printMaterialLengths: PrintInformation.materialLengths

resources/qml/SidebarHeader.qml

@@ -40,7 +40,7 @@ Column
         id: extruderSelectionRow
         width: parent.width
         height: Math.floor(UM.Theme.getSize("sidebar_tabs").height * 2 / 3)
-        visible: machineExtruderCount.properties.value > 1 && !sidebar.monitoringPrint
+        visible: machineExtruderCount.properties.value > 1
 
         anchors
         {
@@ -229,7 +229,7 @@ Column
     {
         id: materialRow
         height: UM.Theme.getSize("sidebar_setup").height
-        visible: Cura.MachineManager.hasMaterials && !sidebar.monitoringPrint && !sidebar.hideSettings
+        visible: Cura.MachineManager.hasMaterials
 
         anchors
         {
@@ -279,7 +279,7 @@ Column
     {
         id: variantRow
         height: UM.Theme.getSize("sidebar_setup").height
-        visible: Cura.MachineManager.hasVariants && !sidebar.monitoringPrint && !sidebar.hideSettings
+        visible: Cura.MachineManager.hasVariants
 
         anchors
         {
@@ -319,7 +319,7 @@ Column
     {
         id: materialInfoRow
         height: Math.floor(UM.Theme.getSize("sidebar_setup").height / 2)
-        visible: (Cura.MachineManager.hasVariants || Cura.MachineManager.hasMaterials) && !sidebar.monitoringPrint && !sidebar.hideSettings
+        visible: Cura.MachineManager.hasVariants || Cura.MachineManager.hasMaterials
 
         anchors
         {

resources/qml/Topbar.qml

@@ -16,27 +16,22 @@ Rectangle
     anchors.left: parent.left
     anchors.right: parent.right
     height: UM.Theme.getSize("sidebar_header").height
-    color: base.monitoringPrint ? UM.Theme.getColor("topbar_background_color_monitoring") : UM.Theme.getColor("topbar_background_color")
+    color: UM.Controller.activeStage.id == "MonitorStage" ? UM.Theme.getColor("topbar_background_color_monitoring") : UM.Theme.getColor("topbar_background_color")
 
     property bool printerConnected: Cura.MachineManager.printerOutputDevices.length != 0
     property bool printerAcceptsCommands: printerConnected && Cura.MachineManager.printerOutputDevices[0].acceptsCommands
-    property bool monitoringPrint: false
-
-    // outgoing signal
-    signal startMonitoringPrint()
-    signal stopMonitoringPrint()
 
     // update monitoring status when event was triggered outside topbar
-    Component.onCompleted: {
-        startMonitoringPrint.connect(function () {
-            base.monitoringPrint = true
-            UM.Controller.disableModelRendering()
-        })
-        stopMonitoringPrint.connect(function () {
-            base.monitoringPrint = false
-            UM.Controller.enableModelRendering()
-        })
-    }
+//    Component.onCompleted: {
+//        startMonitoringPrint.connect(function () {
+//            base.monitoringPrint = true
+//            UM.Controller.disableModelRendering()
+//        })
+//        stopMonitoringPrint.connect(function () {
+//            base.monitoringPrint = false
+//            UM.Controller.enableModelRendering()
+//        })
+//    }
 
     UM.I18nCatalog
     {
@@ -79,9 +74,10 @@ Rectangle
                 text: model.name
                 checkable: true
                 checked: model.active
-                exclusiveGroup: sidebarHeaderBarGroup
+                exclusiveGroup: topbarMenuGroup
                 style: UM.Theme.styles.topbar_header_tab
                 height: UM.Theme.getSize("sidebar_header").height
+                width: UM.Theme.getSize("topbar_button").width
                 onClicked: UM.Controller.setActiveStage(model.id)
                 iconSource: model.stage.iconSource
 
@@ -90,6 +86,8 @@ Rectangle
             }
         }
 
+        ExclusiveGroup { id: topbarMenuGroup }
+
 //        Button
 //        {
 //            id: showMonitor
@@ -149,8 +147,6 @@ Rectangle
 //                }
 //            }
 //        }
-
-        ExclusiveGroup { id: sidebarHeaderBarGroup }
     }
 
     ToolButton
@@ -218,17 +214,16 @@ Rectangle
         menu: PrinterMenu { }
     }
 
-        //View orientation Item
+    // View orientation Item
     Row
     {
         id: viewOrientationControl
         height: 30
-
         spacing: 2
+        visible: UM.Controller.activeStage.id != "MonitorStage"
 
-        visible: !base.monitoringPrint
-
-        anchors {
+        anchors
+        {
             verticalCenter: base.verticalCenter
             right: viewModeButton.right
             rightMargin: UM.Theme.getSize("default_margin").width + viewModeButton.width
@@ -306,7 +301,7 @@ Rectangle
         }
 
         style: UM.Theme.styles.combobox
-        visible: !base.monitoringPrint
+        visible: UM.Controller.activeStage.id != "MonitorStage"
 
         model: UM.ViewModel { }
         textRole: "name"