<Page
    x:Class="APKInstaller.Pages.SettingsPages.PairDevicePage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:APKInstaller.Controls"
    xmlns:converter="using:APKInstaller.Helpers.Converter"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:models="using:APKInstaller.Models"
    xmlns:sacm="using:AdvancedSharpAdbClient.Models"
    xmlns:settingspages="using:APKInstaller.ViewModels.SettingsPages"
    xmlns:sys="using:System"
    d:DataContext="{d:DesignInstance Type=settingspages:PairDeviceViewModel}"
    NavigationCacheMode="Enabled"
    mc:Ignorable="d">
    <Page.Resources>
        <ResourceDictionary>
            <converter:StringRegexToBoolConverter x:Key="StringRegexToBoolConverter" />
        </ResourceDictionary>
    </Page.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <controls:TitleBar
            x:Name="TitleBar"
            x:Uid="/PairDevicePage/TitleBar"
            BackRequested="TitleBar_BackRequested"
            IsBackButtonVisible="True"
            IsBackEnabled="{x:Bind Frame.CanGoBack}"
            IsRefreshButtonVisible="True"
            IsRefreshEnabled="True"
            RefreshRequested="TitleBar_RefreshRequested">
            <StackPanel Orientation="Horizontal">
                <Button
                    x:Name="QRScanButton"
                    x:Uid="/PairDevicePage/QRScanButton"
                    Margin="0,0,-8,0"
                    Content="&#xED14;"
                    Style="{StaticResource TitleBarIconButtonStyle}">
                    <Button.Flyout>
                        <Flyout Closed="Flyout_Closed" Opening="Flyout_Opening">
                            <Flyout.FlyoutPresenterStyle>
                                <Style BasedOn="{StaticResource DefaultFlyoutPresenterStyle}" TargetType="FlyoutPresenter">
                                    <Setter Property="Padding" Value="0" />
                                    <Setter Property="ScrollViewer.VerticalScrollMode" Value="Disabled" />
                                    <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Disabled" />
                                    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" />
                                    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
                                </Style>
                            </Flyout.FlyoutPresenterStyle>
                            <Grid Margin="4">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto" />
                                    <RowDefinition Height="Auto" />
                                </Grid.RowDefinitions>
                                <Grid
                                    Grid.Row="0"
                                    MaxWidth="200"
                                    Margin="0,12"
                                    HorizontalAlignment="Center">
                                    <TextBlock
                                        x:Uid="/PairDevicePage/QRScanTextBlock"
                                        HorizontalAlignment="Center"
                                        TextWrapping="Wrap"
                                        Visibility="{Binding ConnectingDevice, Converter={StaticResource BoolToVisibilityConverter}, ConverterParameter='true'}" />
                                    <TextBlock
                                        HorizontalAlignment="Center"
                                        Text="{Binding ConnectLogText}"
                                        TextWrapping="Wrap"
                                        Visibility="{Binding ConnectingDevice, Converter={StaticResource BoolToVisibilityConverter}}" />
                                </Grid>
                                <Grid
                                    Grid.Row="1"
                                    Width="200"
                                    Height="200"
                                    Margin="4"
                                    HorizontalAlignment="Center"
                                    CornerRadius="{StaticResource OverlayCornerRadius}">
                                    <controls:QRCode
                                        Padding="8"
                                        Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
                                        Content="{Binding QRCodeText}"
                                        Foreground="{ThemeResource ApplicationForegroundThemeBrush}"
                                        RequestedTheme="Light" />
                                    <Border CornerRadius="{StaticResource OverlayCornerRadius}" Visibility="{Binding ConnectingDevice, Converter={StaticResource BoolToVisibilityConverter}}">
                                        <Border.Background>
                                            <AcrylicBrush
                                                FallbackColor="{ThemeResource SystemChromeMediumHighColor}"
                                                TintColor="{ThemeResource ControlFillColorTransparent}"
                                                TintLuminosityOpacity="0"
                                                TintOpacity="0" />
                                        </Border.Background>
                                        <ProgressRing
                                            Width="50"
                                            Height="50"
                                            HorizontalAlignment="Center"
                                            VerticalAlignment="Center"
                                            IsActive="{Binding ConnectingDevice}" />
                                    </Border>
                                </Grid>
                            </Grid>
                        </Flyout>
                    </Button.Flyout>
                </Button>
                <Button
                    x:Uid="/PairDevicePage/ManualPairButton"
                    Margin="0,0,-8,0"
                    Content="&#xE710;"
                    Style="{StaticResource TitleBarIconButtonStyle}">
                    <Button.Flyout>
                        <Flyout>
                            <Flyout.FlyoutPresenterStyle>
                                <Style BasedOn="{StaticResource DefaultFlyoutPresenterStyle}" TargetType="FlyoutPresenter">
                                    <Setter Property="Padding" Value="0" />
                                    <Setter Property="ScrollViewer.VerticalScrollMode" Value="Disabled" />
                                    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" />
                                    <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto" />
                                    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
                                </Style>
                            </Flyout.FlyoutPresenterStyle>
                            <Grid MinWidth="{StaticResource SettingActionControlMinWidth}">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto" />
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>
                                <Grid Margin="12" ColumnSpacing="12">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="*" />
                                        <ColumnDefinition Width="Auto" />
                                    </Grid.ColumnDefinitions>
                                    <TextBlock
                                        x:Uid="/PairDevicePage/ManualPairTextBlock"
                                        VerticalAlignment="Center"
                                        Style="{ThemeResource BaseTextBlockStyle}" />
                                    <StackPanel
                                        Grid.Column="1"
                                        VerticalAlignment="Center"
                                        Orientation="Horizontal">
                                        <ToggleButton
                                            x:Name="PairToggleButton"
                                            x:Uid="/PairDevicePage/PairToggleButton"
                                            Padding="4,2"
                                            BorderThickness="1,1,0,1"
                                            CornerRadius="{Binding Source={StaticResource ControlCornerRadius}, Converter={StaticResource LeftCornerRadiusFilterConverter}}"
                                            FontSize="12"
                                            IsChecked="True" />
                                        <ToggleButton
                                            x:Name="ConnectToggleButton"
                                            x:Uid="/PairDevicePage/ConnectToggleButton"
                                            Padding="4,2"
                                            BorderThickness="0,1,1,1"
                                            CornerRadius="{Binding Source={StaticResource ControlCornerRadius}, Converter={StaticResource RightCornerRadiusFilterConverter}}"
                                            FontSize="12"
                                            IsChecked="{Binding IsChecked, ElementName=PairToggleButton, Converter={StaticResource BoolNegationConverter}, Mode=TwoWay}" />
                                    </StackPanel>
                                </Grid>
                                <Grid
                                    Grid.Row="1"
                                    Margin="12,0,12,12"
                                    RowSpacing="12">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="*" />
                                        <RowDefinition Height="Auto" />
                                    </Grid.RowDefinitions>
                                    <Grid
                                        Grid.Row="0"
                                        RowSpacing="8"
                                        Visibility="{Binding IsChecked, ElementName=PairToggleButton, Converter={StaticResource BoolToVisibilityConverter}}">
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto" />
                                            <RowDefinition Height="Auto" />
                                        </Grid.RowDefinitions>
                                        <TextBox
                                            x:Uid="/PairDevicePage/IPAddressBox"
                                            Grid.Row="0"
                                            PlaceholderText="127.0.0.1:58526"
                                            Text="{Binding IPAddress, Mode=TwoWay}"
                                            TextChanged="IPAddressBox_TextChanged" />
                                        <TextBox
                                            x:Uid="/PairDevicePage/PairCodeBox"
                                            Grid.Row="1"
                                            PlaceholderText="888888"
                                            Text="{Binding Code, Mode=TwoWay}" />
                                    </Grid>
                                    <Grid
                                        Grid.Row="0"
                                        RowSpacing="8"
                                        Visibility="{Binding IsChecked, ElementName=ConnectToggleButton, Converter={StaticResource BoolToVisibilityConverter}}">
                                        <TextBox
                                            x:Uid="/PairDevicePage/IPAddressBox"
                                            PlaceholderText="127.0.0.1:58526"
                                            Text="{Binding IPAddress, Mode=TwoWay}"
                                            TextChanged="IPAddressBox_TextChanged" />
                                    </Grid>
                                    <Grid Grid.Row="1" HorizontalAlignment="Right">
                                        <ProgressRing
                                            Width="24"
                                            Height="24"
                                            Margin="12,4"
                                            IsActive="{Binding ConnectingDevice}"
                                            Visibility="{Binding ConnectingDevice, Converter={StaticResource BoolToVisibilityConverter}}" />
                                        <Button
                                            x:Name="ConnectButton"
                                            x:Uid="/PairDevicePage/ConnectButton"
                                            Click="Button_Click"
                                            IsEnabled="{Binding IPAddress, Converter={StaticResource StringRegexToBoolConverter}, ConverterParameter={StaticResource IPAddressRegexPattern}}"
                                            Visibility="{Binding ConnectingDevice, Converter={StaticResource BoolToVisibilityConverter}, ConverterParameter='true'}" />
                                    </Grid>
                                </Grid>
                            </Grid>
                        </Flyout>
                    </Button.Flyout>
                </Button>
            </StackPanel>
        </controls:TitleBar>
        <Grid Grid.Row="1">
            <Grid.Resources>
                <Style TargetType="controls:SettingsGroup">
                    <Setter Property="Margin" Value="0,-28,0,0" />
                </Style>
            </Grid.Resources>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid.ChildrenTransitions>
                <TransitionCollection>
                    <ReorderThemeTransition />
                </TransitionCollection>
            </Grid.ChildrenTransitions>
            <ScrollViewer Grid.Row="0">
                <StackPanel Padding="16,0">
                    <StackPanel.ChildrenTransitions>
                        <TransitionCollection>
                            <ReorderThemeTransition />
                        </TransitionCollection>
                    </StackPanel.ChildrenTransitions>
                    <controls:SettingsGroup
                        Header="{x:Bind sys:String.Format(Provider.ConnectedListFormat, Provider.ConnectedList.Count), Mode=OneWay}"
                        ItemsSource="{x:Bind Provider.ConnectedList, Mode=OneWay}"
                        Visibility="{x:Bind Provider.ConnectedList, Converter={StaticResource CollectionVisibilityConverter}, Mode=OneWay}">
                        <controls:SettingsGroup.ItemTemplate>
                            <DataTemplate x:DataType="sacm:DeviceData">
                                <controls:Setting
                                    Description="{x:Bind State}"
                                    Header="{x:Bind Name}"
                                    Icon="&#xE8EA;" />
                            </DataTemplate>
                        </controls:SettingsGroup.ItemTemplate>
                    </controls:SettingsGroup>
                    <controls:SettingsGroup Margin="0,2,0,0" Visibility="{Binding ConnectInfoIsOpen, Converter={StaticResource BoolToVisibilityConverter}}">
                        <InfoBar
                            x:Name="ConnectInfo"
                            Title="{Binding ConnectInfoTitle, Mode=OneWay}"
                            IsOpen="{Binding ConnectInfoIsOpen, Mode=TwoWay}"
                            Severity="{Binding ConnectInfoSeverity, Mode=OneWay}" />
                    </controls:SettingsGroup>
                    <controls:SettingsGroup Header="{x:Bind sys:String.Format(Provider.DeviceListFormat, Provider.DeviceList.Count), Mode=OneWay}" ItemsSource="{x:Bind Provider.DeviceList, Mode=OneWay}">
                        <controls:SettingsGroup.ItemTemplate>
                            <DataTemplate x:DataType="models:MDNSDeviceData">
                                <controls:Setting Header="{x:Bind Name}" Icon="&#xE8EA;">
                                    <controls:Setting.Description>
                                        <TextBlock IsTextSelectionEnabled="True">
                                            <Run x:Uid="/PairDevicePage/AddressRun" />
                                            <Run Text="{x:Bind Address}" />
                                            <Run x:Uid="/PairDevicePage/PortRun" />
                                            <Run Text="{x:Bind Port}" />
                                        </TextBlock>
                                    </controls:Setting.Description>
                                    <Grid>
                                        <ProgressRing
                                            Width="24"
                                            Height="24"
                                            IsActive="{x:Bind ConnectingDevice, Mode=OneWay}"
                                            Visibility="{x:Bind ConnectingDevice, Converter={StaticResource BoolToVisibilityConverter}, Mode=OneWay}" />
                                        <Button
                                            x:Name="PairButton"
                                            Width="40"
                                            Height="36"
                                            HorizontalAlignment="Center"
                                            VerticalAlignment="Center"
                                            Click="Button_Click"
                                            Content="&#xE71B;"
                                            FontFamily="{StaticResource SymbolThemeFontFamily}"
                                            Tag="{x:Bind}"
                                            Visibility="{x:Bind ConnectingDevice, Converter={StaticResource BoolToVisibilityConverter}, ConverterParameter='true', Mode=OneWay}" />
                                    </Grid>
                                </controls:Setting>
                            </DataTemplate>
                        </controls:SettingsGroup.ItemTemplate>
                    </controls:SettingsGroup>
                </StackPanel>
            </ScrollViewer>
            <Grid
                Grid.Row="2"
                MinWidth="{StaticResource SettingCardContentMinWidth}"
                Padding="16,8"
                HorizontalAlignment="Right"
                ColumnSpacing="12">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <TextBlock x:Uid="/PairDevicePage/PairCodeTextBlock" VerticalAlignment="Center" />
                <TextBox
                    x:Name="CodeTextBox"
                    Grid.Column="1"
                    PlaceholderText="888888"
                    Text="{Binding Code, Mode=TwoWay}" />
            </Grid>
        </Grid>
    </Grid>
</Page>
