<UserControl xmlns="https://github.com/avaloniaui"
             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:profile="clr-namespace:Artemis.UI.Screens.Workshop.Profile"
             xmlns:core="clr-namespace:Artemis.Core;assembly=Artemis.Core"
             xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
             x:Class="Artemis.UI.Screens.Workshop.Profile.ProfilePreviewView"
             x:DataType="profile:ProfilePreviewViewModel">
    <UserControl.Resources>
        <VisualBrush x:Key="LargeCheckerboardBrush" TileMode="Tile" Stretch="Uniform" SourceRect="0,0,20,20">
            <VisualBrush.Visual>
                <Canvas Width="20" Height="20">
                    <Rectangle Width="10" Height="10" Fill="Black" Opacity="0.15" />
                    <Rectangle Width="10" Height="10" Canvas.Left="10" />
                    <Rectangle Width="10" Height="10" Canvas.Top="10" />
                    <Rectangle Width="10" Height="10" Canvas.Left="10" Canvas.Top="10" Fill="Black" Opacity="0.15" />
                </Canvas>
            </VisualBrush.Visual>
        </VisualBrush>
    </UserControl.Resources>
    <ZoomBorder Name="ZoomBorder"
                Stretch="None"
                ClipToBounds="True"
                Focusable="True"
                VerticalAlignment="Stretch"
                HorizontalAlignment="Stretch"
                Background="{StaticResource LargeCheckerboardBrush}"
                ZoomChanged="ZoomBorder_OnZoomChanged">
            <Grid Name="ContainerGrid" Background="Transparent">
                <Grid.Transitions>
                    <Transitions>
                        <TransformOperationsTransition Property="RenderTransform" Duration="0:0:0.2" Easing="CubicEaseOut" />
                    </Transitions>
                </Grid.Transitions>
                
                <ItemsControl Name="DevicesContainer" ItemsSource="{CompiledBinding Devices}" ClipToBounds="False">
                    <ItemsControl.Styles>
                        <Style Selector="ContentPresenter" x:DataType="core:ArtemisDevice">
                            <Setter Property="Canvas.Left" Value="{CompiledBinding X}" />
                            <Setter Property="Canvas.Top" Value="{CompiledBinding Y}" />
                        </Style>
                    </ItemsControl.Styles>
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <Canvas />
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                    <ItemsControl.ItemTemplate>
                        <DataTemplate DataType="core:ArtemisDevice">
                            <shared:DeviceVisualizer Device="{CompiledBinding}" ShowColors="True" RenderOptions.BitmapInterpolationMode="MediumQuality" />
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </Grid>
        </ZoomBorder>
</UserControl>
