<Page
    NavigationCacheMode="Enabled"
    x:Class="NixExampleWinUI.Views.MainPage"
    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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:views="using:NixExampleWinUI.Views"
    xmlns:helpers="using:NixExampleWinUI.Helpers"
    xmlns:nix="using:NixUniversalSDK"
    mc:Ignorable="d">

    <Page.Resources>
        <helpers:ScanModeToIntConverter x:Key="ScanModeToIntConverter"/>
        <helpers:NullableBooleanToBooleanConverter x:Key="NullableBooleanToBooleanConverter"/>
        <helpers:NullableBooleanToVisibilityConverter x:Key="NullableBooleanToVisibilityConverter"/>
        <helpers:InverseBooleanConverter x:Key="InverseBooleanConverter"/>
        <helpers:ValueConverterGroup x:Key="InvertAndConvertToVisibility">
            <helpers:InverseBooleanConverter/>
            <helpers:NullableBooleanToVisibilityConverter/>
        </helpers:ValueConverterGroup>        
    </Page.Resources>

    <Grid x:Name="ContentArea">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <InfoBar Grid.Row="0"
                 x:Name="InfoBar"
                 Margin="0,0,0,12"
                 VerticalAlignment="Top"
                 IsOpen="False">
            <InfoBar.ActionButton>
                <Button x:Name="CancelConnectButton"
                        x:Uid="Main_CancelConnectButton"
                        Visibility="{x:Bind ViewModel.IsDeviceConnecting, Mode=OneWay, Converter={StaticResource NullableBooleanToVisibilityConverter}}"
                        Click="CancelConnectButton_Click"/>
            </InfoBar.ActionButton>
        </InfoBar>

        <SplitView Grid.Row="1"
                   x:Name="SplitView"
                   Margin="0,0,0,24"
                   PaneBackground="{ThemeResource CardBackgroundFillColorDefault}"
                   PanePlacement="Right"
                   PaneOpening="SplitView_PaneOpening"
                   PaneClosed="SplitView_PaneClosed"
                   IsPaneOpen="{x:Bind ShowDevicesButton.IsChecked, Mode=TwoWay, Converter={StaticResource NullableBooleanToBooleanConverter}}"
                   OpenPaneLength="256" 
                   CompactPaneLength="48" 
                   DisplayMode="Inline">
            <SplitView.Pane>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>

                    <CommandBar Grid.Row="0"
                                Background="Transparent"
                                IsOpen="False"
                                DefaultLabelPosition="Right">
                        <CommandBar.Content>
                            <TextBlock x:Uid="Main_DevicesPaneHeader"
                                       Margin="8,12,0,0" Style="{StaticResource BaseTextBlockStyle}"
                                       VerticalAlignment="Center"/>
                        </CommandBar.Content>
                        <AppBarButton x:Name="RefreshButton"
                                      Label="{x:Bind ViewModel.ScannerRefreshLabel, Mode=OneWay}"
                                      Click="RefreshButton_Click">
                            <AppBarButton.Icon>
                                <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}"
                                          Glyph="{x:Bind ViewModel.ScannerRefreshGlyph, Mode=OneWay}"/>
                            </AppBarButton.Icon>
                        </AppBarButton>
                    </CommandBar>

                    <ProgressBar x:Name="DevicesListProgressBar"
                                 Grid.Row="1"
                                 VerticalAlignment="Top"
                                 IsIndeterminate="True"
                                 ShowPaused="False"
                                 ShowError="False"
                                 Visibility="{x:Bind ViewModel.IsSearching, Mode=OneWay, Converter={StaticResource NullableBooleanToVisibilityConverter}}"/>

                    <ListView Grid.Row="1"
                              Name="DevicesList"
                              ItemsSource="{x:Bind ViewModel.SortedDevices, Mode=OneWay}"
                              SelectionMode="Single"
                              IsItemClickEnabled="True"
                              ItemClick="DevicesList_ItemClick">
                        <ListView.ItemContainerTransitions>
                            <!--Overrides transition animations-->
                            <TransitionCollection/>
                        </ListView.ItemContainerTransitions>
                        <ListView.ItemTemplate>
                            <DataTemplate x:DataType="nix:IDeviceCompat">
                                <StackPanel Orientation="Horizontal" 
                                            Height="64" 
                                            AutomationProperties.Name="{x:Bind Name}">
                                    <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}"
                                              Glyph="{x:Bind helpers:DeviceHelper.GetIconGlyph(InterfaceType, Rssi)}"/>
                                    <StackPanel Orientation="Vertical" 
                                                VerticalAlignment="Center" 
                                                Margin="12,0,0,0">
                                        <TextBlock Text="{x:Bind Name}"
                                                   Style="{ThemeResource BaseTextBlockStyle}" 
                                                   Foreground="{ThemeResource SystemControlPageTextBaseHighBrush}" />
                                        <TextBlock Text="{x:Bind Id}" 
                                                   Style="{ThemeResource BodyTextBlockStyle}" 
                                                   Foreground="{ThemeResource SystemControlPageTextBaseMediumBrush}"/>
                                    </StackPanel>
                                </StackPanel>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
                </Grid>
            </SplitView.Pane>

            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" MinWidth="250"/>
                    <ColumnDefinition Width="300" MinWidth="250"/>
                </Grid.ColumnDefinitions>


                <RelativePanel Grid.Column="0">
                    <!-- Spectral plot container -->
                    <views:SpectralPlot x:Name="SpectralPlot"
                                           RelativePanel.AlignTopWithPanel="True"
                                           RelativePanel.AlignLeftWithPanel="True"
                                           RelativePanel.AlignRightWithPanel="True"
                                           RelativePanel.Above="ModeButtons"/>

                    <RadioButtons x:Name="ModeButtons"
                                  MaxColumns="3"
                                  Margin="0,4,0,0"
                                  SelectedIndex="{x:Bind ViewModel.SelectedMode, Mode=TwoWay, Converter={StaticResource ScanModeToIntConverter}}"
                                  HorizontalAlignment="Center"
                                  RelativePanel.AlignBottomWithPanel="True"
                                  RelativePanel.AlignLeftWithPanel="True"
                                  RelativePanel.AlignRightWithPanel="True">
                        <RadioButton x:Name="ModeButtonM0" 
                                     Content="M0" 
                                     IsEnabled="{x:Bind ViewModel.IsM0Available, Mode=OneWay}"/>
                        <RadioButton x:Name="ModeButtonM1" 
                                     Content="M1" 
                                     IsEnabled="{x:Bind ViewModel.IsM1Available, Mode=OneWay}"/>
                        <RadioButton x:Name="ModeButtonM2" 
                                     Content="M2" 
                                     IsEnabled="{x:Bind ViewModel.IsM2Available, Mode=OneWay}"/>
                    </RadioButtons>
                </RelativePanel>

                <RelativePanel Grid.Column="1"
                               Margin="12,0,0,0">

                    <!-- Measured color swatch -->
                    <views:ColorSwatch x:Name="MeasuredSwatch" 
                                        RelativePanel.Above="ScanButton"
                                        RelativePanel.AlignTopWithPanel="True"
                                        RelativePanel.AlignLeftWithPanel="True"
                                        RelativePanel.AlignRightWithPanel="True"/>

                    <!-- Progress indicator (shown during connection / measurement) -->
                    <ProgressRing x:Name="DeviceProgressRing"
                                  IsActive="{x:Bind ViewModel.IsDeviceBusy, Mode=OneWay}"
                                  RelativePanel.AlignHorizontalCenterWith="MeasuredSwatch"
                                  RelativePanel.AlignVerticalCenterWith="MeasuredSwatch"
                                  Width="48"
                                  Height="48"/>

                    <Button x:Name="ScanButton"
                            x:Uid="Main_ScanButton"
                            Visibility="{x:Bind ViewModel.IsDeviceSelected, Mode=OneWay, Converter={StaticResource NullableBooleanToVisibilityConverter}}"
                            IsEnabled="{x:Bind ViewModel.IsDeviceBusy, Mode=OneWay, Converter={StaticResource InverseBooleanConverter}}"
                            Click="ScanButton_Click"                            
                            Margin="0,12,0,0"
                            HorizontalAlignment="Stretch"
                            RelativePanel.AlignLeftWithPanel="True"
                            RelativePanel.AlignRightWithPanel="True"                            
                            RelativePanel.Above="ShowDevicesButton">
                        <Button.KeyboardAccelerators>
                            <KeyboardAccelerator Key="Space"/>
                        </Button.KeyboardAccelerators>
                    </Button>

                    <ToggleButton x:Name="ShowDevicesButton"
                                  x:Uid="Main_ShowDevicesButton"
                                  IsChecked="False"
                                  Visibility="{x:Bind ViewModel.IsDeviceSelected, Mode=OneWay, Converter={StaticResource InvertAndConvertToVisibility}}"
                                  Margin="0,12,0,0"
                                  HorizontalAlignment="Stretch"
                                  RelativePanel.AlignLeftWithPanel="True"
                                  RelativePanel.AlignRightWithPanel="True"
                                  RelativePanel.AlignBottomWithPanel="True"/>
                </RelativePanel>
            </Grid>            
        </SplitView>
    </Grid>
</Page>
