import QtQuick 6.8
import QtQuick.Controls 6.8
import QtQuick.Controls.Basic 6.8
import QtQuick.Layouts 6.8
import QYRComponents 1.0

ColumnLayout {
    Layout.alignment: Qt.AlignVCenter
    Layout.fillWidth: true

    property string title: ""
    property string streamURL: ""
    property string metaURL: ""

    Label {
        Layout.fillWidth: true
        Layout.bottomMargin: 20
        text: title
        heading: "h2"
        horizontalAlignment: Text.AlignHCenter
    }

    Label {
        Layout.fillWidth: true
        text: "Title: "
        heading: "h3"
        horizontalAlignment: Text.AlignHCenter
    }

    Label {
        Layout.fillWidth: true
        text: "Artist: "
        heading: "h3"
        horizontalAlignment: Text.AlignHCenter
    }

    Label {
        Layout.fillWidth: true
        text: "Genre: "
        heading: "h3"
        horizontalAlignment: Text.AlignHCenter
    }

    Label {
        Layout.fillWidth: true
        text: "Bitrate: " + " kbps"
        heading: "h3"
        horizontalAlignment: Text.AlignHCenter
    }

    Label {
        Layout.fillWidth: true
        text: "Listeners: "
        heading: "h3"
        horizontalAlignment: Text.AlignHCenter
    }

    RowLayout {
        Layout.fillWidth: false
        Layout.topMargin: 20
        Layout.alignment: Qt.AlignHCenter
        width: 220
        
        Button {
            Layout.rightMargin: 5
            text: Player.loading ? "Loading" : (Player.playing ? "Pause" : "Play")

            onClicked: function() {
                if (Player.playing) {
                    Player.stopPlaying();
                } else {
                    Player.startPlaying(parent.parent.streamURL);
                }
            }
        }

        Slider {
            Layout.fillWidth: true
            Layout.leftMargin: 5
            from: 0.1
            to: 1.1
            stepSize: 0.1
            value: Player.volume + 0.1
            onMoved: Player.volume = value - 0.1
        }
    }

    Item {
        Layout.fillHeight: true
    }
}