Added popup functionality

KomplexHubContent/CMakeLists.txt

@@ -17,8 +17,7 @@ qt6_add_qml_module(KomplexHubContent
         "pages/SettingsPage.qml"
         "pages/UserProfilePage.qml"
         "pages/WallpaperSettingsPage.qml"
-        QML_FILES pages/VideoSearchPage.qml
+        "pages/VideoSearchPage.qml"
-        QML_FILES views/ImageView.qml
 )
 
 

KomplexHubContent/MainScreen.qml

@@ -14,6 +14,7 @@ import KomplexHubContent
 
 Rectangle {
     property MenuButton currentMenuButton
+    property bool popup: false
 
     id: windowRoot
 
@@ -35,9 +36,41 @@ Rectangle {
 
             color: palette.base.lighter()
 
+            ColumnLayout
+            {
+                height: popup ? 64 : 0
+                opacity: popup ? 1 : 0
+
+                MenuButton
+                {
+                    Layout.alignment: Qt.AlignTop
+
+                    height: 64
+                    width: 100
+                    text: qsTr("Back")
+
+                    icon.height: 32
+                    icon.width: 32
+                    icon.url: "qrc:/images/icons/icons8-reply-arrow.svg"
+
+                    onTriggered: () => {
+                        pageLoader.item.closePopup()
+                        selected = false
+                    }
+
+                    Behavior on opacity {
+                        NumberAnimation
+                        {
+                            duration: 250
+                        }
+                    }
+                }
+            }
+
             ColumnLayout {
+                opacity: popup ? 0 : 1
+                visible: opacity > 0.01
                 id: windowMenuLayout
-                anchors.fill: parent
 
                 MenuButton {
                     id: homeMenubutton
@@ -174,6 +207,13 @@ Rectangle {
                         searchContainer.preferredHeight = 0
                     }
                 }
+
+                Behavior on opacity {
+                    NumberAnimation
+                    {
+                        duration: 250
+                    }
+                }
             }
         }
 
@@ -250,6 +290,7 @@ Rectangle {
                                 {
                                     pageLoader.loading = false
                                     pageLoader.updateSearchTerm();
+                                    popupConnection.target = pageLoader.item
                                 }
                             }
                         }
@@ -334,6 +375,17 @@ Rectangle {
         opacity: 0
     }
 
+    Connections
+    {
+        id: popupConnection
+        target: pageLoader.item
+
+        function onPopupChanged()
+        {
+            windowRoot.popup = pageLoader.item.popup
+        }
+    }
+
     Component.onCompleted: () => {
         homeMenubutton.selected = true
         currentMenuButton = homeMenubutton