<Page
    x:Class="FlexChartExplorer.Introduction"
    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:Chart="using:C1.Xaml.Chart"
    xmlns:local="using:FlexChartExplorer"
    DataContext="{Binding RelativeSource={RelativeSource Mode=Self}}"
    mc:Ignorable="d">
    <Page.Resources>
        <local:EnumConverter x:Key="enumConverter" />
    </Page.Resources>
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.Resources>
            <Style TargetType="ComboBox">
                <Setter Property="VerticalAlignment" Value="Center" />
            </Style>
            <DataTemplate x:Key="cbPaletteTemplate">
                <TextBlock>
                    <TextBlock.Inlines>
                        <Run Text="{Binding Palette_Text, Source={StaticResource FlexChartExplorerLocalization}}"></Run>
                        <Run Text="{Binding}"></Run>
                    </TextBlock.Inlines>
                </TextBlock>
            </DataTemplate>
            <DataTemplate x:Key="cbStackedTemplate">
                <TextBlock>
                    <TextBlock.Inlines>
                        <Run Text="{Binding Stacking_Text, Source={StaticResource FlexChartExplorerLocalization}}"></Run>
                        <Run Text="{Binding}"></Run>
                    </TextBlock.Inlines>
                </TextBlock>
            </DataTemplate>
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition />
        </Grid.RowDefinitions>
        <StackPanel Orientation="Horizontal">
            <ComboBox Width="200" Margin="10 0" x:Name="cbPalette" 
                      ItemsSource="{Binding DataContext.Palettes}" 
                      ItemTemplate="{StaticResource cbPaletteTemplate}"
                      SelectedValue="{Binding ElementName=flexChart, Path=Palette, Mode=TwoWay, Converter={StaticResource enumConverter}, ConverterParameter=Palette}">
            </ComboBox>
            <CheckBox x:Name="cbRotate" Margin="10" Content="{Binding Rotate_Content, Source={StaticResource FlexChartExplorerLocalization}}"
                      IsChecked="{Binding ElementName=flexChart, Path=Rotated, Mode=TwoWay}">
            </CheckBox>
        </StackPanel>
        <ComboBox Width="200" Margin="10 0" Grid.Row="1" x:Name="cbStacked" 
                  ItemsSource="{Binding DataContext.Stackings}" 
                  ItemTemplate="{StaticResource cbStackedTemplate}"
                  SelectedValue="{Binding ElementName=flexChart, Path=Stacking, Mode=TwoWay, Converter={StaticResource enumConverter}, ConverterParameter=Stacking}">
        </ComboBox>
        <Chart:C1FlexChart x:Name="flexChart" ItemsSource="{Binding DataContext.Data}" BindingX="Fruit" LegendPosition="Bottom" Grid.Row="2">
            <Chart:C1FlexChart.Series>
                <Chart:Series SeriesName="March" Binding="March"></Chart:Series>
                <Chart:Series SeriesName="April" Binding="April"></Chart:Series>
                <Chart:Series SeriesName="May" Binding="May"></Chart:Series>
            </Chart:C1FlexChart.Series>
        </Chart:C1FlexChart>
    </Grid>
    <Page.BottomAppBar>
        <AppBar>
            <AppBar.Resources>
                <DataTemplate x:Key="cbChartTypeTemplate">
                    <TextBlock>
                        <TextBlock.Inlines>
                            <Run Text="{Binding Charttype_Text, Source={StaticResource FlexChartExplorerLocalization}}"></Run>
                            <Run Text="{Binding Value}"></Run>
                        </TextBlock.Inlines>
                    </TextBlock>
                </DataTemplate>
                <local:ChartTypeConverter ChartTypes="{Binding DataContext.ChartTypes}" x:Key="chartTypeConverter" />
            </AppBar.Resources>
            <ComboBox Width="210" x:Name="cbChartType" 
                      ItemsSource="{Binding DataContext.ChartTypes}" 
                      ItemTemplate="{StaticResource cbChartTypeTemplate}"
                      SelectedIndex="{Binding Path=DataContext.FlexChart.ChartType, Mode=TwoWay, Converter={StaticResource chartTypeConverter}}">
            </ComboBox>
        </AppBar>
    </Page.BottomAppBar>
</Page>
