Add transition from importstatus to steam and back

qml/Components/Create/Create.qml

@@ -5,7 +5,6 @@ import QtQuick.Controls 2.2
 //Enums
 import LocalWorkshopCreationStatus 1.0
 
-
 Rectangle {
     id: create
     anchors.fill: parent
@@ -21,6 +20,7 @@ Rectangle {
         target: createWallpaper
         onFileSelected: {
             create.state = "import"
+            loader.active = true
             loader.setSource("CreateImport.qml", {
                                  file: file
                              })
@@ -36,6 +36,18 @@ Rectangle {
         }
     }
 
+    Connections {
+        target: loader.item
+        ignoreUnknownSignals: true
+        onBackToCreate: {
+            create.state = "create"
+            loader.active = false
+        }
+        onUploadToSteamWorkshop: {
+            loader.source = "CreateUpload.qml"
+        }
+    }
+
     LinearGradient {
         id: gradient
         anchors.fill: parent

qml/Components/Create/CreateImport.qml

@@ -9,13 +9,12 @@ Item {
     anchors.fill: parent
     state: "out"
     Component.onCompleted: state = "in"
+    property bool isVideoPlaying: true
     property url file
     onFileChanged: {
         timerSource.start()
     }
 
-    property bool isVideoPlaying: true
-
     Timer {
         id: timerSource
         interval: 1000
@@ -67,18 +66,7 @@ Item {
             source: player
             opengl: true
             fillMode: VideoOutput.Stretch
-//            MouseArea {
-//                id:maPlayer
-//                anchors.fill: parent
-//                hoverEnabled: true
-//                onPositionChanged: {
-//                    if (isVideoPlaying) {
-//                        player.seek((mouseX / videoOut.width) * player.duration)
-//                        busyIndicator.visible = true
-//                        sliVideoPosition.value = mouseX / videoOut.width
-//                    }
-//                }
-//            }
+
             Image {
                 id: imgPreview
                 anchors.fill: parent

qml/Components/Create/CreateImportStatus.qml

@@ -8,35 +8,50 @@ import LocalWorkshopCreationStatus 1.0
 Item {
     id: createImportStatus
     anchors.fill: parent
+    state: "out"
+
+    signal backToCreate
+    signal uploadToSteamWorkshop
+
+    Timer {
+        repeat: false
+        running: true
+        interval: 300
+        onTriggered: {
+            createImportStatus.state = "in"
+        }
+    }
+
     FontLoader {
         id: font_Roboto_Regular
         source: "qrc:/assets/fonts/Roboto-Regular.ttf"
     }
+
     Connections {
         target: steamWorkshop
         onLocalWorkshopCreationStatusChanged: {
             switch (status) {
             case LocalWorkshopCreationStatus.Started:
                 txtStatus.text = "Copy video started"
-               break;
+                break
             case LocalWorkshopCreationStatus.CopyVideoFinished:
                 txtStatus.text = "Copy Video Finished"
-               break;
+                break
             case LocalWorkshopCreationStatus.CopyImageFinished:
                 txtStatus.text = "Copy Image Finished"
-               break;
+                break
             case LocalWorkshopCreationStatus.CopyConfigFinished:
                 txtStatus.text = "Copy Config Finished"
-               break;
+                break
             case LocalWorkshopCreationStatus.ErrorCopyConfig:
                 txtStatus.text = "Error Copy Config!"
-               break;
+                break
             case LocalWorkshopCreationStatus.Finished:
-               txtStatus.text = "Finished"
+                txtStatus.text = "Success!"
                 busyIndicator.running = false
-               break;
+                break
             default:
-               break;
+                break
             }
         }
     }
@@ -72,10 +87,13 @@ Item {
 
         Text {
             id: txtStatus
+            height: 80
             font.family: font_Roboto_Regular.name
             renderType: Text.NativeRendering
-            font.pixelSize: 18
+            font.pixelSize: 24
             color: "gray"
+            verticalAlignment: Text.AlignVCenter
+            horizontalAlignment: Text.AlignHCenter
             anchors {
                 top: busyIndicator.bottom
                 topMargin: 10
@@ -87,9 +105,86 @@ Item {
             id: busyIndicator
             running: true
             anchors {
-                centerIn: parent
+                top: parent.top
+                topMargin: 100
+                horizontalCenter: parent.horizontalCenter
             }
         }
 
+        Row {
+            id: item1
+            width: 450
+            height: 49
+            spacing: 10
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.bottom: parent.bottom
+            anchors.bottomMargin: 20
+
+            Button {
+                id: button
+                text: qsTr("Create another Wallpaper")
+                onClicked: {
+                    backToCreate()
+                    createImportStatus.state = "out"
                 }
             }
+            Button {
+                id: button2
+                text: qsTr("Upload Wallpaper to Steam")
+                onClicked: {
+                    uploadToSteamWorkshop()
+                    createImportStatus.state = "in"
+                }
+            }
+        }
+    }
+    states: [
+        State {
+            name: "out"
+            PropertyChanges {
+                target: wrapper
+                anchors.topMargin: 500
+                opacity: 0
+            }
+            PropertyChanges {
+                target: effect
+                color: "transparent"
+                opacity: 0
+            }
+        },
+        State {
+            name: "in"
+            PropertyChanges {
+                target: wrapper
+                anchors.topMargin: 100
+                opacity: 1
+            }
+            PropertyChanges {
+                target: effect
+                color: "black"
+                opacity: 0.4
+            }
+        }
+    ]
+    transitions: [
+        Transition {
+            from: "out"
+            to: "in"
+            reversible: true
+            SequentialAnimation {
+                NumberAnimation {
+                    target: wrapper
+                    properties: "opacity, anchors.topMargin"
+                    duration: 200
+                    easing.type: Easing.InOutQuad
+                }
+                NumberAnimation {
+                    target: effect
+                    properties: "opacity, color"
+                    duration: 200
+                    easing.type: Easing.InOutQuad
+                }
+            }
+        }
+    ]
+}

qml/Components/Create/CreateUpload.qml

@@ -1,5 +1,14 @@
-import QtQuick 2.0
+import QtQuick 2.7
 
 Item {
+    anchors.fill: parent
+
+    Rectangle {
+        width: 100
+        height:100
+        anchors {
+            centerIn: parent
+        }
+    }
 
 }