<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
    x:Class="FrymasterBadgeApp.EmployeePage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
    <Grid RowDefinitions="Auto, *">
        <Frame
            Grid.Row="0"
            Padding="10"
            BackgroundColor="{AppThemeBinding Light={StaticResource BgLight},
                                              Dark={StaticResource Tertiary}}"
            BorderColor="Transparent"
            CornerRadius="0"
            HasShadow="False">

            <VerticalStackLayout HorizontalOptions="Start" Spacing="15">
                <FlexLayout
                    AlignItems="Center"
                    Direction="Row"
                    JustifyContent="Start"
                    Wrap="Wrap">

                    <VerticalStackLayout Margin="5" WidthRequest="300">
                        <SearchBar
                            x:Name="EmployeeSearchBar"
                            BackgroundColor="Transparent"
                            HeightRequest="50"
                            Placeholder="Search Employee..."
                            PlaceholderColor="{StaticResource Gray500}"
                            TextChanged="OnSearchTextChanged"
                            TextColor="{StaticResource Gray500}" />
                    </VerticalStackLayout>

                    <HorizontalStackLayout>
                        <CheckBox
                            x:Name="ActiveFilterCheckBox"
                            Margin="0,0,10,0"
                            CheckedChanged="OnActiveFilterChanged"
                            IsChecked="True"
                            VerticalOptions="Center" />
                        <Label
                            Margin="0,0,40,0"
                            Text="Active Only"
                            VerticalOptions="Center" />
                    </HorizontalStackLayout>

                    <HorizontalStackLayout
                        x:Name="GuestImageSelector"
                        Margin="5"
                        IsVisible="False"
                        Spacing="5">
                        <Label Text="Guest Img:" VerticalOptions="Center" />
                        <Picker
                            x:Name="GuestImagePicker"
                            SelectedIndexChanged="OnGuestImageChanged"
                            TextColor="{DynamicResource AppTextColor}"
                            WidthRequest="130">
                            <Picker.Items>
                                <x:String>Guest.jpg</x:String>
                                <x:String>WelBilt.jpg</x:String>
                            </Picker.Items>
                        </Picker>
                    </HorizontalStackLayout>

                    <HorizontalStackLayout Margin="5" Spacing="5">
                        <Label Text="Badge Type:" VerticalOptions="Center" />
                        <Picker
                            x:Name="BadgeTypePicker"
                            SelectedIndexChanged="OnBadgeTypeChanged"
                            TextColor="{StaticResource Gray500}"
                            WidthRequest="150">
                            <Picker.Items>
                                <x:String>OFFICE</x:String>
                                <x:String>PLANT</x:String>
                                <x:String>MAINTENANCE</x:String>
                                <x:String>GUEST</x:String>
                                <x:String>VENDOR</x:String>
                            </Picker.Items>
                        </Picker>
                    </HorizontalStackLayout>

                    <HorizontalStackLayout Margin="5" Spacing="5">
                        <Label Text="Printer:" VerticalOptions="Center" />
                        <Picker
                            x:Name="PrinterPicker"
                            TextColor="{StaticResource Gray500}"
                            WidthRequest="180" />
                        <Button
                            BackgroundColor="Transparent"
                            Clicked="OnRefreshPrintersClicked"
                            Text="🔄"
                            TextColor="{StaticResource Gray500}" />
                    </HorizontalStackLayout>
                </FlexLayout>

                <FlexLayout
                    AlignItems="Center"
                    Direction="Row"
                    JustifyContent="Center"
                    Wrap="Wrap">
                    <Button
                        Margin="5"
                        Padding="20,0"
                        BackgroundColor="{StaticResource Success}"
                        Clicked="OnAddEmployeeClicked"
                        FontAttributes="Bold"
                        HeightRequest="45"
                        Text="+ Add Employee"
                        TextColor="White" />

                    <Button
                        x:Name="EditSelectedButton"
                        Margin="5"
                        BackgroundColor="{StaticResource Info}"
                        Clicked="OnEditEmployeeClicked"
                        FontAttributes="Bold"
                        HeightRequest="45"
                        Text="✎ Edit Selected"
                        TextColor="White"
                        WidthRequest="300" />

                    <Button
                        Padding="20,0"
                        BackgroundColor="{StaticResource Primary}"
                        Clicked="OnPrintClicked"
                        FontAttributes="Bold"
                        HeightRequest="45"
                        Text="PRINT BADGE"
                        TextColor="White" />
                </FlexLayout>
            </VerticalStackLayout>
        </Frame>

        <ScrollView Grid.Row="1" Padding="20">
            <VerticalStackLayout HorizontalOptions="Center" Spacing="20">
                <Frame
                    x:Name="PreviewFrame"
                    Padding="30"
                    BackgroundColor="Transparent"
                    BorderColor="{AppThemeBinding Light={StaticResource BorderLight},
                                                  Dark={StaticResource BorderDark}}"
                    CornerRadius="20"
                    HasShadow="True"
                    HorizontalOptions="Center" />

                <Button
                    BackgroundColor="{StaticResource Info}"
                    Clicked="OnTakePhotoClicked"
                    CornerRadius="10"
                    FontAttributes="Bold"
                    HeightRequest="50"
                    Text="📷 EDIT PHOTO"
                    TextColor="White"
                    WidthRequest="300" />
            </VerticalStackLayout>
        </ScrollView>

        <ListView
            x:Name="SearchResultsList"
            Grid.RowSpan="2"
            Margin="0,0,20,0"
            BackgroundColor="{AppThemeBinding Light={StaticResource White},
                                              Dark={StaticResource BgDark}}"
            HeightRequest="250"
            HorizontalOptions="Start"
            IsVisible="False"
            ItemSelected="OnEmployeeSelected"
            VerticalOptions="Start"
            WidthRequest="300"
            ZIndex="100">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <VerticalStackLayout Padding="10">
                            <Label
                                FontAttributes="Bold"
                                Text="{Binding [Data2]}"
                                TextColor="{StaticResource Gray500}" />
                            <Label
                                FontSize="12"
                                Text="{Binding [Data1]}"
                                TextColor="{StaticResource Gray500}" />
                        </VerticalStackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

        <Grid
            x:Name="PhotoEditorOverlay"
            Grid.RowSpan="2"
            BackgroundColor="#80000000"
            IsVisible="False">
            <Border
                Padding="25"
                HorizontalOptions="Center"
                Style="{StaticResource CardStyle}"
                VerticalOptions="Center"
                WidthRequest="450">
                <VerticalStackLayout Spacing="20">
                    <Label
                        FontAttributes="Bold"
                        FontSize="18"
                        HorizontalOptions="Center"
                        Text="PHOTO ADJUSTMENT" />
                    <Frame
                        Padding="0"
                        BackgroundColor="Black"
                        CornerRadius="10"
                        HeightRequest="300"
                        IsClippedToBounds="True"
                        WidthRequest="300">
                        <Image x:Name="EditorPhotoPreview" Aspect="AspectFill" />
                    </Frame>
                    <VerticalStackLayout Spacing="5">
                        <Label HorizontalOptions="Center" Text="Zoom Level" />
                        <Slider
                            x:Name="ZoomSlider"
                            Maximum="4"
                            Minimum="1"
                            Value="1" />
                    </VerticalStackLayout>
                    <Grid ColumnDefinitions="*, *" ColumnSpacing="15">
                        <Button
                            BackgroundColor="{StaticResource Secondary}"
                            Clicked="OnCancelPhoto"
                            Text="CANCEL"
                            TextColor="White" />
                        <Button
                            BackgroundColor="{StaticResource Success}"
                            Clicked="OnApplyPhoto"
                            Text="SAVE CROP"
                            TextColor="White" />
                    </Grid>
                </VerticalStackLayout>
            </Border>
        </Grid>
    </Grid>
</ContentPage>
