Move USB sidebar into the main view of the monitorstage

CURA-5943

plugins/MonitorStage/MonitorMain.qml

@@ -0,0 +1,40 @@
+// Copyright (c) 2017 Ultimaker B.V.
+
+import QtQuick 2.10
+import QtQuick.Controls 1.4
+
+import UM 1.3 as UM
+import Cura 1.0 as Cura
+
+
+Item
+{
+    // We show a nice overlay on the 3D viewer when the current output device has no monitor view
+    Rectangle
+    {
+        id: viewportOverlay
+
+        color: UM.Theme.getColor("viewport_overlay")
+        anchors.fill: parent
+        MouseArea
+        {
+            anchors.fill: parent
+            acceptedButtons: Qt.AllButtons
+            onWheel: wheel.accepted = true
+        }
+    }
+
+    Loader
+    {
+        id: monitorViewComponent
+
+        anchors.fill: parent
+
+        height: parent.height
+
+        property real maximumWidth: parent.width
+        property real maximumHeight: parent.height
+
+        sourceComponent: Cura.MachineManager.printerOutputDevices.length > 0 ? Cura.MachineManager.printerOutputDevices[0].monitorItem: null
+    }
+}

plugins/MonitorStage/MonitorMainView.qml

@@ -1,64 +0,0 @@
-// Copyright (c) 2017 Ultimaker B.V.
-
-import QtQuick 2.10
-import QtQuick.Controls 1.4
-
-import UM 1.3 as UM
-import Cura 1.0 as Cura
-
-
-Item
-{
-    // parent could be undefined as this component is not visible at all times
-    width: parent ? parent.width : 0
-    height: parent ? parent.height : 0
-
-    // We show a nice overlay on the 3D viewer when the current output device has no monitor view
-    Rectangle
-    {
-        id: viewportOverlay
-
-        color: UM.Theme.getColor("viewport_overlay")
-        width: parent.width
-        height: parent.height
-
-        MouseArea
-        {
-            anchors.fill: parent
-            acceptedButtons: Qt.AllButtons
-            onWheel: wheel.accepted = true
-        }
-    }
-
-    Loader
-    {
-        id: monitorViewComponent
-
-        anchors.top: parent.top
-        anchors.bottom: parent.bottom
-        anchors.left: parent.left
-
-        // If the sidebar is not set, the view should take the complete space.
-        property var widthFactor: monitorSidebarComponent.source == "" ? 1.0 : 0.7
-
-        width: Math.round(parent.width * widthFactor)
-        height: parent.height
-
-        property real maximumWidth: parent.width
-        property real maximumHeight: parent.height
-
-        sourceComponent: Cura.MachineManager.printerOutputDevices.length > 0 ? Cura.MachineManager.printerOutputDevices[0].monitorItem: null
-    }
-
-    Loader
-    {
-        id: monitorSidebarComponent
-
-        anchors.top: parent.top
-        anchors.bottom: parent.bottom
-        anchors.left: monitorViewComponent.right
-        anchors.right: parent.right
-
-        source: UM.Controller.activeStage.sidebarComponent != null ? UM.Controller.activeStage.sidebarComponent : ""
-    }
-}

plugins/MonitorStage/MonitorMenu.qml

@@ -0,0 +1,14 @@
+// Copyright (c) 2018 Ultimaker B.V.
+// Cura is released under the terms of the LGPLv3 or higher.
+
+import QtQuick 2.7
+import QtQuick.Controls 2.3
+
+import UM 1.3 as UM
+import Cura 1.1 as Cura
+
+Item
+{
+    signal showTooltip(Item item, point location, string text)
+    signal hideTooltip()
+}

plugins/MonitorStage/MonitorStage.py

@@ -65,15 +65,10 @@ class MonitorStage(CuraStage):
         # We can only connect now, as we need to be sure that everything is loaded (plugins get created quite early)
         Application.getInstance().getMachineManager().outputDevicesChanged.connect(self._onOutputDevicesChanged)
         self._onOutputDevicesChanged()
-        self._updateMainOverlay()
-        self._updateSidebar()
 
-    def _updateMainOverlay(self):
+        plugin_path = Application.getInstance().getPluginRegistry().getPluginPath(self.getPluginId())
-        main_component_path = os.path.join(PluginRegistry.getInstance().getPluginPath("MonitorStage"),
+        if plugin_path is not None:
-                                           "MonitorMainView.qml")
+            menu_component_path = os.path.join(plugin_path, "MonitorMenu.qml")
-        self.addDisplayComponent("main", main_component_path)
+            main_component_path = os.path.join(plugin_path, "MonitorMain.qml")
-
+            self.addDisplayComponent("menu", menu_component_path)
-    def _updateSidebar(self):
+            self.addDisplayComponent("main", main_component_path)
-        sidebar_component_path = os.path.join(Resources.getPath(Application.getInstance().ResourceTypes.QmlFiles),
-                                              "MonitorSidebar.qml")
-        self.addDisplayComponent("sidebar", sidebar_component_path)

plugins/USBPrinting/MonitorItem.qml

@@ -0,0 +1,27 @@
+// Copyright (c) 2018 Ultimaker B.V.
+// Cura is released under the terms of the LGPLv3 or higher.
+
+import QtQuick 2.10
+import QtQuick.Controls 2.0
+import QtQuick.Layouts 1.3
+
+import UM 1.2 as UM
+import Cura 1.0 as Cura
+Component
+{
+    Item
+    {
+        Rectangle
+        {
+            anchors.right: parent.right
+            width: parent.width * 0.3
+            anchors.top: parent.top
+            anchors.bottom: parent.bottom
+
+            Cura.PrintMonitor
+            {
+                anchors.fill: parent
+            }
+        }
+    }
+}

plugins/USBPrinting/USBPrinterOutputDevice.py

@@ -1,5 +1,6 @@
 # Copyright (c) 2018 Ultimaker B.V.
 # Cura is released under the terms of the LGPLv3 or higher.
+import os
 
 from UM.Logger import Logger
 from UM.i18n import i18nCatalog
@@ -64,7 +65,7 @@ class USBPrinterOutputDevice(PrinterOutputDevice):
         self._accepts_commands = True
 
         self._paused = False
-        self._printer_busy = False # when printer is preheating and waiting (M190/M109), or when waiting for action on the printer
+        self._printer_busy = False  # When printer is preheating and waiting (M190/M109), or when waiting for action on the printer
 
         self.setConnectionText(catalog.i18nc("@info:status", "Connected via USB"))
 
@@ -77,6 +78,8 @@ class USBPrinterOutputDevice(PrinterOutputDevice):
         self._firmware_name_requested = False
         self._firmware_updater = AvrFirmwareUpdater(self)
 
+        self._monitor_view_qml_path = os.path.join(os.path.dirname(os.path.abspath(__file__)), "MonitorItem.qml")
+
         CuraApplication.getInstance().getOnExitCallbackManager().addCallback(self._checkActivePrintingUponAppExit)
 
     # This is a callback function that checks if there is any printing in progress via USB when the application tries

resources/qml/Cura.qml

@@ -146,6 +146,7 @@ UM.MainWindow
 
             Rectangle
             {
+                id: stageMenuBackground
                 anchors
                 {
                     left: parent.left
@@ -153,7 +154,7 @@ UM.MainWindow
                     top: parent.top
                 }
                 visible: stageMenu.source != ""
-                height: Math.round(UM.Theme.getSize("stage_menu").height / 2)
+                height: visible ? Math.round(UM.Theme.getSize("stage_menu").height / 2) : 0
 
                 LinearGradient
                 {
@@ -254,7 +255,13 @@ UM.MainWindow
                 // A stage can control this area. If nothing is set, it will therefore show the 3D view.
                 id: main
 
-                anchors.fill: parent
+                anchors
+                {
+                    top: stageMenuBackground.bottom
+                    left: parent.left
+                    right: parent.right
+                    bottom: parent.bottom
+                }
 
                 source: UM.Controller.activeStage != null ? UM.Controller.activeStage.mainComponent : ""
             }

resources/qml/PrintMonitor.qml

@@ -11,136 +11,180 @@ import Cura 1.0 as Cura
 
 import "PrinterOutput"
 
-Column
+
+Rectangle
 {
-    id: printMonitor
+    id: base
+    UM.I18nCatalog { id: catalog; name: "cura"}
+
+    function showTooltip(item, position, text)
+    {
+        tooltip.text = text;
+        position = item.mapToItem(base, position.x - UM.Theme.getSize("default_arrow").width, position.y);
+        tooltip.show(position);
+    }
+
+    function hideTooltip()
+    {
+        tooltip.hide();
+    }
+
+    function strPadLeft(string, pad, length) {
+        return (new Array(length + 1).join(pad) + string).slice(-length);
+    }
+
+    function getPrettyTime(time)
+    {
+        var hours = Math.floor(time / 3600)
+        time -= hours * 3600
+        var minutes = Math.floor(time / 60);
+        time -= minutes * 60
+        var seconds = Math.floor(time);
+
+        var finalTime = strPadLeft(hours, "0", 2) + ":" + strPadLeft(minutes, "0", 2) + ":" + strPadLeft(seconds, "0", 2);
+        return finalTime;
+    }
+
     property var connectedDevice: Cura.MachineManager.printerOutputDevices.length >= 1 ? Cura.MachineManager.printerOutputDevices[0] : null
     property var activePrinter: connectedDevice != null ? connectedDevice.activePrinter : null
     property var activePrintJob: activePrinter != null ? activePrinter.activePrintJob: null
 
-    Cura.ExtrudersModel
+    SidebarTooltip
     {
-        id: extrudersModel
+        id: tooltip
-        simpleNames: true
     }
 
-    OutputDeviceHeader
+    Column
     {
-        outputDevice: connectedDevice
+        id: printMonitor
-    }
 
-    Rectangle
+        anchors.fill: parent
-    {
-        color: UM.Theme.getColor("wide_lining")
-        width: parent.width
-        height: childrenRect.height
 
-        Flow
+        Cura.ExtrudersModel
         {
-            id: extrudersGrid
+            id: extrudersModel
-            spacing: UM.Theme.getSize("thick_lining").width
+            simpleNames: true
+        }
+
+        OutputDeviceHeader
+        {
+            outputDevice: connectedDevice
+        }
+
+        Rectangle
+        {
+            color: UM.Theme.getColor("wide_lining")
             width: parent.width
+            height: childrenRect.height
 
-            Repeater
+            Flow
             {
-                id: extrudersRepeater
+                id: extrudersGrid
-                model: activePrinter != null ? activePrinter.extruders : null
+                spacing: UM.Theme.getSize("thick_lining").width
+                width: parent.width
 
-                ExtruderBox
+                Repeater
                 {
-                    color: UM.Theme.getColor("main_background")
+                    id: extrudersRepeater
-                    width: index == machineExtruderCount.properties.value - 1 && index % 2 == 0 ? extrudersGrid.width : Math.round(extrudersGrid.width / 2 - UM.Theme.getSize("thick_lining").width / 2)
+                    model: activePrinter != null ? activePrinter.extruders : null
-                    extruderModel: modelData
+
+                    ExtruderBox
+                    {
+                        color: UM.Theme.getColor("main_background")
+                        width: index == machineExtruderCount.properties.value - 1 && index % 2 == 0 ? extrudersGrid.width : Math.round(extrudersGrid.width / 2 - UM.Theme.getSize("thick_lining").width / 2)
+                        extruderModel: modelData
+                    }
                 }
             }
         }
-    }
 
-    Rectangle
+        Rectangle
-    {
-        color: UM.Theme.getColor("wide_lining")
-        width: parent.width
-        height: UM.Theme.getSize("thick_lining").width
-    }
-
-    HeatedBedBox
-    {
-        visible: {
-            if(activePrinter != null && activePrinter.bedTemperature != -1)
-            {
-                return true
-            }
-            return false
-        }
-        printerModel: activePrinter
-    }
-
-    UM.SettingPropertyProvider
-    {
-        id: bedTemperature
-        containerStack: Cura.MachineManager.activeMachine
-        key: "material_bed_temperature"
-        watchedProperties: ["value", "minimum_value", "maximum_value", "resolve"]
-        storeIndex: 0
-
-        property var resolve: Cura.MachineManager.activeStack != Cura.MachineManager.activeMachine ? properties.resolve : "None"
-    }
-
-    UM.SettingPropertyProvider
-    {
-        id: machineExtruderCount
-        containerStack: Cura.MachineManager.activeMachine
-        key: "machine_extruder_count"
-        watchedProperties: ["value"]
-    }
-
-    ManualPrinterControl
-    {
-        printerModel: activePrinter
-        visible: activePrinter != null ? activePrinter.canControlManually : false
-    }
-
-
-    MonitorSection
-    {
-        label: catalog.i18nc("@label", "Active print")
-        width: base.width
-        visible: activePrinter != null
-    }
-
-
-    MonitorItem
-    {
-        label: catalog.i18nc("@label", "Job Name")
-        value: activePrintJob != null ? activePrintJob.name : ""
-        width: base.width
-        visible: activePrinter != null
-    }
-
-    MonitorItem
-    {
-        label: catalog.i18nc("@label", "Printing Time")
-        value: activePrintJob != null ? getPrettyTime(activePrintJob.timeTotal) : ""
-        width: base.width
-        visible: activePrinter != null
-    }
-
-    MonitorItem
-    {
-        label: catalog.i18nc("@label", "Estimated time left")
-        value: activePrintJob != null ? getPrettyTime(activePrintJob.timeTotal - activePrintJob.timeElapsed) : ""
-        visible:
         {
-            if(activePrintJob == null)
+            color: UM.Theme.getColor("wide_lining")
+            width: parent.width
+            height: UM.Theme.getSize("thick_lining").width
+        }
+
+        HeatedBedBox
+        {
+            visible:
             {
+                if(activePrinter != null && activePrinter.bedTemperature != -1)
+                {
+                    return true
+                }
                 return false
             }
-
+            printerModel: activePrinter
-            return (activePrintJob.state == "printing" ||
+        }
-                    activePrintJob.state == "resuming" ||
+
-                    activePrintJob.state == "pausing" ||
+        UM.SettingPropertyProvider
-                    activePrintJob.state == "paused")
+        {
+            id: bedTemperature
+            containerStack: Cura.MachineManager.activeMachine
+            key: "material_bed_temperature"
+            watchedProperties: ["value", "minimum_value", "maximum_value", "resolve"]
+            storeIndex: 0
+
+            property var resolve: Cura.MachineManager.activeStack != Cura.MachineManager.activeMachine ? properties.resolve : "None"
+        }
+
+        UM.SettingPropertyProvider
+        {
+            id: machineExtruderCount
+            containerStack: Cura.MachineManager.activeMachine
+            key: "machine_extruder_count"
+            watchedProperties: ["value"]
+        }
+
+        ManualPrinterControl
+        {
+            printerModel: activePrinter
+            visible: activePrinter != null ? activePrinter.canControlManually : false
+        }
+
+
+        MonitorSection
+        {
+            label: catalog.i18nc("@label", "Active print")
+            width: base.width
+            visible: activePrinter != null
+        }
+
+
+        MonitorItem
+        {
+            label: catalog.i18nc("@label", "Job Name")
+            value: activePrintJob != null ? activePrintJob.name : ""
+            width: base.width
+            visible: activePrinter != null
+        }
+
+        MonitorItem
+        {
+            label: catalog.i18nc("@label", "Printing Time")
+            value: activePrintJob != null ? getPrettyTime(activePrintJob.timeTotal) : ""
+            width: base.width
+            visible: activePrinter != null
+        }
+
+        MonitorItem
+        {
+            label: catalog.i18nc("@label", "Estimated time left")
+            value: activePrintJob != null ? getPrettyTime(activePrintJob.timeTotal - activePrintJob.timeElapsed) : ""
+            visible:
+            {
+                if(activePrintJob == null)
+                {
+                    return false
+                }
+
+                return (activePrintJob.state == "printing" ||
+                        activePrintJob.state == "resuming" ||
+                        activePrintJob.state == "pausing" ||
+                        activePrintJob.state == "paused")
+            }
+            width: base.width
         }
-        width: base.width
     }
-}
+}