<!--
// (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.
-->

<Styles xmlns="https://github.com/avaloniaui"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:sys="clr-namespace:System;assembly=netstandard">
  <Styles.Resources>
    <x:Double x:Key="TimePickerFlyoutPresenterItemHeight">40</x:Double>
    <x:Double x:Key="TimePickerSpacerThemeWidth">1</x:Double>
    <Thickness x:Key="TimePickerBorderThemeThickness">1</Thickness>
    <Thickness x:Key="TimePickerTopHeaderMargin">0,0,0,4</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>
  </Styles.Resources>

  <Style Selector="ListBoxItem.DateTimePickerItem.HourItem">
    <Setter Property="Padding" Value="{DynamicResource TimePickerFlyoutPresenterItemPadding}" />
  </Style>
  <Style Selector="ListBoxItem.DateTimePickerItem.MinuteItem">
    <Setter Property="Padding" Value="{DynamicResource TimePickerFlyoutPresenterItemPadding}" />
  </Style>
  <Style Selector="ListBoxItem.DateTimePickerItem.TimePeriodItem">
    <Setter Property="Padding" Value="{DynamicResource TimePickerFlyoutPresenterItemPadding}" />
  </Style>

  <Style Selector="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>
        <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
          <ContentPresenter x:Name="HeaderContentPresenter"
                 Grid.Row="0"
                 Content="{TemplateBinding Header}"
                 ContentTemplate="{TemplateBinding HeaderTemplate}"
                 Margin="{DynamicResource TimePickerTopHeaderMargin}"
                 MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
                 TextElement.Foreground="{DynamicResource ThemeForegroundColor}"
                 HorizontalAlignment="Stretch"
                 VerticalAlignment="Top" />

          <Button x:Name="FlyoutButton"
                  Grid.Row="1"
                  Foreground="{TemplateBinding Foreground}"
                  Background="{TemplateBinding Background}"
                  BorderBrush="{TemplateBinding BorderBrush}"
                  BorderThickness="{TemplateBinding BorderThickness}"
                  CornerRadius="{TemplateBinding CornerRadius}"
                  IsEnabled="{TemplateBinding IsEnabled}"
                  MinWidth="{DynamicResource TimePickerThemeMinWidth}"
                  MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
                  HorizontalAlignment="Stretch"
                  HorizontalContentAlignment="Stretch"
                  VerticalAlignment="Top"
                  VerticalContentAlignment="Stretch">
            <Button.Template>
              <ControlTemplate>
                <ContentPresenter Name="ContentPresenter"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                Background="{TemplateBinding Background}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                CornerRadius="{TemplateBinding CornerRadius}"
                                Content="{TemplateBinding Content}"
                                TextElement.Foreground="{TemplateBinding Foreground}"
                                HorizontalContentAlignment="Stretch"
                                VerticalContentAlignment="Stretch" />
              </ControlTemplate>
            </Button.Template>

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

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

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

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

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

          <Popup Name="Popup" WindowManagerAddShadowHint="False"
                 StaysOpen="False" PlacementTarget="{TemplateBinding}"
                 PlacementMode="Bottom">
            <TimePickerPresenter Name="PickerPresenter" />
          </Popup>

        </Grid>
      </ControlTemplate>
    </Setter>
  </Style>

  <Style Selector="TimePicker:disabled /template/ ContentPresenter#HeaderContentPresenter">
    <Setter Property="TextElement.Foreground" Value="{DynamicResource ThemeForegroundBrush}"/>
  </Style>
  <Style Selector="TimePicker:disabled /template/ Rectangle">
    <Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}"/>
  </Style>

  <Style Selector="TimePicker /template/ Button#FlyoutButton:pointerover /template/ ContentPresenter">
    <!--<Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPointerOver}"/>-->
    <Setter Property="BorderBrush" Value="{DynamicResource ThemeControlHighBrush}"/>
    <Setter Property="TextElement.Foreground" Value="{DynamicResource ThemeForegroundBrush}"/>
  </Style>

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

  <Style Selector="TimePicker /template/ Button:disabled /template/ ContentPresenter">
    <!--<Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundDisabled}"/>
    <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushDisabled}"/>
    <Setter Property="TextElement.Foreground" Value="{DynamicResource TimePickerButtonForegroundDisabled}"/>-->
    <Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}" />
  </Style>

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

  <Style Selector="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"
                Background="{TemplateBinding Background}"
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}"
                CornerRadius="{TemplateBinding CornerRadius}"
                Padding="{DynamicResource DateTimeFlyoutBorderPadding}"
                MaxHeight="398">
          <Grid Name="ContentPanel" RowDefinitions="*,Auto">
            <Grid Name="PickerContainer">
              <!--Ignore col defs here, set in code-->
              <Panel Name="HourHost" Grid.Column="0">
                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
                              VerticalScrollBarVisibility="Hidden">
                  <DateTimePickerPanel Name="HourSelector"
                                          PanelType="Hour"
                                          ShouldLoop="True"
                                          ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"/>
                </ScrollViewer>
                <RepeatButton Name="HourUpButton"
                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
                <RepeatButton Name="HourDownButton"
                              Classes="DateTimeFlyoutButtonStyle DownButton"/>

              </Panel>

              <Panel Name="MinuteHost" Grid.Column="2">
                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
                              VerticalScrollBarVisibility="Hidden">
                  <DateTimePickerPanel Name="MinuteSelector"
                                          PanelType="Minute"
                                          ShouldLoop="True"
                                          ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"/>
                </ScrollViewer>
                <RepeatButton Name="MinuteUpButton"
                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
                <RepeatButton Name="MinuteDownButton"
                              Classes="DateTimeFlyoutButtonStyle DownButton"/>

              </Panel>

              <Panel Name="PeriodHost" Grid.Column="4">
                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
                              VerticalScrollBarVisibility="Hidden">
                  <DateTimePickerPanel Name="PeriodSelector"
                                          PanelType="TimePeriod"
                                          ShouldLoop="False"
                                          ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"/>
                </ScrollViewer>
                <RepeatButton Name="PeriodUpButton"
                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
                <RepeatButton Name="PeriodDownButton"
                              Classes="DateTimeFlyoutButtonStyle DownButton"/>

              </Panel>

              <Rectangle x:Name="HighlightRect" ZIndex="-1"
                      Fill="{DynamicResource TimePickerFlyoutPresenterHighlightFill}"
                      Grid.Column="0"
                      Grid.ColumnSpan="5"
                      VerticalAlignment="Center"
                      Height="{DynamicResource TimePickerFlyoutPresenterHighlightHeight}" />

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

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

            <Grid Grid.Row="1" Height="{DynamicResource TimePickerFlyoutPresenterAcceptDismissHostGridHeight}"
                  Name="AcceptDismissHostGrid" ColumnDefinitions="*,*">
              <Rectangle Height="{DynamicResource TimePickerSpacerThemeWidth}"
                      VerticalAlignment="Top"
                      Fill="{DynamicResource ThemeControlMidHighBrush}"
                      Grid.ColumnSpan="2" />
              <Button Name="AcceptButton" Grid.Column="0" Classes="DateTimeFlyoutButtonStyle"
                          HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
                      StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
              </Button>
              <Button Name="DismissButton" Grid.Column="1" Classes="DateTimeFlyoutButtonStyle"
                         FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
                      StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
              </Button>
            </Grid>

          </Grid>
        </Border>
      </ControlTemplate>
    </Setter>
  </Style>

  <Style Selector="TimePickerPresenter /template/ Panel RepeatButton">
    <Setter Property="IsVisible" Value="False" />
  </Style>

  <Style Selector="TimePickerPresenter /template/ Panel:pointerover RepeatButton">
    <Setter Property="IsVisible" Value="True" />
  </Style>
  
</Styles>
