diff --git a/plugins/MonitorStage/MonitorStage.py b/plugins/MonitorStage/MonitorStage.py
index 931c205fff..631da71072 100644
--- a/plugins/MonitorStage/MonitorStage.py
+++ b/plugins/MonitorStage/MonitorStage.py
@@ -73,6 +73,5 @@ class MonitorStage(CuraStage):
self.addDisplayComponent("main", main_component_path)
def _updateSidebar(self):
- # TODO: 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_path = os.path.join(Resources.getPath(Application.getInstance().ResourceTypes.QmlFiles), "MonitorSidebar.qml")
self.addDisplayComponent("sidebar", sidebar_component_path)
diff --git a/plugins/PrepareStage/PrepareStage.py b/plugins/PrepareStage/PrepareStage.py
index 9d4d632845..df40476f7f 100644
--- a/plugins/PrepareStage/PrepareStage.py
+++ b/plugins/PrepareStage/PrepareStage.py
@@ -14,5 +14,5 @@ class PrepareStage(CuraStage):
Application.getInstance().engineCreatedSignal.connect(self._engineCreated)
def _engineCreated(self):
- sidebar_component_path = os.path.join(Resources.getPath(Application.getInstance().ResourceTypes.QmlFiles), "Sidebar.qml")
+ sidebar_component_path = os.path.join(Resources.getPath(Application.getInstance().ResourceTypes.QmlFiles), "PrepareSidebar.qml")
self.addDisplayComponent("sidebar", sidebar_component_path)
diff --git a/resources/qml/Sidebar.qml b/resources/qml/MonitorSidebar.qml
similarity index 100%
rename from resources/qml/Sidebar.qml
rename to resources/qml/MonitorSidebar.qml
diff --git a/resources/qml/PrepareSidebar.qml b/resources/qml/PrepareSidebar.qml
new file mode 100644
index 0000000000..86e866d895
--- /dev/null
+++ b/resources/qml/PrepareSidebar.qml
@@ -0,0 +1,676 @@
+// Copyright (c) 2017 Ultimaker B.V.
+// Cura is released under the terms of the LGPLv3 or higher.
+
+import QtQuick 2.7
+import QtQuick.Controls 2.0
+import QtQuick.Layouts 1.3
+
+import UM 1.2 as UM
+import Cura 1.0 as Cura
+import "Menus"
+import "Menus/ConfigurationMenu"
+
+Rectangle
+{
+ id: base
+
+ property int currentModeIndex
+ property bool hideSettings: PrintInformation.preSliced
+ property bool hideView: Cura.MachineManager.activeMachineName == ""
+
+ // Is there an output device for this printer?
+ property bool isNetworkPrinter: Cura.MachineManager.activeMachineNetworkKey != ""
+ property bool printerConnected: Cura.MachineManager.printerConnected
+ property bool printerAcceptsCommands: printerConnected && Cura.MachineManager.printerOutputDevices[0].acceptsCommands
+ property var connectedPrinter: Cura.MachineManager.printerOutputDevices.length >= 1 ? Cura.MachineManager.printerOutputDevices[0] : null
+
+ property bool monitoringPrint: UM.Controller.activeStage.stageId == "MonitorStage"
+
+ property variant printDuration: PrintInformation.currentPrintTime
+ property variant printMaterialLengths: PrintInformation.materialLengths
+ property variant printMaterialWeights: PrintInformation.materialWeights
+ property variant printMaterialCosts: PrintInformation.materialCosts
+ property variant printMaterialNames: PrintInformation.materialNames
+
+ color: UM.Theme.getColor("sidebar")
+ UM.I18nCatalog { id: catalog; name:"cura"}
+
+ Timer {
+ id: tooltipDelayTimer
+ interval: 500
+ repeat: false
+ property var item
+ property string text
+
+ onTriggered:
+ {
+ base.showTooltip(base, {x: 0, y: item.y}, text);
+ }
+ }
+
+ 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;
+ }
+
+ MouseArea
+ {
+ anchors.fill: parent
+ acceptedButtons: Qt.AllButtons
+
+ onWheel:
+ {
+ wheel.accepted = true;
+ }
+ }
+
+ MachineSelection
+ {
+ id: machineSelection
+ width: base.width - configSelection.width - separator.width
+ height: UM.Theme.getSize("sidebar_header").height
+ anchors.top: base.top
+ anchors.left: parent.left
+ }
+
+ Rectangle
+ {
+ id: separator
+ visible: configSelection.visible
+ width: visible ? Math.round(UM.Theme.getSize("sidebar_lining_thin").height / 2) : 0
+ height: UM.Theme.getSize("sidebar_header").height
+ color: UM.Theme.getColor("sidebar_lining_thin")
+ anchors.left: machineSelection.right
+ }
+
+ ConfigurationSelection
+ {
+ id: configSelection
+ visible: isNetworkPrinter && printerConnected
+ width: visible ? Math.round(base.width * 0.15) : 0
+ height: UM.Theme.getSize("sidebar_header").height
+ anchors.top: base.top
+ anchors.right: parent.right
+ panelWidth: base.width
+ }
+
+ SidebarHeader {
+ id: header
+ width: parent.width
+ visible: !hideSettings && (machineExtruderCount.properties.value > 1 || Cura.MachineManager.hasMaterials || Cura.MachineManager.hasVariants) && !monitoringPrint
+ anchors.top: machineSelection.bottom
+
+ onShowTooltip: base.showTooltip(item, location, text)
+ onHideTooltip: base.hideTooltip()
+ }
+
+ Rectangle {
+ id: headerSeparator
+ width: parent.width
+ visible: settingsModeSelection.visible && header.visible
+ height: visible ? UM.Theme.getSize("sidebar_lining").height : 0
+ color: UM.Theme.getColor("sidebar_lining")
+ anchors.top: header.bottom
+ anchors.topMargin: visible ? UM.Theme.getSize("sidebar_margin").height : 0
+ }
+
+ onCurrentModeIndexChanged:
+ {
+ UM.Preferences.setValue("cura/active_mode", currentModeIndex);
+ if(modesListModel.count > base.currentModeIndex)
+ {
+ sidebarContents.replace(modesListModel.get(base.currentModeIndex).item, { "replace": true })
+ }
+ }
+
+ Label
+ {
+ id: settingsModeLabel
+ text: !hideSettings ? catalog.i18nc("@label:listbox", "Print Setup") : catalog.i18nc("@label:listbox", "Print Setup disabled\nG-code files cannot be modified")
+ renderType: Text.NativeRendering
+ anchors.left: parent.left
+ anchors.leftMargin: UM.Theme.getSize("sidebar_margin").width
+ anchors.top: hideSettings ? machineSelection.bottom : headerSeparator.bottom
+ anchors.topMargin: UM.Theme.getSize("sidebar_margin").height
+ width: Math.round(parent.width * 0.45)
+ font: UM.Theme.getFont("large")
+ color: UM.Theme.getColor("text")
+ visible: !monitoringPrint && !hideView
+ }
+
+ // Settings mode selection toggle
+ Rectangle
+ {
+ id: settingsModeSelection
+ color: "transparent"
+
+ width: Math.round(parent.width * 0.55)
+ height: UM.Theme.getSize("sidebar_header_mode_toggle").height
+
+ anchors.right: parent.right
+ anchors.rightMargin: UM.Theme.getSize("sidebar_margin").width
+ anchors.topMargin: UM.Theme.getSize("sidebar_margin").height
+ anchors.top:
+ {
+ if (settingsModeLabel.contentWidth >= parent.width - width - UM.Theme.getSize("sidebar_margin").width * 2)
+ {
+ return settingsModeLabel.bottom;
+ }
+ else
+ {
+ return headerSeparator.bottom;
+ }
+ }
+
+ visible: !monitoringPrint && !hideSettings && !hideView
+
+ Component
+ {
+ id: wizardDelegate
+
+ Button
+ {
+ id: control
+
+ height: settingsModeSelection.height
+ width: Math.round(parent.width / 2)
+
+ anchors.left: parent.left
+ anchors.leftMargin: model.index * Math.round(settingsModeSelection.width / 2)
+ anchors.verticalCenter: parent.verticalCenter
+
+ ButtonGroup.group: modeMenuGroup
+
+ checkable: true
+ checked: base.currentModeIndex == index
+ onClicked: base.currentModeIndex = index
+
+ onHoveredChanged:
+ {
+ if (hovered)
+ {
+ tooltipDelayTimer.item = settingsModeSelection
+ tooltipDelayTimer.text = model.tooltipText
+ tooltipDelayTimer.start()
+ }
+ else
+ {
+ tooltipDelayTimer.stop()
+ base.hideTooltip()
+ }
+ }
+
+ background: Rectangle
+ {
+ border.width: control.checked ? UM.Theme.getSize("default_lining").width * 2 : UM.Theme.getSize("default_lining").width
+ border.color: (control.checked || control.pressed) ? UM.Theme.getColor("action_button_active_border") : control.hovered ? UM.Theme.getColor("action_button_hovered_border"): UM.Theme.getColor("action_button_border")
+
+ // for some reason, QtQuick decided to use the color of the background property as text color for the contentItem, so here it is
+ color: (control.checked || control.pressed) ? UM.Theme.getColor("action_button_active") : control.hovered ? UM.Theme.getColor("action_button_hovered") : UM.Theme.getColor("action_button")
+ }
+
+ contentItem: Label
+ {
+ text: model.text
+ font: UM.Theme.getFont("default")
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+ renderType: Text.NativeRendering
+ elide: Text.ElideRight
+ color:
+ {
+ if(control.pressed)
+ {
+ return UM.Theme.getColor("action_button_active_text");
+ }
+ else if(control.hovered)
+ {
+ return UM.Theme.getColor("action_button_hovered_text");
+ }
+ return UM.Theme.getColor("action_button_text");
+ }
+ }
+ }
+ }
+
+ ButtonGroup
+ {
+ id: modeMenuGroup
+ }
+
+ ListView
+ {
+ id: modesList
+ property var index: 0
+ model: modesListModel
+ delegate: wizardDelegate
+ anchors.top: parent.top
+ anchors.left: parent.left
+ width: parent.width
+ }
+ }
+
+ StackView
+ {
+ id: sidebarContents
+
+ anchors.bottom: footerSeparator.top
+ anchors.top: settingsModeSelection.bottom
+ anchors.topMargin: UM.Theme.getSize("sidebar_margin").height
+ anchors.left: base.left
+ anchors.right: base.right
+ visible: !monitoringPrint && !hideSettings
+
+ replaceEnter: Transition {
+ PropertyAnimation {
+ property: "opacity"
+ from: 0
+ to:1
+ duration: 100
+ }
+ }
+
+ replaceExit: Transition {
+ PropertyAnimation {
+ property: "opacity"
+ from: 1
+ to:0
+ duration: 100
+ }
+ }
+ }
+
+ Loader
+ {
+ id: controlItem
+ anchors.bottom: footerSeparator.top
+ anchors.top: monitoringPrint ? machineSelection.bottom : headerSeparator.bottom
+ anchors.left: base.left
+ anchors.right: base.right
+ sourceComponent:
+ {
+ if(monitoringPrint && connectedPrinter != null)
+ {
+ if(connectedPrinter.controlItem != null)
+ {
+ return connectedPrinter.controlItem
+ }
+ }
+ return null
+ }
+ }
+
+ Loader
+ {
+ anchors.bottom: footerSeparator.top
+ anchors.top: monitoringPrint ? machineSelection.bottom : headerSeparator.bottom
+ anchors.left: base.left
+ anchors.right: base.right
+ source:
+ {
+ if(controlItem.sourceComponent == null)
+ {
+ if(monitoringPrint)
+ {
+ return "PrintMonitor.qml"
+ } else
+ {
+ return "SidebarContents.qml"
+ }
+ }
+ else
+ {
+ return ""
+ }
+ }
+ }
+
+ Rectangle
+ {
+ id: footerSeparator
+ width: parent.width
+ height: UM.Theme.getSize("sidebar_lining").height
+ color: UM.Theme.getColor("sidebar_lining")
+ anchors.bottom: printSpecs.top
+ anchors.bottomMargin: Math.round(UM.Theme.getSize("sidebar_margin").height * 2 + UM.Theme.getSize("progressbar").height + UM.Theme.getFont("default_bold").pixelSize)
+ }
+
+ Item
+ {
+ id: printSpecs
+ anchors.left: parent.left
+ anchors.bottom: parent.bottom
+ anchors.leftMargin: UM.Theme.getSize("sidebar_margin").width
+ anchors.bottomMargin: UM.Theme.getSize("sidebar_margin").height
+ height: timeDetails.height + costSpec.height
+ width: base.width - (saveButton.buttonRowWidth + UM.Theme.getSize("sidebar_margin").width)
+ visible: !monitoringPrint
+ clip: true
+
+ Label
+ {
+ id: timeDetails
+ anchors.left: parent.left
+ anchors.bottom: costSpec.top
+ font: UM.Theme.getFont("large")
+ color: UM.Theme.getColor("text_subtext")
+ text: (!base.printDuration || !base.printDuration.valid) ? catalog.i18nc("@label Hours and minutes", "00h 00min") : base.printDuration.getDisplayString(UM.DurationFormat.Short)
+ renderType: Text.NativeRendering
+
+ MouseArea
+ {
+ id: timeDetailsMouseArea
+ anchors.fill: parent
+ hoverEnabled: true
+
+ onEntered:
+ {
+ if(base.printDuration.valid && !base.printDuration.isTotalDurationZero)
+ {
+ // All the time information for the different features is achieved
+ var print_time = PrintInformation.getFeaturePrintTimes();
+ var total_seconds = parseInt(base.printDuration.getDisplayString(UM.DurationFormat.Seconds))
+
+ // A message is created and displayed when the user hover the time label
+ var tooltip_html = "%1
" + feature + ": | " + + "%1 | ".arg(print_time[feature].getDisplayString(UM.DurationFormat.ISO8601).slice(0,-3)) + + "%1% | ".arg(Math.round(100 * parseInt(print_time[feature].getDisplayString(UM.DurationFormat.Seconds)) / total_seconds)) + + "