import QtQuick
import QtQuick.Controls
import Quickshell
import Quickshell.Widgets
import Quickshell.Wayland
import Quickshell.Io
import "../../Common"
import "../../Services"

PanelWindow {
    id: controlCenterPopup
        
    visible: root.controlCenterVisible
    
    implicitWidth: 600
    implicitHeight: 500
    
    WlrLayershell.layer: WlrLayershell.Overlay
    WlrLayershell.exclusiveZone: -1
    WlrLayershell.keyboardFocus: WlrKeyboardFocus.None
    
    color: "transparent"
    
    anchors {
        top: true
        left: true
        right: true
        bottom: true
    }
    
    property int currentTab: 0 // 0: Network, 1: Audio, 2: Bluetooth, 3: Display
    property bool nightModeEnabled: false
    
    Rectangle {
        width: Math.min(600, parent.width - Theme.spacingL * 2)
        height: Math.min(500, parent.height - Theme.barHeight - Theme.spacingS * 2)
        x: Math.max(Theme.spacingL, parent.width - width - Theme.spacingL)
        y: Theme.barHeight + Theme.spacingS
        color: Theme.surfaceContainer
        radius: Theme.cornerRadiusLarge
        border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
        border.width: 1
        
        opacity: root.controlCenterVisible ? 1.0 : 0.0
        scale: root.controlCenterVisible ? 1.0 : 0.85
        
        Behavior on opacity {
            NumberAnimation {
                duration: Theme.mediumDuration
                easing.type: Theme.emphasizedEasing
            }
        }
        
        Behavior on scale {
            NumberAnimation {
                duration: Theme.mediumDuration
                easing.type: Theme.emphasizedEasing
            }
        }
        
        Column {
            anchors.fill: parent
            anchors.margins: Theme.spacingL
            spacing: Theme.spacingM
            
            // Header with tabs
            Column {
                width: parent.width
                spacing: Theme.spacingM
                
                Row {
                    width: parent.width
                    height: 32
                    
                    Text {
                        text: "Control Center"
                        font.pixelSize: Theme.fontSizeLarge
                        color: Theme.surfaceText
                        font.weight: Font.Medium
                        anchors.verticalCenter: parent.verticalCenter
                    }
                    
                    Item { width: parent.width - 200; height: 1 }
                }
                
                // Tab buttons
                Row {
                    width: parent.width
                    spacing: Theme.spacingXS
                    
                    Repeater {
                        model: {
                            let tabs = [
                                {name: "Network", icon: "wifi", id: "network", available: true}
                            ]
                            
                            // Always show audio
                            tabs.push({name: "Audio", icon: "volume_up", id: "audio", available: true})
                            
                            // Show Bluetooth only if available
                            if (root.bluetoothAvailable) {
                                tabs.push({name: "Bluetooth", icon: "bluetooth", id: "bluetooth", available: true})
                            }
                            
                            // Always show display
                            tabs.push({name: "Display", icon: "brightness_6", id: "display", available: true})
                            
                            return tabs
                        }
                        
                        Rectangle {
                            property int tabCount: {
                                let count = 3 // Network + Audio + Display (always visible)
                                if (root.bluetoothAvailable) count++
                                return count
                            }
                            width: (parent.width - Theme.spacingXS * (tabCount - 1)) / tabCount
                            height: 40
                            radius: Theme.cornerRadius
                            color: controlCenterPopup.currentTab === index ? 
                                   Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.16) : 
                                   tabArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : "transparent"
                            
                            Row {
                                anchors.centerIn: parent
                                spacing: Theme.spacingXS
                                
                                Text {
                                    text: modelData.icon
                                    font.family: Theme.iconFont
                                    font.pixelSize: Theme.iconSize - 4
                                    color: controlCenterPopup.currentTab === index ? Theme.primary : Theme.surfaceText
                                    anchors.verticalCenter: parent.verticalCenter
                                }
                                
                                Text {
                                    text: modelData.name
                                    font.pixelSize: Theme.fontSizeSmall
                                    color: controlCenterPopup.currentTab === index ? Theme.primary : Theme.surfaceText
                                    font.weight: controlCenterPopup.currentTab === index ? Font.Medium : Font.Normal
                                    anchors.verticalCenter: parent.verticalCenter
                                }
                            }
                            
                            MouseArea {
                                id: tabArea
                                anchors.fill: parent
                                hoverEnabled: true
                                cursorShape: Qt.PointingHandCursor
                                
                                onClicked: {
                                    controlCenterPopup.currentTab = index
                                }
                            }
                            
                            Behavior on color {
                                ColorAnimation {
                                    duration: Theme.shortDuration
                                    easing.type: Theme.standardEasing
                                }
                            }
                        }
                    }
                }
            }
            
            // Tab content area
            Rectangle {
                width: parent.width
                height: parent.height - 120
                radius: Theme.cornerRadius
                color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.08)
                
                // Network Tab
                NetworkTab {
                    anchors.fill: parent
                    anchors.margins: Theme.spacingM
                    visible: controlCenterPopup.currentTab === 0
                    
                    // Bind properties from root
                    networkStatus: root.networkStatus
                    wifiAvailable: root.wifiAvailable
                    wifiEnabled: root.wifiEnabled
                    ethernetIP: root.ethernetIP
                    currentWifiSSID: root.currentWifiSSID
                    wifiIP: root.wifiIP
                    wifiSignalStrength: root.wifiSignalStrength
                    wifiNetworks: root.wifiNetworks
                    wifiConnectionStatus: root.wifiConnectionStatus
                    wifiPasswordSSID: root.wifiPasswordSSID
                    wifiPasswordInput: root.wifiPasswordInput
                    wifiPasswordDialogVisible: root.wifiPasswordDialogVisible
                    
                    // Bind the auto-refresh flag
                    onWifiAutoRefreshEnabledChanged: {
                        root.wifiAutoRefreshEnabled = wifiAutoRefreshEnabled
                    }
                }
                
                // Audio Tab
                AudioTab {
                    anchors.fill: parent
                    anchors.margins: Theme.spacingM
                    visible: controlCenterPopup.currentTab === 1
                    
                    // Bind properties from root
                    volumeLevel: root.volumeLevel
                    micLevel: root.micLevel
                    currentAudioSink: root.currentAudioSink
                    currentAudioSource: root.currentAudioSource
                    audioSinks: root.audioSinks
                    audioSources: root.audioSources
                }
                
                // Bluetooth Tab
                BluetoothTab {
                    anchors.fill: parent
                    anchors.margins: Theme.spacingM
                    visible: controlCenterPopup.currentTab === 2
                    
                    // Bind properties from root
                    bluetoothEnabled: root.bluetoothEnabled
                    bluetoothDevices: root.bluetoothDevices
                }
                
                // Display Tab
                DisplayTab {
                    anchors.fill: parent
                    anchors.margins: Theme.spacingM
                    visible: controlCenterPopup.currentTab === 3
                    
                    // Bind properties from parent
                    nightModeEnabled: controlCenterPopup.nightModeEnabled
                    
                    // Sync night mode state back to parent
                    onNightModeEnabledChanged: {
                        controlCenterPopup.nightModeEnabled = nightModeEnabled
                    }
                }
            }
        }
    }

    // Click outside to close
    MouseArea {
        anchors.fill: parent
        z: -1
        onClicked: {
            root.controlCenterVisible = false
        }
    }
}