<UserControl
    x:Class="SHH.CameraDashboard.CameraList"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="clr-namespace:SHH.CameraDashboard"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    d:DesignHeight="600"
    d:DesignWidth="300"
    mc:Ignorable="d">

    <UserControl.Resources>
        <BooleanToVisibilityConverter x:Key="BoolToVis" />
    </UserControl.Resources>

    <Grid Background="{DynamicResource Brush.Bg.Panel}">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <ComboBox
            Grid.Row="0"
            Height="32"
            Margin="10,10,10,0"
            VerticalContentAlignment="Center"
            ItemsSource="{Binding NodeOptions}"
            SelectedItem="{Binding SelectedNode}">
            <ComboBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock FontWeight="SemiBold" Text="{Binding ServiceNodeName}" />
                        <TextBlock
                            Margin="5,0,0,0"
                            Foreground="Gray"
                            Text="{Binding ServiceNodeIp, StringFormat=' ({0})'}">
                            <TextBlock.Style>
                                <Style TargetType="TextBlock">
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding ServiceNodeIp}" Value="ALL">
                                            <Setter Property="Visibility" Value="Collapsed" />
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </TextBlock.Style>
                        </TextBlock>
                    </StackPanel>
                </DataTemplate>
            </ComboBox.ItemTemplate>
        </ComboBox>

        <Grid Grid.Row="1" Margin="10">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>

            <Border
                Padding="8,6"
                Background="{DynamicResource Brush.Bg.Input}"
                CornerRadius="4">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>

                    <TextBlock
                        Grid.Column="0"
                        Margin="0,0,5,0"
                        VerticalAlignment="Center"
                        Foreground="{DynamicResource Brush.Text.Secondary}"
                        Text="🔍" />

                    <TextBox
                        Grid.Column="1"
                        VerticalContentAlignment="Center"
                        Background="Transparent"
                        BorderThickness="0"
                        CaretBrush="{DynamicResource Brush.Text.Primary}"
                        FontSize="14"
                        Foreground="{DynamicResource Brush.Text.Primary}"
                        Text="{Binding SearchText, UpdateSourceTrigger=PropertyChanged}" />
                </Grid>
            </Border>

            <WrapPanel Grid.Column="1" Margin="0,5,0,0">
                <Button
                    Width="32"
                    Height="32"
                    Margin="5,0,0,0"
                    Command="{Binding AddCameraCommand}"
                    Style="{StaticResource Btn.Ghost.Info}"
                    ToolTip="添加新设备">
                    <Path
                        Width="16"
                        Height="16"
                        Data="{StaticResource Icon.Plus}"
                        Style="{StaticResource Style.IconPath}" />
                </Button>

                <Button
                    Width="32"
                    Height="32"
                    Margin="5,0,0,0"
                    Command="{Binding RefreshCommand}"
                    Style="{StaticResource Btn.Ghost.Info}"
                    ToolTip="重新加载数据">
                    <Path
                        Width="16"
                        Height="16"
                        Data="{StaticResource Icon.Refresh}"
                        Style="{StaticResource Style.IconPath}" />
                </Button>
            </WrapPanel>

        </Grid>

        <ListBox
            Grid.Row="2"
            HorizontalContentAlignment="Stretch"
            Background="Transparent"
            BorderThickness="0"
            ItemsSource="{Binding FilteredCameras}"
            ScrollViewer.HorizontalScrollBarVisibility="Disabled"
            SelectedItem="{Binding SelectedCamera}">

            <ListBox.ItemContainerStyle>
                <Style TargetType="ListBoxItem">
                    <Setter Property="Padding" Value="10,8" />
                    <Setter Property="Margin" Value="0,0,0,1" />
                    <Setter Property="Background" Value="Transparent" />
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="ListBoxItem">
                                <Grid Margin="0,0,0,1">
                                    <Border
                                        x:Name="bd"
                                        Margin="5,0"
                                        Background="Transparent"
                                        CornerRadius="4"
                                        Opacity="0" />
                                    <Border Padding="{TemplateBinding Padding}">
                                        <ContentPresenter />
                                    </Border>
                                </Grid>

                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter TargetName="bd" Property="Background" Value="{DynamicResource Brush.Text.Primary}" />
                                        <Setter TargetName="bd" Property="Opacity" Value="0.1" />
                                    </Trigger>

                                    <Trigger Property="IsSelected" Value="True">
                                        <Setter TargetName="bd" Property="Background" Value="{DynamicResource Brush.Brand}" />
                                        <Setter TargetName="bd" Property="Opacity" Value="0.2" />

                                        <Setter Property="Foreground" Value="{DynamicResource Brush.Brand}" />
                                        <Setter Property="FontWeight" Value="Bold" />
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </ListBox.ItemContainerStyle>

            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Margin="0,4">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <Border
                            Width="10"
                            Height="10"
                            Margin="0,0,10,0"
                            VerticalAlignment="Center"
                            CornerRadius="5">
                            <Border.Style>
                                <Style TargetType="Border">
                                    <Setter Property="Background" Value="#FF5555" />
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding IsPhysicalOnline}" Value="True">
                                            <Setter Property="Background" Value="#55FF55" />
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </Border.Style>
                        </Border>

                        <StackPanel Grid.Column="1" VerticalAlignment="Center">

                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="Auto" />
                                </Grid.ColumnDefinitions>

                                <WrapPanel>
                                    <TextBlock
                                        Grid.Column="0"
                                        VerticalAlignment="Center"
                                        FontSize="14"
                                        FontWeight="Bold">
                                        <TextBlock.Style>
                                            <Style TargetType="TextBlock">
                                                <Setter Property="Text" Value="{Binding Name}" />
                                                <Setter Property="Foreground" Value="{DynamicResource Brush.Text.Primary}" />
                                                <Style.Triggers>
                                                    <DataTrigger Binding="{Binding Name}" Value="">
                                                        <Setter Property="Text" Value="未命名" />
                                                        <Setter Property="Foreground" Value="{DynamicResource Brush.Text.Secondary}" />
                                                        <Setter Property="FontStyle" Value="Italic" />
                                                        <Setter Property="Opacity" Value="0.5" />
                                                    </DataTrigger>
                                                    <DataTrigger Binding="{Binding Name}" Value="{x:Null}">
                                                        <Setter Property="Text" Value="未命名" />
                                                        <Setter Property="Foreground" Value="{DynamicResource Brush.Text.Secondary}" />
                                                        <Setter Property="FontStyle" Value="Italic" />
                                                        <Setter Property="Opacity" Value="0.5" />
                                                    </DataTrigger>
                                                </Style.Triggers>
                                            </Style>
                                        </TextBlock.Style>
                                    </TextBlock>

                                    <TextBlock
                                        Margin="12,0,10,0"
                                        HorizontalAlignment="Center"
                                        FontSize="13"
                                        Foreground="{DynamicResource Brush.Text.Secondary}"
                                        Opacity="0.5"
                                        Text="{Binding Id}" />
                                </WrapPanel>

                                <Button
                                    Grid.Column="1"
                                    Width="24"
                                    Height="24"
                                    Margin="5,0,0,0"
                                    Background="Transparent"
                                    BorderThickness="0"
                                    ToolTip="{Binding Status}">

                                    <Path
                                        Width="14"
                                        Height="14"
                                        HorizontalAlignment="Center"
                                        VerticalAlignment="Center"
                                        Stretch="Uniform">
                                        <Path.Style>
                                            <Style TargetType="Path">
                                                <Setter Property="Data" Value="{StaticResource Icon.Action.Play}" />
                                                <Setter Property="Fill" Value="{DynamicResource Brush.Brand}" />

                                                <Style.Triggers>

                                                    <DataTrigger Binding="{Binding IsPhysicalOnline}" Value="False">
                                                        <Setter Property="Data" Value="{StaticResource Icon.Status.WifiOff}" />
                                                        <Setter Property="Fill" Value="{DynamicResource Brush.State.Danger}" />
                                                    </DataTrigger>

                                                    <DataTrigger Binding="{Binding Status}" Value="Connecting">
                                                        <Setter Property="Data" Value="{StaticResource Icon.Status.Loading}" />
                                                        <Setter Property="Fill" Value="{DynamicResource Brush.State.Warning}" />
                                                    </DataTrigger>
                                                    <DataTrigger Binding="{Binding Status}" Value="Authorizing">
                                                        <Setter Property="Data" Value="{StaticResource Icon.Status.Loading}" />
                                                        <Setter Property="Fill" Value="{DynamicResource Brush.State.Warning}" />
                                                    </DataTrigger>

                                                    <DataTrigger Binding="{Binding Status}" Value="Playing">
                                                        <Setter Property="Data" Value="{StaticResource Icon.Action.Pause}" />
                                                        <Setter Property="Fill" Value="{DynamicResource Brush.Status.Warning}" />
                                                    </DataTrigger>

                                                    <DataTrigger Binding="{Binding Status}" Value="Streaming">
                                                        <Setter Property="Data" Value="{StaticResource Icon.Action.Pause}" />
                                                        <Setter Property="Fill" Value="{DynamicResource Brush.Status.Warning}" />
                                                    </DataTrigger>

                                                </Style.Triggers>
                                            </Style>
                                        </Path.Style>
                                    </Path>
                                </Button>
                            </Grid>

                            <StackPanel Margin="0,2,0,0" Orientation="Horizontal">
                                <TextBlock
                                    FontSize="12"
                                    Foreground="{DynamicResource Brush.Text.Primary}"
                                    Text="{Binding IpAddress}" />
                                <TextBlock
                                    Margin="4,0"
                                    FontSize="12"
                                    Foreground="{DynamicResource Brush.Text.Secondary}"
                                    Opacity="0.3"
                                    Text="|" />
                                <TextBlock
                                    FontSize="12"
                                    Foreground="{DynamicResource Brush.Text.Secondary}"
                                    Opacity="0.7"
                                    Text="{Binding Brand}" />
                            </StackPanel>

                            <StackPanel Margin="0,2,0,0" Orientation="Horizontal">
                                <StackPanel.Style>
                                    <Style TargetType="StackPanel">
                                        <Setter Property="Visibility" Value="Collapsed" />
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Status}" Value="Playing">
                                                <Setter Property="Visibility" Value="Visible" />
                                            </DataTrigger>
                                            <DataTrigger Binding="{Binding Status}" Value="Streaming">
                                                <Setter Property="Visibility" Value="Visible" />
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </StackPanel.Style>

                                <TextBlock
                                    FontSize="11"
                                    Foreground="{DynamicResource Brush.Text.Secondary}"
                                    Opacity="0.6">
                                    <Run Foreground="{DynamicResource Brush.Text.Primary}" Text="{Binding Width}" />
                                    <Run Text="x" />
                                    <Run Foreground="{DynamicResource Brush.Text.Primary}" Text="{Binding Height}" />
                                </TextBlock>

                                <TextBlock Text="  " />

                                <TextBlock
                                    FontSize="11"
                                    Foreground="{DynamicResource Brush.Text.Secondary}"
                                    Opacity="0.6">
                                    <Run Text="FPS:" />
                                    <Run
                                        FontWeight="Bold"
                                        Foreground="{DynamicResource Brush.Text.Primary}"
                                        Text="{Binding RealFps}" />
                                </TextBlock>
                            </StackPanel>

                        </StackPanel>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

        <Grid
            Grid.Row="2"
            Background="{DynamicResource Brush.Bg.Panel}"
            Visibility="{Binding IsLoading, Converter={StaticResource BoolToVis}}">
            <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
                <ProgressBar
                    Width="100"
                    Height="4"
                    Margin="0,0,0,10"
                    IsIndeterminate="True" />
                <TextBlock
                    HorizontalAlignment="Center"
                    FontSize="12"
                    Foreground="{DynamicResource Brush.Text.Secondary}"
                    Text="正在同步数据..." />
            </StackPanel>
        </Grid>

    </Grid>
</UserControl>