<!--
  // (c) Copyright Microsoft Corporation.
  // This source is subject to the Microsoft Public License (Ms-PL).
  // Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
  // All other rights reserved.
-->

<ResourceDictionary xmlns="https://github.com/avaloniaui"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:sys="using:System">
  <Design.PreviewWith>
    <Border Height="500"
            Padding="20">
      <StackPanel VerticalAlignment="Center"
                  Spacing="20">
        <TimePicker />
        <TimePicker CornerRadius="10" />
        <TimePicker IsEnabled="False" />
        <TimePicker>
          <DataValidationErrors.Error>
            <sys:Exception>
              <x:Arguments>
                <x:String>Error</x:String>
              </x:Arguments>
            </sys:Exception>
          </DataValidationErrors.Error>
        </TimePicker>
      </StackPanel>
    </Border>
  </Design.PreviewWith>

  <x:Double x:Key="TimePickerFlyoutPresenterItemHeight">40</x:Double>
  <x:Double x:Key="TimePickerSpacerThemeWidth">1</x:Double>
  <Thickness x:Key="TimePickerBorderThemeThickness">1</Thickness>
  <x:Double x:Key="TimePickerFlyoutPresenterHighlightHeight">40</x:Double>
  <x:Double x:Key="TimePickerFlyoutPresenterAcceptDismissHostGridHeight">41</x:Double>
  <x:Double x:Key="TimePickerThemeMinWidth">242</x:Double>
  <x:Double x:Key="TimePickerThemeMaxWidth">456</x:Double>
  <Thickness x:Key="TimePickerFlyoutPresenterItemPadding">0,3,0,6</Thickness>
  <Thickness x:Key="TimePickerHostPadding">0,3,0,6</Thickness>

  <ControlTheme x:Key="SimpleTimePickerFlyoutButton"
                TargetType="Button">
    <Setter Property="RenderTransform" Value="none" />
    <Setter Property="Template">
      <ControlTemplate>
        <ContentPresenter Name="PART_ContentPresenter"
                          HorizontalContentAlignment="Stretch"
                          VerticalContentAlignment="Stretch"
                          Background="{TemplateBinding Background}"
                          BorderBrush="{TemplateBinding BorderBrush}"
                          BorderThickness="{TemplateBinding BorderThickness}"
                          Content="{TemplateBinding Content}"
                          CornerRadius="{TemplateBinding CornerRadius}"
                          Foreground="{TemplateBinding Foreground}" />
      </ControlTemplate>
    </Setter>

    <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
      <Setter Property="BorderBrush" Value="{DynamicResource ThemeControlHighBrush}" />
      <Setter Property="TextElement.Foreground" Value="{DynamicResource ThemeForegroundBrush}" />
    </Style>

    <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
      <Setter Property="Background">
        <SolidColorBrush Opacity="0.6"
                         Color="{DynamicResource ThemeControlMidHighColor}" />
      </Setter>
      <Setter Property="BorderBrush" Value="{DynamicResource ThemeControlLowBrush}" />
      <Setter Property="TextElement.Foreground" Value="{DynamicResource ThemeForegroundBrush}" />
    </Style>

    <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
      <Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}" />
    </Style>
  </ControlTheme>

  <ControlTheme x:Key="{x:Type TimePicker}"
                TargetType="TimePicker">
    <Setter Property="FontSize" Value="{DynamicResource FontSizeNormal}" />
    <Setter Property="Foreground" Value="{DynamicResource ThemeForegroundBrush}" />
    <Setter Property="Background" Value="{DynamicResource ThemeBackgroundBrush}" />
    <Setter Property="BorderBrush" Value="{DynamicResource ThemeControlHighlightMidBrush}" />
    <Setter Property="BorderThickness" Value="{DynamicResource TimePickerBorderThemeThickness}" />
    <Setter Property="HorizontalAlignment" Value="Left" />
    <Setter Property="VerticalAlignment" Value="Center" />
    <Setter Property="Template">
      <ControlTemplate>
        <DataValidationErrors>
          <Grid Name="LayoutRoot"
                Margin="{TemplateBinding Padding}">
            <Button x:Name="PART_FlyoutButton"
                    MinWidth="{DynamicResource TimePickerThemeMinWidth}"
                    MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
                    HorizontalAlignment="Stretch"
                    VerticalAlignment="Top"
                    Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    CornerRadius="{TemplateBinding CornerRadius}"
                    Foreground="{TemplateBinding Foreground}"
                    IsEnabled="{TemplateBinding IsEnabled}"
                    Theme="{StaticResource SimpleTimePickerFlyoutButton}">

              <Grid Name="PART_FlyoutButtonContentGrid">
                <!--  Ignore col defs here, set in code  -->
                <Border x:Name="PART_FirstPickerHost"
                        Grid.Column="0"
                        HorizontalAlignment="Stretch"
                        VerticalAlignment="Stretch">
                  <TextBlock x:Name="PART_HourTextBlock"
                             Padding="{DynamicResource TimePickerHostPadding}"
                             HorizontalAlignment="Center"
                             FontFamily="{TemplateBinding FontFamily}"
                             FontSize="{TemplateBinding FontSize}"
                             FontWeight="{TemplateBinding FontWeight}" />
                </Border>

                <Rectangle Name="PART_FirstColumnDivider"
                           Grid.Column="1"
                           Width="{DynamicResource TimePickerSpacerThemeWidth}"
                           HorizontalAlignment="Center"
                           Fill="{DynamicResource TimePickerSpacerFill}" />

                <Border x:Name="PART_SecondPickerHost"
                        Grid.Column="2"
                        HorizontalAlignment="Stretch"
                        VerticalAlignment="Stretch">
                  <TextBlock x:Name="PART_MinuteTextBlock"
                             Padding="{DynamicResource TimePickerHostPadding}"
                             HorizontalAlignment="Center"
                             FontFamily="{TemplateBinding FontFamily}"
                             FontSize="{TemplateBinding FontSize}"
                             FontWeight="{TemplateBinding FontWeight}" />
                </Border>

                <Rectangle Name="PART_SecondColumnDivider"
                           Grid.Column="3"
                           Width="{DynamicResource TimePickerSpacerThemeWidth}"
                           HorizontalAlignment="Center"
                           Fill="{DynamicResource TimePickerSpacerFill}" />

                <Border x:Name="PART_ThirdPickerHost"
                        Grid.Column="4"
                        HorizontalAlignment="Stretch"
                        VerticalAlignment="Stretch">
                  <TextBlock x:Name="PART_PeriodTextBlock"
                             Padding="{DynamicResource TimePickerHostPadding}"
                             HorizontalAlignment="Center"
                             FontFamily="{TemplateBinding FontFamily}"
                             FontSize="{TemplateBinding FontSize}"
                             FontWeight="{TemplateBinding FontWeight}" />
                </Border>
              </Grid>
            </Button>

            <Popup Name="PART_Popup"
                   IsLightDismissEnabled="True"
                   Placement="Bottom"
                   PlacementTarget="{TemplateBinding}"
                   WindowManagerAddShadowHint="False">
              <TimePickerPresenter Name="PART_PickerPresenter" />
            </Popup>

          </Grid>
        </DataValidationErrors>
      </ControlTemplate>
    </Setter>

    <Style Selector="^:disabled /template/ Rectangle">
      <Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}" />
    </Style>

    <Style Selector="^:hasnotime /template/ Button#PART_FlyoutButton TextBlock">
      <Setter Property="Foreground" Value="{DynamicResource ThemeForegroundLowBrush}" />
    </Style>
  </ControlTheme>

  <ControlTheme x:Key="{x:Type TimePickerPresenter}"
                TargetType="TimePickerPresenter">
    <Setter Property="Width" Value="242" />
    <Setter Property="MinWidth" Value="242" />
    <Setter Property="MaxHeight" Value="398" />
    <Setter Property="FontWeight" Value="Normal" />
    <Setter Property="Background" Value="{DynamicResource ThemeBackgroundBrush}" />
    <Setter Property="BorderBrush" Value="{DynamicResource ThemeBorderMidBrush}" />
    <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
    <Setter Property="Template">
      <ControlTemplate>
        <Border Name="Background"
                MaxHeight="398"
                Padding="{DynamicResource DateTimeFlyoutBorderPadding}"
                Background="{TemplateBinding Background}"
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}"
                CornerRadius="{TemplateBinding CornerRadius}">
          <Grid Name="ContentPanel"
                RowDefinitions="*,Auto">
            <Grid Name="PART_PickerContainer">
              <!--  Ignore col defs here, set in code  -->
              <Panel Name="PART_HourHost"
                     Grid.Column="0">
                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
                              VerticalScrollBarVisibility="Hidden">
                  <DateTimePickerPanel Name="PART_HourSelector"
                                       ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"
                                       PanelType="Hour"
                                       ShouldLoop="True" />
                </ScrollViewer>
                <RepeatButton Name="PART_HourUpButton"
                              Theme="{StaticResource SimpleDateTimePickerUpButton}" />
                <RepeatButton Name="PART_HourDownButton"
                              Theme="{StaticResource SimpleDateTimePickerDownButton}" />
              </Panel>

              <Panel Name="PART_MinuteHost"
                     Grid.Column="2">
                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
                              VerticalScrollBarVisibility="Hidden">
                  <DateTimePickerPanel Name="PART_MinuteSelector"
                                       ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"
                                       PanelType="Minute"
                                       ShouldLoop="True" />
                </ScrollViewer>
                <RepeatButton Name="PART_MinuteUpButton"
                              Theme="{StaticResource SimpleDateTimePickerUpButton}" />
                <RepeatButton Name="PART_MinuteDownButton"
                              Theme="{StaticResource SimpleDateTimePickerDownButton}" />
              </Panel>

              <Panel Name="PART_PeriodHost"
                     Grid.Column="4">
                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
                              VerticalScrollBarVisibility="Hidden">
                  <DateTimePickerPanel Name="PART_PeriodSelector"
                                       ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"
                                       PanelType="TimePeriod"
                                       ShouldLoop="False" />
                </ScrollViewer>
                <RepeatButton Name="PART_PeriodUpButton"
                              Theme="{StaticResource SimpleDateTimePickerUpButton}" />
                <RepeatButton Name="PART_PeriodDownButton"
                              Theme="{StaticResource SimpleDateTimePickerDownButton}" />
              </Panel>

              <Rectangle x:Name="HighlightRect"
                         Grid.Column="0"
                         Grid.ColumnSpan="5"
                         Height="{DynamicResource TimePickerFlyoutPresenterHighlightHeight}"
                         VerticalAlignment="Center"
                         ZIndex="-1">
                <Rectangle.Fill>
                  <SolidColorBrush Opacity="0.6"
                                   Color="{DynamicResource ThemeAccentColor}" />
                </Rectangle.Fill>
              </Rectangle>
              <Rectangle Name="PART_FirstSpacer"
                         Grid.Column="1"
                         Width="{DynamicResource TimePickerSpacerThemeWidth}"
                         HorizontalAlignment="Center"
                         Fill="{DynamicResource ThemeControlMidHighBrush}" />
              <Rectangle Name="PART_SecondSpacer"
                         Grid.Column="3"
                         Width="{DynamicResource TimePickerSpacerThemeWidth}"
                         HorizontalAlignment="Center"
                         Fill="{DynamicResource ThemeControlMidHighBrush}" />
            </Grid>

            <Grid Name="AcceptDismissGrid"
                  Grid.Row="1"
                  ColumnDefinitions="*,*">
              <Rectangle Grid.ColumnSpan="2"
                         Height="{DynamicResource TimePickerSpacerThemeWidth}"
                         VerticalAlignment="Top"
                         Fill="{DynamicResource ThemeControlMidHighBrush}" />
              <Button Name="PART_AcceptButton"
                      Grid.Column="0"
                      Height="{DynamicResource TimePickerFlyoutPresenterAcceptDismissHostGridHeight}"
                      HorizontalAlignment="Stretch"
                      VerticalAlignment="Stretch"
                      Theme="{StaticResource SimpleDateTimePickerButton}">
                <Path Data="M0.5,8.5 5,13.5 15.5,3"
                      Stroke="{Binding $parent[Button].Foreground}"
                      StrokeLineCap="Round"
                      StrokeThickness="0.75" />
              </Button>
              <Button Name="PART_DismissButton"
                      Grid.Column="1"
                      Height="{DynamicResource TimePickerFlyoutPresenterAcceptDismissHostGridHeight}"
                      HorizontalAlignment="Stretch"
                      VerticalAlignment="Stretch"
                      FontSize="16"
                      Theme="{StaticResource SimpleDateTimePickerButton}">
                <Path Data="M2,2 14,14 M2,14 14 2"
                      Stroke="{Binding $parent[Button].Foreground}"
                      StrokeLineCap="Round"
                      StrokeThickness="0.75" />
              </Button>
            </Grid>
          </Grid>
        </Border>
      </ControlTemplate>
    </Setter>

    <Style Selector="^ /template/ Panel">
      <Style Selector="^:pointerover RepeatButton">
        <Setter Property="IsVisible" Value="True" />
      </Style>
    </Style>
  </ControlTheme>
</ResourceDictionary>