[sysui] Move the modal overlay into its own component

And remove the unnecessary background Image while at it.
This was needed in the past by looks like it's no longer
the case as Display has this background image internally.

Change-Id: I911e97cbbdec86910b5c8b9cb9d7a42efa10db75
Reviewed-by: Lukáš Tinkl <ltinkl@luxoft.com>

3 files changed, 84 insertions, 43 deletions

diff --git a/Main.qml b/Main.qml
index f2b3f3bd..38fddf8b 100644
--- a/Main.qml
+++ b/Main.qml
@@ -30,7 +30,6 @@
 ****************************************************************************/
 
 import QtQuick 2.7
-import QtGraphicalEffects 1.0
 import QtQuick.Controls 2.2
 
 import animations 1.0
@@ -219,50 +218,10 @@ Window {
         }
     }
 
-    // We can't use Popup from QtQuick.Controls as it doesn't support a rotated scene,
-    // hence the implementation of our own modal overlay scheme
-    Item {
+    ModalOverlay {
         id: popupParent
         anchors.fill: display
-        rotation: display.rotation
-
-        property bool showModalOverlay
-        onShowModalOverlayChanged: {
-            effectSource.scheduleUpdate();
-        }
-
-        signal overlayClicked()
-
-        // TODO: Load only when needed
-        MouseArea {
-            anchors.fill: parent
-            visible: opacity > 0
-            opacity: popupParent.showModalOverlay ? 1 : 0
-            Behavior on opacity { DefaultNumberAnimation {}  }
-            Image {
-                anchors.fill: parent
-                source: Style.gfx2(NeptuneStyle.backgroundImage)
-                FastBlur {
-                    anchors.fill: parent
-                    radius: Style.hspan(1)
-                    source: ShaderEffectSource {
-                        id: effectSource
-                        sourceItem: display
-                        live: false
-                    }
-                }
-            }
-            z: -2
-            onClicked: popupParent.overlayClicked()
-        }
-
-        Rectangle {
-            anchors.fill: parent
-            color: "black"
-            opacity: popupParent.showModalOverlay ? 0.3 : 0
-            Behavior on opacity { DefaultNumberAnimation {}  }
-            z: -1
-        }
+        target: display
     }
 
     // System Monitor Overlay
diff --git a/sysui/display/ModalOverlay.qml b/sysui/display/ModalOverlay.qml
new file mode 100644
index 00000000..4096fdbc
--- /dev/null
+++ b/sysui/display/ModalOverlay.qml
@@ -0,0 +1,81 @@
+/****************************************************************************
+**
+** Copyright (C) 2018 Pelagicore AG
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the Neptune 3 IVI UI.
+**
+** $QT_BEGIN_LICENSE:GPL-QTAS$
+** Commercial License Usage
+** Licensees holding valid commercial Qt Automotive Suite licenses may use
+** this file in accordance with the commercial license agreement provided
+** with the Software or, alternatively, in accordance with the terms
+** contained in a written agreement between you and The Qt Company.  For
+** licensing terms and conditions see https://www.qt.io/terms-conditions.
+** For further information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU
+** General Public License version 3 or (at your option) any later version
+** approved by the KDE Free Qt Foundation. The licenses are as published by
+** the Free Software Foundation and appearing in the file LICENSE.GPL3
+** included in the packaging of this file. Please review the following
+** information to ensure the GNU General Public License requirements will
+** be met: https://www.gnu.org/licenses/gpl-3.0.html.
+**
+** $QT_END_LICENSE$
+**
+** SPDX-License-Identifier: GPL-3.0
+**
+****************************************************************************/
+
+import QtQuick 2.10
+import QtGraphicalEffects 1.0
+
+import animations 1.0
+import com.pelagicore.styles.neptune 3.0
+
+// We can't use Popup from QtQuick.Controls as it doesn't support a rotated scene,
+// hence the implementation of our own modal overlay scheme
+Item {
+    id: root
+
+    // The item to be covered by the overlay
+    property Item target
+
+    rotation: target ? target.rotation : 0
+
+    property bool showModalOverlay
+    onShowModalOverlayChanged: {
+        effectSource.scheduleUpdate();
+    }
+
+    signal overlayClicked()
+
+    // TODO: Load only when needed
+    MouseArea {
+        anchors.fill: parent
+        visible: opacity > 0
+        opacity: root.showModalOverlay ? 1 : 0
+        Behavior on opacity { DefaultNumberAnimation {}  }
+        FastBlur {
+            anchors.fill: parent
+            radius: NeptuneStyle.dp(45)
+            source: ShaderEffectSource {
+                id: effectSource
+                sourceItem: root.target
+                live: false
+            }
+        }
+        z: -2
+        onClicked: root.overlayClicked()
+    }
+
+    Rectangle {
+        anchors.fill: parent
+        color: "black"
+        opacity: root.showModalOverlay ? 0.3 : 0
+        Behavior on opacity { DefaultNumberAnimation {}  }
+        z: -1
+    }
+}
diff --git a/sysui/display/qmldir b/sysui/display/qmldir
index b690f32e..2ee2d5b1 100644
--- a/sysui/display/qmldir
+++ b/sysui/display/qmldir
@@ -1,4 +1,5 @@
 ApplicationFrame 1.0 ApplicationFrame.qml
 Display 1.0 Display.qml
+ModalOverlay 1.0 ModalOverlay.qml
 WidgetDrawer 1.0 WidgetDrawer.qml
 VirtualKeyboard 1.0 VirtualKeyboard.qml