<UserControl
    x:Class="AmbientSounds.Controls.SettingsControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:core="using:Microsoft.Xaml.Interactions.Core"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
    xmlns:local="using:AmbientSounds.Controls"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:strings="using:AmbientSounds.Strings"
    d:DesignHeight="300"
    d:DesignWidth="400"
    mc:Ignorable="d">

    <UserControl.Resources>
        <Style TargetType="RadioButton">
            <Setter Property="HorizontalAlignment" Value="Stretch" />
        </Style>

        <Style x:Key="SettingTitleStyle" TargetType="TextBlock">
            <Setter Property="Margin" Value="0,12,0,0" />
        </Style>
    </UserControl.Resources>

    <ScrollViewer>
        <StackPanel>
            <TextBlock x:Uid="SettingsThemeHeader" Style="{StaticResource SettingTitleStyle}" />
            <GridView
                Width="312"
                Margin="0,4,0,0"
                HorizontalAlignment="Left"
                IsItemClickEnabled="True"
                ItemsSource="{x:Bind ViewModel.ImagePaths}"
                ScrollViewer.VerticalScrollBarVisibility="Disabled"
                ScrollViewer.VerticalScrollMode="Disabled"
                SelectionMode="None">
                <interactivity:Interaction.Behaviors>
                    <core:ItemClickBehavior Command="{x:Bind ViewModel.SelectImageCommand}" />
                    <core:EventTriggerBehavior EventName="Loaded">
                        <core:InvokeCommandAction Command="{x:Bind ViewModel.LoadImagesCommand}" />
                    </core:EventTriggerBehavior>
                </interactivity:Interaction.Behaviors>

                <GridView.ItemTemplate>
                    <DataTemplate x:DataType="x:String">
                        <Grid
                            Width="100"
                            Height="60"
                            CornerRadius="8">
                            <Image Stretch="UniformToFill">
                                <Image.Source>
                                    <BitmapImage DecodePixelHeight="60" UriSource="{Binding}" />
                                </Image.Source>
                            </Image>
                        </Grid>
                    </DataTemplate>
                </GridView.ItemTemplate>
                <GridView.ItemContainerTransitions>
                    <TransitionCollection>
                        <EntranceThemeTransition IsStaggeringEnabled="True" />
                    </TransitionCollection>
                </GridView.ItemContainerTransitions>
            </GridView>

            <Button
                HorizontalAlignment="Stretch"
                Command="{x:Bind ViewModel.BrowseCommand}"
                Content="{x:Bind strings:Resources.BrowseText}" />

            <ToggleSwitch
                Margin="0,12,0,0"
                Header="{x:Bind strings:Resources.Transparency}"
                IsEnabled="{x:Bind ViewModel.TransparencyToggleEnabled, Mode=OneWay}"
                IsOn="{x:Bind ViewModel.TransparencyOn, Mode=TwoWay}">
                <ToggleSwitch.OffContent>
                    <TextBlock x:Uid="OffTextBlock" />
                </ToggleSwitch.OffContent>
                <ToggleSwitch.OnContent>
                    <TextBlock x:Uid="OnTextBlock" />
                </ToggleSwitch.OnContent>
            </ToggleSwitch>

            <RadioButton
                x:Uid="SettingsThemeDefaultRadio"
                Margin="0,4,0,0"
                Click="{x:Bind ViewModel.DefaultThemeRadioClicked}"
                IsChecked="{x:Bind ViewModel.DefaultRadioIsChecked}" />
            <RadioButton
                x:Uid="SettingsThemeDarkRadio"
                Click="{x:Bind ViewModel.DarkThemeRadioClicked}"
                IsChecked="{x:Bind ViewModel.DarkRadioIsChecked}" />
            <RadioButton
                x:Uid="SettingsThemeLightRadio"
                Click="{x:Bind ViewModel.LightThemeRadioClicked}"
                IsChecked="{x:Bind ViewModel.LightRadioIsChecked}" />

            <!--  Telemetry  -->
            <ToggleSwitch
                x:Uid="SettingsTelemetrySwitch"
                Margin="0,12,0,0"
                IsOn="{x:Bind ViewModel.TelemetryEnabled, Mode=TwoWay}">
                <ToggleSwitch.OffContent>
                    <TextBlock x:Uid="OffTextBlock" />
                </ToggleSwitch.OffContent>
                <ToggleSwitch.OnContent>
                    <TextBlock x:Uid="OnTextBlock" />
                </ToggleSwitch.OnContent>
            </ToggleSwitch>

            <!--  New sound notifications  -->
            <ToggleSwitch
                x:Uid="SettingsNotificationsSwitch"
                Margin="0,12,0,0"
                IsOn="{x:Bind ViewModel.NotificationsEnabled, Mode=TwoWay}">
                <ToggleSwitch.OffContent>
                    <TextBlock x:Uid="OffTextBlock" />
                </ToggleSwitch.OffContent>
                <ToggleSwitch.OnContent>
                    <TextBlock x:Uid="OnTextBlock" />
                </ToggleSwitch.OnContent>
            </ToggleSwitch>

            <!--  screensaver  -->
            <ToggleSwitch
                x:Uid="SettingsScreensaverSwitch"
                Margin="0,12,0,0"
                IsOn="{x:Bind ViewModel.ScreensaverEnabled, Mode=TwoWay}">
                <ToggleSwitch.OffContent>
                    <TextBlock x:Uid="OffTextBlock" />
                </ToggleSwitch.OffContent>
                <ToggleSwitch.OnContent>
                    <TextBlock x:Uid="OnTextBlock" />
                </ToggleSwitch.OnContent>
            </ToggleSwitch>

            <CheckBox
                x:Uid="SettingsScreensaverDark"
                Margin="0,12,0,0"
                IsChecked="{x:Bind ViewModel.DarkScreensaverEnabled, Mode=TwoWay}" />

        </StackPanel>
    </ScrollViewer>
</UserControl>
