Replace entire monitor tab with a browser window that loads DF

plugins/UM3NetworkPrinting/resources/qml/MonitorStage.qml

@@ -1,84 +1,21 @@
 // Copyright (c) 2019 Ultimaker B.V.
 // Cura is released under the terms of the LGPLv3 or higher.
-
 import QtQuick 2.2
-import QtQuick.Controls 1.4
-import QtQuick.Controls.Styles 1.4
-import UM 1.3 as UM
-import Cura 1.0 as Cura
-import QtGraphicalEffects 1.0
+import QtWebEngine 1.4
 
-// This is the root component for the monitor stage.
 Component
 {
-    Rectangle
+    WebEngineView
     {
-        id: monitorFrame
-
-        height: maximumHeight
-        onVisibleChanged:
-        {
-            if (monitorFrame != null && !monitorFrame.visible)
-            {
-                OutputDevice.setActiveCameraUrl("")
+        id: webEngine
+        anchors.fill: parent
+        url: "https://digitalfactory.ultimaker.com/app/jobs/" + OutputDevice.key // visit the correct page automatically
+        userScripts: [
+            WebEngineScript {
+                injectionPoint: WebEngineScript.DocumentCreation
+                sourceUrl: Qt.resolvedUrl("modifications.js")
+                worldId: WebEngineScript.MainWorld
             }
-        }
-        width: maximumWidth
-        color: UM.Theme.getColor("monitor_stage_background")
-
-        // Enable keyboard navigation. NOTE: This is done here so that we can also potentially
-        // forward to the queue items in the future. (Deleting selected print job, etc.)
-        Keys.forwardTo: carousel
-        Component.onCompleted: forceActiveFocus()
-
-        UM.I18nCatalog
-        {
-            id: catalog
-            name: "cura"
-        }
-
-        Item
-        {
-            id: printers
-            anchors
-            {
-                top: parent.top
-                topMargin: 48 * screenScaleFactor // TODO: Theme!
-            }
-            width: parent.width
-            height: 264 * screenScaleFactor // TODO: Theme!
-            MonitorCarousel
-            {
-                id: carousel
-                printers:
-                {
-                    if (OutputDevice.receivedData)
-                    {
-                        return OutputDevice.printers
-                    }
-                    return [null]
-                }
-            }
-        }
-
-        MonitorQueue
-        {
-            id: queue
-            width: Math.min(834 * screenScaleFactor, maximumWidth)
-            anchors
-            {
-                bottom: parent.bottom
-                horizontalCenter: parent.horizontalCenter
-                top: printers.bottom
-                topMargin: 48 * screenScaleFactor // TODO: Theme!
-            }
-        }
-
-        PrinterVideoStream
-        {
-            anchors.fill: parent
-            cameraUrl: OutputDevice.activeCameraUrl
-            visible: OutputDevice.activeCameraUrl != ""
-        }
+	    ]
     }
 }

plugins/UM3NetworkPrinting/resources/qml/modifications.js

@@ -0,0 +1,32 @@
+/**
+ * Hides the whole header bar to prevent unwanted navigation.
+ */
+function hideApplicationHeader() {
+    const hideOnceExists = setInterval(function() {
+        const headers = document.getElementsByTagName('header');
+        if (headers.length) {
+            // the header bar now exists so we can remove it
+            headers[0].remove();
+            clearInterval(hideOnceExists);
+        }
+    }, 100);
+}
+
+/**
+ * Hide the cluster name as that is already shown in Cura's header bar.
+ */
+function hideClusterName() {
+    const hideOnceExists = setInterval(function() {
+        const headers = document.getElementsByClassName('print-jobs_cluster-name');
+        if (headers.length) {
+            // the header bar now exists so we can remove it
+            headers[0].remove();
+            clearInterval(hideOnceExists);
+        }
+    }, 100);
+}
+
+document.addEventListener('DOMContentLoaded', function() {
+    hideApplicationHeader();
+    hideClusterName();
+}, false);