// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause

// This file is part of the Qt Safe Renderer module

import QtQuick
import ".."
import ClusterDemo

Item {
    id: centerStack
    property int viewIndex: 4
    height: root.height - 173
    width: root.width / 2
    clip: true

    property alias fadeOutCenter: fadeOutCenter
    property alias fadeInCenter: fadeInCenter
    property alias loader: loader

    Loader {
        id: loader
        onStatusChanged: {
            if (status == Loader.Ready)
                fadeInCenter.start()
        }
        anchors.fill: parent
    }

    Component.onCompleted: {
        loader.source = "../MediaPlayerView.qml"
        // Start with car view, there is some kind of a problem when starting with any
        // other (It seems NoDraw doesn't work if this is not the first view)
        //loadCenterView(true) // We get the first change from signal
    }

    PropertyAnimation {
        id: fadeInCenter
        target: loader
        property: "opacity"
        from: 0.0
        to: 1.0
        duration: 400
        easing.type: Easing.Linear
    }

    PropertyAnimation {
        id: fadeOutCenter
        property: "opacity"
        from: 1.0
        to: 0.0
        duration: 250
        easing.type: Easing.Linear
        onStopped: {
            if (target === car) {
                car.visible = false
                car.item.hidden = true
            } else if (target === camera) {
                camera.visible = false
            }
            if (centerStack.viewIndex === carviewindex) {
                car.visible = true
                fadeInCenter.target = car
                car.item.hidden = false
                fadeInCenter.start()
            } else if (centerStack.viewIndex === videoviewindex) {
                camera.x = centerStack.x
                camera.y = centerStack.y
                camera.visible = true
                fadeInCenter.target = camera
                fadeInCenter.start()
            } else {
                fadeInCenter.target = loader
            }
            loader.source = component[centerStack.viewIndex]
        }
    }
}