<Page
    x:Class="PCUT.Pages.BannerManagement.BannerPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:PCUT.Pages.BannerManagement"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:viewmodels="using:PCUT.ViewModels"
    mc:Ignorable="d"
    Loaded="Page_Loaded">
    <Page.DataContext>
        <viewmodels:BannerViewModel/>
    </Page.DataContext>

    <Page.Transitions>
        <TransitionCollection>
            <EntranceThemeTransition />
        </TransitionCollection>
    </Page.Transitions>

    <Page.Background>
        <SolidColorBrush Color="White" />
    </Page.Background>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="0.1*"/>
            <RowDefinition Height="0.85*"/>
            <RowDefinition Height="0.05*"/>
        </Grid.RowDefinitions>

        <Grid Grid.Row="0">
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Button Content="Add" Width="120" 
                Background="{ThemeResource SystemAccentColor}" 
                CornerRadius="20"
                HorizontalAlignment="Right"
                Height="35"
                Click="AddBanner_Click"
                VerticalAlignment="Bottom"/>
            <TextBox
                Grid.Row="1"
                x:Name="Search"
                PlaceholderText="Search"
                Text="{Binding Pagination.SearchText, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                MinWidth="300" MaxHeight="32" CornerRadius="20"
                HorizontalAlignment="Right" VerticalAlignment="Center"/>
        </Grid>

        <ListView Grid.Row="1" x:Name="BannerListView" ItemsSource="{Binding FilteredBanners.Items}" IsItemClickEnabled="False">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="ListViewItem">
                                <ListViewItemPresenter ContentMargin="0" Padding="0"/>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </ListView.ItemContainerStyle>
            <ListView.Header>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="0.05*"/>
                        <ColumnDefinition Width="0.2*"/>
                        <ColumnDefinition Width="0.55*"/>
                        <ColumnDefinition Width="0.2*"/>
                    </Grid.ColumnDefinitions>
                    <Border Grid.Column="0" BorderBrush="Black" BorderThickness="1,1,0,1" Background="Gray">
                        <TextBlock Grid.Column="0" Text="No." Margin="10" Foreground="Black" FontFamily="/Fonts/#Rubik Medium" FontSize="20"/>
                    </Border>
                    <Border Grid.Column="1" BorderBrush="Black" BorderThickness="1,1,0,1" Background="Gray">
                        <TextBlock Grid.Column="1" Text="Name" Margin="10" Foreground="Black" FontFamily="/Fonts/#Rubik Medium" FontSize="20"
                       HorizontalAlignment="Center"/>
                    </Border>
                    <Border Grid.Column="2" BorderBrush="Black" BorderThickness="1,1,0,1" Background="Gray">
                        <TextBlock Text="Content" Margin="10" Foreground="Black" FontFamily="/Fonts/#Rubik Medium" FontSize="20"
                       HorizontalAlignment="Center"/>
                    </Border>
                    <Border Grid.Column="5" BorderBrush="Black" BorderThickness="1,1,1,1" Background="Gray">
                        <TextBlock Text="Action" Margin="10" Foreground="Black" FontFamily="/Fonts/#Rubik Medium" FontSize="20"
                       HorizontalAlignment="Center"/>
                    </Border>

                </Grid>
            </ListView.Header>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="0.05*"/>
                            <ColumnDefinition Width="0.2*"/>
                            <ColumnDefinition Width="0.55*"/>
                            <ColumnDefinition Width="0.2*"/>
                        </Grid.ColumnDefinitions>
                        <Border Grid.Column="0" BorderBrush="Black" BorderThickness="1,0,0,1">
                            <TextBlock Text="{Binding DisplayId, Mode=OneWay}" Margin="10" Foreground="Black" TextWrapping="Wrap" HorizontalAlignment="Center"/>
                        </Border>
                        <Border Grid.Column="1" BorderBrush="Black" BorderThickness="1,0,0,1">
                            <TextBlock Text="{Binding Name, Mode=OneWay}" Foreground="Black" TextWrapping="Wrap" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                        <Border Grid.Column="2" BorderBrush="Black" BorderThickness="1,0,0,1">
                            <TextBlock Text="{Binding Content , Mode=OneWay}"  Foreground="Black" TextWrapping="Wrap" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                        <Border Grid.Column="3" BorderBrush="Black" BorderThickness="1,0,1,1">
                            <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" >
                                <Button Margin="5" Click="EditBanner_Click" CommandParameter="{Binding Id}" HorizontalAlignment="Center">
                                    <FontIcon Glyph="&#xE70F;"/>
                                </Button>

                                <Button Margin="5" Click="DeleteBanner_Click" CommandParameter="{Binding Id}">
                                    <FontIcon Glyph="&#xE74D;"/>
                                </Button>
                            </StackPanel>
                        </Border>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

        <Grid Grid.Row="2">
            <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center">
                <Button x:Name="btnFirst" Content="First" Click="btnFirst_Click"/>
                <Button x:Name="btnPrevious" Content="Previous" Click="btnPrevious_Click"/>
                <TextBlock x:Name="txtPageNumber" VerticalAlignment="Center" Margin="10">
            <Run Text="{Binding Pagination.Page, Mode=OneWay}" />
            <Run Text="/" />
            <Run Text="{Binding Pagination.TotalPage, Mode=OneWay}" />
                </TextBlock>
                <Button x:Name="btnNext" Content="Next" Click="btnNext_Click"/>
                <Button x:Name="btnLast" Content="Last" Click="btnLast_Click"/>
                <ComboBox
            VerticalAlignment="Center"
            ItemsSource="{Binding Pagination.AvailablePageSizes}"
            SelectedItem="{Binding Pagination.PageSize, Mode=TwoWay}" />
                <TextBlock VerticalAlignment="Center" Text="records/page"/>
                <TextBlock  VerticalAlignment="Center">
            <Run Text=" (total" />
            <Run Text="{Binding Pagination.TotalRecords, Mode=TwoWay}" />
            <Run Text="records)" />
                </TextBlock>
            </StackPanel>
        </Grid>
    </Grid>
</Page>
