Merge branch '4.0' of github.com:Ultimaker/Cura into 4.0

plugins/Toolbox/resources/qml/ToolboxDownloadsShowcaseTile.qml

@@ -47,6 +47,7 @@ Rectangle
         height: UM.Theme.getSize("toolbox_heading_label").height
         width: parent.width - UM.Theme.getSize("default_margin").width
         wrapMode: Text.WordWrap
+        elide: Text.ElideRight
         font: UM.Theme.getFont("medium_bold")
     }
     UM.RecolorImage

plugins/UM3NetworkPrinting/resources/qml/CameraButton.qml

@@ -8,11 +8,13 @@ import UM 1.3 as UM
 import Cura 1.0 as Cura
 
 Rectangle {
+    id: base
     property var iconSource: null;
     color: "#0a0850" // TODO: Theme!
     height: width;
     radius: Math.round(0.5 * width);
     width: 24 * screenScaleFactor;
+    property var enabled: true
 
     UM.RecolorImage {
         id: icon;
@@ -29,12 +31,18 @@ Rectangle {
     MouseArea {
         id: clickArea;
         anchors.fill: parent;
-        hoverEnabled: true;
+        hoverEnabled: base.enabled
         onClicked: {
-            if (OutputDevice.activeCameraUrl != "") {
+            if (base.enabled)
-                OutputDevice.setActiveCameraUrl("");
+            {
-            } else {
+                if (OutputDevice.activeCameraUrl != "")
-                OutputDevice.setActiveCameraUrl(modelData.cameraUrl);
+                {
+                    OutputDevice.setActiveCameraUrl("")
+                }
+                else
+                {
+                    OutputDevice.setActiveCameraUrl(modelData.cameraUrl)
+                }
             }
         }
     }

plugins/UM3NetworkPrinting/resources/qml/ExpandableCard.qml

@@ -16,9 +16,9 @@ Item
 
     property bool expanded: false
     property var borderWidth: 1
-    property color borderColor: "#EAEAEC"
+    property color borderColor: "#CCCCCC"
     property color headerBackgroundColor: "white"
-    property color headerHoverColor: "#f5f5f5"
+    property color headerHoverColor: "#e8f2fc"
     property color drawerBackgroundColor: "white"
     property alias headerItem: header.children
     property alias drawerItem: drawer.children

plugins/UM3NetworkPrinting/resources/qml/MonitorCarousel.qml

@@ -0,0 +1,251 @@
+// Copyright (c) 2018 Ultimaker B.V.
+// Cura is released under the terms of the LGPLv3 or higher.
+
+import QtQuick 2.3
+import QtQuick.Controls 2.0
+import QtGraphicalEffects 1.0
+import UM 1.3 as UM
+
+Item
+{
+    id: base
+
+    property var currentIndex: 0
+    property var tileWidth: 834 * screenScaleFactor // TODO: Theme!
+    property var tileHeight: 216 * screenScaleFactor // TODO: Theme!
+    property var tileSpacing: 60 * screenScaleFactor // TODO: Theme!
+    property var maxOffset: (OutputDevice.printers.length - 1) * (tileWidth + tileSpacing)
+
+    height: centerSection.height
+    width: maximumWidth
+
+    Item
+    {
+        id: leftHint
+        anchors
+        {
+            right: leftButton.left
+            rightMargin: 12 * screenScaleFactor // TODO: Theme!
+            left: parent.left
+        }
+        height: parent.height
+        z: 10
+        LinearGradient
+        {
+            anchors.fill: parent
+            start: Qt.point(0, 0)
+            end: Qt.point(leftHint.width, 0)
+            gradient: Gradient
+            {
+                GradientStop
+                {
+                    position: 0.0
+                    color: "#fff6f6f6" // TODO: Theme!
+                }
+                GradientStop
+                {
+                    position: 1.0
+                    color: "#66f6f6f6" // TODO: Theme!
+                }
+            }
+        }
+        MouseArea
+        {
+            anchors.fill: parent
+            onClicked: navigateTo(currentIndex - 1)
+        }
+    }
+
+    Button
+    {
+        id: leftButton
+        anchors
+        {
+            verticalCenter: parent.verticalCenter
+            right: centerSection.left
+            rightMargin: 12 * screenScaleFactor // TODO: Theme!
+        }
+        width: 36 * screenScaleFactor // TODO: Theme!
+        height: 72 * screenScaleFactor // TODO: Theme!
+        visible: currentIndex > 0
+        hoverEnabled: true
+        z: 10
+        onClicked: navigateTo(currentIndex - 1)
+        background: Rectangle
+        {
+            color: leftButton.hovered ? "#e8f2fc" : "#ffffff" // TODO: Theme!
+            border.width: 1 * screenScaleFactor // TODO: Theme!
+            border.color: "#cccccc" // TODO: Theme!
+            radius: 2 * screenScaleFactor // TODO: Theme!
+        }
+        contentItem: Item
+        {
+            anchors.fill: parent
+            UM.RecolorImage
+            {
+                anchors.centerIn: parent
+                width: 18 // TODO: Theme!
+                height: width // TODO: Theme!
+                sourceSize.width: width // TODO: Theme!
+                sourceSize.height: width // TODO: Theme!
+                color: "#152950" // TODO: Theme!
+                source: UM.Theme.getIcon("arrow_left")
+            }
+        }
+    }
+
+    Item
+    {
+        id: centerSection
+        anchors
+        {
+            verticalCenter: parent.verticalCenter
+            horizontalCenter: parent.horizontalCenter
+        }
+        width: tileWidth
+        height: tiles.height
+        z: 1
+
+        Row
+        {
+            id: tiles
+            height: childrenRect.height
+            width: 5 * tileWidth + 4 * tileSpacing // TODO: Theme!
+            x: 0
+            z: 0
+            Behavior on x
+            {
+                NumberAnimation
+                {
+                    duration: 200
+                    easing.type: Easing.InOutCubic
+                }
+            }
+            spacing: 60 * screenScaleFactor // TODO: Theme!
+            
+            Repeater
+            {
+                model: OutputDevice.printers
+                MonitorPrinterCard
+                {
+                    printer: modelData
+                    enabled: model.index == currentIndex
+                }
+            }
+        }
+    }
+
+    Button
+    {
+        id: rightButton
+        anchors
+        {
+            verticalCenter: parent.verticalCenter
+            left: centerSection.right
+            leftMargin: 12 * screenScaleFactor // TODO: Theme!
+        }
+        width: 36 * screenScaleFactor // TODO: Theme!
+        height: 72 * screenScaleFactor // TODO: Theme!
+        z: 10
+        visible: currentIndex < OutputDevice.printers.length - 1
+        onClicked: navigateTo(currentIndex + 1)
+        hoverEnabled: true
+        background: Rectangle
+        {
+            color: rightButton.hovered ? "#e8f2fc" : "#ffffff" // TODO: Theme!
+            border.width: 1 * screenScaleFactor // TODO: Theme!
+            border.color: "#cccccc" // TODO: Theme!
+            radius: 2 * screenScaleFactor // TODO: Theme!
+        }
+        contentItem: Item
+        {
+            anchors.fill: parent
+            UM.RecolorImage
+            {
+                anchors.centerIn: parent
+                width: 18 // TODO: Theme!
+                height: width // TODO: Theme!
+                sourceSize.width: width // TODO: Theme!
+                sourceSize.height: width // TODO: Theme!
+                color: "#152950" // TODO: Theme!
+                source: UM.Theme.getIcon("arrow_right")
+            }
+        }
+    }
+
+    Item
+    {
+        id: rightHint
+        anchors
+        {
+            left: rightButton.right
+            leftMargin: 12 * screenScaleFactor // TODO: Theme!
+            right: parent.right
+        }
+        height: centerSection.height
+        z: 10
+
+        LinearGradient
+        {
+            anchors.fill: parent
+            start: Qt.point(0, 0)
+            end: Qt.point(rightHint.width, 0)
+            gradient: Gradient
+            {
+                GradientStop
+                {
+                    position: 0.0
+                    color: "#66f6f6f6" // TODO: Theme!
+                }
+                GradientStop
+                {
+                    position: 1.0
+                    color: "#fff6f6f6" // TODO: Theme!
+                }
+            }
+        }
+        MouseArea
+        {
+            anchors.fill: parent
+            onClicked: navigateTo(currentIndex + 1)
+        }
+    }
+
+    Item
+    {
+        id: navigationDots
+        anchors
+        {
+            horizontalCenter: centerSection.horizontalCenter
+            top: centerSection.bottom
+            topMargin: 36 * screenScaleFactor // TODO: Theme!
+        }
+        Row
+        {
+            spacing: 8 * screenScaleFactor // TODO: Theme!
+            Repeater
+            {
+                model: OutputDevice.printers
+                Button
+                {
+                    background: Rectangle
+                    {
+                        color: model.index == currentIndex ? "#777777" : "#d8d8d8" // TODO: Theme!
+                        radius: Math.floor(width / 2)
+                        width: 12 * screenScaleFactor // TODO: Theme!
+                        height: width // TODO: Theme!
+                    }
+                    onClicked: navigateTo(model.index)
+                }
+            }
+        }
+    }
+
+    function navigateTo( i ) {
+        if (i >= 0 && i < OutputDevice.printers.length)
+        {
+            tiles.x = -1 * i * (tileWidth + tileSpacing)
+            currentIndex = i
+        }
+    }
+}

plugins/UM3NetworkPrinting/resources/qml/MonitorPrintJobCard.qml

@@ -26,7 +26,7 @@ Item
 
     ExpandableCard
     {
-        borderColor: printJob.configurationChanges.length !== 0 ? "#f5a623" : "#EAEAEC" // TODO: Theme!
+        borderColor: printJob.configurationChanges.length !== 0 ? "#f5a623" : "#CCCCCC" // TODO: Theme!
         headerItem: Row
         {
             height: 48 * screenScaleFactor // TODO: Theme!

plugins/UM3NetworkPrinting/resources/qml/MonitorPrinterCard.qml

@@ -25,8 +25,13 @@ Item
 
     property var borderSize: 1 * screenScaleFactor // TODO: Theme, and remove from here
 
+    // If the printer card's controls are enabled. This is used by the carousel
+    // to prevent opening the context menu or camera while the printer card is not
+    // "in focus"
+    property var enabled: true
+
     width: 834 * screenScaleFactor // TODO: Theme!
-    height: 216 * screenScaleFactor // TODO: Theme!
+    height: childrenRect.height
 
     // Printer portion
     Rectangle
@@ -34,7 +39,7 @@ Item
         id: printerInfo
         border
         {
-            color: "#EAEAEC" // TODO: Theme!
+            color: "#CCCCCC" // TODO: Theme!
             width: borderSize // TODO: Remove once themed
         }
         color: "white" // TODO: Theme!
@@ -124,6 +129,7 @@ Item
             printJob: printer.activePrintJob
             width: 36 * screenScaleFactor // TODO: Theme!
             height: 36 * screenScaleFactor // TODO: Theme!
+            enabled: base.enabled
         }
         CameraButton
         {
@@ -136,6 +142,7 @@ Item
                 bottomMargin: 20 * screenScaleFactor // TODO: Theme!
             }
             iconSource: "../svg/icons/camera.svg"
+            enabled: base.enabled
         }
     }
 
@@ -151,7 +158,7 @@ Item
         }
         border
         {
-            color: printer.activePrintJob && printer.activePrintJob.configurationChanges.length > 0 ? "#f5a623" : "#EAEAEC" // TODO: Theme!
+            color: printer.activePrintJob && printer.activePrintJob.configurationChanges.length > 0 ? "#f5a623" : "#CCCCCC" // TODO: Theme!
             width: borderSize // TODO: Remove once themed
         }
         color: "white" // TODO: Theme!
@@ -320,7 +327,7 @@ Item
             implicitHeight: 32 * screenScaleFactor // TODO: Theme!
             implicitWidth: 96 * screenScaleFactor // TODO: Theme!
             visible: printer.activePrintJob && printer.activePrintJob.configurationChanges.length > 0
-            onClicked: overrideConfirmationDialog.open()
+            onClicked: base.enabled ? overrideConfirmationDialog.open() : {}
         }
     }
 

plugins/UM3NetworkPrinting/resources/qml/MonitorStage.qml

@@ -49,32 +49,17 @@ Component
             }
         }
 
-        ScrollView
+        Item
         {
             id: printers
             anchors
             {
-                left: queue.left
-                right: queue.right
                 top: parent.top
                 topMargin: 48 * screenScaleFactor // TODO: Theme!
             }
+            width: parent.width
             height: 264 * screenScaleFactor // TODO: Theme!
-
+            MonitorCarousel {}
-            Row
-            {
-                spacing: 60 * screenScaleFactor // TODO: Theme!
-                
-                Repeater
-                {
-                    model: OutputDevice.printers
-
-                    MonitorPrinterCard
-                    {
-                        printer: modelData
-                    }
-                }
-            }
         }
 
         MonitorQueue

plugins/UM3NetworkPrinting/resources/qml/PrintJobContextMenu.qml

@@ -13,6 +13,7 @@ Item {
     property var printJob: null;
     property var started: isStarted(printJob);
     property var assigned: isAssigned(printJob);
+    property var enabled: true
 
     Button {
         id: button;
@@ -31,8 +32,8 @@ Item {
             verticalAlignment: Text.AlignVCenter;
         }
         height: width;
-        hoverEnabled: true;
+        hoverEnabled: base.enabled
-        onClicked: parent.switchPopupState();
+        onClicked: base.enabled ? parent.switchPopupState() : {}
         text: "\u22EE"; //Unicode; Three stacked points.
         visible: {
             if (!printJob) {

resources/themes/cura-light/theme.json

@@ -495,7 +495,7 @@
         "toolbox_back_button": [4.0, 2.0],
         "toolbox_installed_tile": [1.0, 8.0],
         "toolbox_property_label": [1.0, 2.0],
-        "toolbox_heading_label": [1.0, 4.0],
+        "toolbox_heading_label": [1.0, 3.8],
         "toolbox_header": [1.0, 4.0],
         "toolbox_header_highlight": [0.25, 0.25],
         "toolbox_progress_bar": [8.0, 0.5],