<UserControl x:Class="NorthwindBackend.Default" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
		xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:NorthwindBackend"
		xmlns:primitives="clr-namespace:Telerik.Windows.Controls.Primitives;assembly=Telerik.Windows.Controls"
		xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"
		xmlns:input="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input"
		xmlns:nav="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation">
	<UserControl.Resources>

		<!-- Tansition from Edit to View mode. -->
		<Storyboard x:Key="EditViewTransition">
			<DoubleAnimation Storyboard.TargetProperty="Opacity" Storyboard.TargetName="EditPanel" From="1" To="0"
					Duration="0:0:0.200" />
			<DoubleAnimation Storyboard.TargetProperty="Opacity" Storyboard.TargetName="ViewPanel" From="0" To="1"
					Duration="0:0:0.200" />
			<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="ViewPanel"
					Duration="0:0:0.200">
				<DiscreteObjectKeyFrame KeyTime="0:0:0.199" Value="Visible" />
			</ObjectAnimationUsingKeyFrames>
		</Storyboard>

		<!-- Tansition from View to Edit mode. -->
		<Storyboard x:Key="ViewEditTransition">
			<DoubleAnimation Storyboard.TargetProperty="Opacity" Storyboard.TargetName="EditPanel" From="0" To="1"
					Duration="0:0:0.200" />
			<DoubleAnimation Storyboard.TargetProperty="Opacity" Storyboard.TargetName="ViewPanel" From="1" To="0"
					Duration="0:0:0.200" />
			<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="ViewPanel"
					Duration="0:0:0.200">
				<DiscreteObjectKeyFrame KeyTime="0:0:0.010" Value="Collapsed" />
			</ObjectAnimationUsingKeyFrames>
		</Storyboard>

		<!-- Tansition when a product is selected. -->
		<Storyboard x:Key="ProductSelectedTransition">
			<ColorAnimation Storyboard.TargetProperty="Border.Background.Color" Storyboard.TargetName="ProductInfoPanel"
					From="Orange" To="#19FFF200" Duration="0:0:0.500" />
		</Storyboard>

		<local:VisibilityNullConverter x:Key="VisibilityNullConverter" />
		<local:VisibilityCountConverter x:Key="VisibilityCountConverter" />
		<SolidColorBrush x:Key="LoadingVisualBrush" Color="#FF3F6618"></SolidColorBrush>

	</UserControl.Resources>

	<Grid x:Name="LayoutRoot">
		<Grid.Background>
			<ImageBrush ImageSource="{StaticResource BackgroundImage}" />
		</Grid.Background>

		<Grid VerticalAlignment="center" Width="895" Height="750">
			<Grid.Background>
				<ImageBrush ImageSource="{StaticResource SubBackgroundImage}" />
			</Grid.Background>

			<Image Width="215" Height="23" Source="/NorthwindBackend;component/images/logo.png"
					HorizontalAlignment="Left" Margin="8.5,110,0,0" VerticalAlignment="Top" />

			<Border HorizontalAlignment="Left" Margin="8.5,40,0,20" Width="282" Height="490" CornerRadius="10,10,10,10"
					BorderThickness="1,1,1,1" Opacity="1" Background="#19FFF200" BorderBrush="#FF9FA68C">

				<Grid>
					<Rectangle Width="260" Height="467" Margin="10" RadiusY="0" RadiusX="0">
						<Rectangle.Fill>
							<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
								<GradientStop Color="#FFE4E4E4" />
								<GradientStop Color="#FFC5C5C5" Offset="1" />
							</LinearGradientBrush>
						</Rectangle.Fill>
					</Rectangle>

					<TextBlock Margin="20 20 25 5" Text="Categories" FontFamily="Arial" FontSize="11" />

					<Line Stroke="#FFBCBCBC" StrokeThickness="1" X1="95" Y1="100" X2="345" Y2="100"
							Margin="-79,-60,-63,60" />

					<Line Stroke="#FFF2F2F2" StrokeThickness="1" X1="95" Y1="100" X2="345" Y2="100"
							Margin="-79,-58,-63,58" />

					<Grid Margin="10 50 10 20">
						<Grid Visibility="{Binding Categories.Count, Converter={StaticResource VisibilityCountConverter}}">
							<Grid.Triggers>
								<EventTrigger RoutedEvent="Canvas.Loaded">
									<BeginStoryboard>
										<Storyboard>
											<DoubleAnimation From="0" To="359" Duration="0:0:1" RepeatBehavior="Forever"
													Storyboard.TargetName="LoadingVisualAngleTransform"
													Storyboard.TargetProperty="Angle" />
										</Storyboard>
									</BeginStoryboard>
								</EventTrigger>
							</Grid.Triggers>

							<Grid x:Name="LoadingVisual" RenderTransformOrigin="0.5,0.5" VerticalAlignment="Center"
									HorizontalAlignment="Center">
								<Grid.RenderTransform>
									<TransformGroup>
										<RotateTransform x:Name="LoadingVisualAngleTransform" Angle="0" CenterX="0.5"
												CenterY="0.5" />
									</TransformGroup>
								</Grid.RenderTransform>
								<Path Width="50" Height="50" Stretch="Fill" Stroke="{StaticResource LoadingVisualBrush}"
										StrokeThickness="3" StrokeStartLineCap="Round" Data="M1,0 A1,1,90,1,1,0,-1" />

								<Path Margin="25,-7.5,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Width="20"
										Height="20" Stretch="Fill" Fill="{StaticResource LoadingVisualBrush}"
										Data="M0,-1.1 L0.1,-1 L0,-0.9" StrokeThickness="1" />
							</Grid>

						</Grid>

						<nav:RadTreeView Margin="5,5,10,5" ItemsSource="{Binding Categories}"
								IsLoadOnDemandEnabled="True" ExpanderStyle="{StaticResource MyExpanderStyle}"
								IsExpandOnSingleClickEnabled="True" ItemTemplate="{StaticResource CategoryTemplate}"
								LoadOnDemand="RadTreeView_LoadOnDemand"
								ItemContainerStyle="{StaticResource MyTreeViewItemTemplate}"
								SelectionChanged="RadTreeView_SelectionChanged" />
					</Grid>
				</Grid>
			</Border>

			<Button Height="25" HorizontalAlignment="Right" Margin="0,115,150,0" VerticalAlignment="Top" Width="106"
					Content="Add New" Grid.Column="1" Style="{StaticResource ButtonTemplate}" />

			<TextBlock HorizontalAlignment="left" Margin="350,220,0,0" VerticalAlignment="Top"
					Text="{Binding SelectedProduct.ProductName}" TextWrapping="NoWrap" Foreground="#FF8DC63F"
					FontSize="15" />

			<!-- The product info panel. It is hidden when there is no selected product -->
			<Border Margin="330,50,110,50" CornerRadius="10,10,10,10" BorderThickness="1,1,1,1" Height="260"
					Visibility="{Binding SelectedProduct, Converter={StaticResource VisibilityNullConverter}}"
					BorderBrush="#FFB1C69E" Background="#19FFF200" x:Name="ProductInfoPanel">

				<Grid Grid.Column="1" Grid.Row="1" Margin="10">

					<Border x:Name="EditPanel" Background="{StaticResource EditPanelBackground}">
						<StackPanel>
							<primitives:RadUniformGrid Margin="10 10 10 5" Columns="2">
								<TextBlock Margin="0,6,5,0" HorizontalAlignment="Right">Product Name:</TextBlock>
								<TextBox Text="{Binding SelectedProduct.ProductName, Mode=TwoWay}" Height="23" />

								<TextBlock Margin="0,6,5,0" HorizontalAlignment="Right">Quantity Per Unit:</TextBlock>
								<TextBox Text="{Binding SelectedProduct.QuantityPerUnit, Mode=TwoWay}" Height="23" />

								<TextBlock Margin="0,6,5,0" HorizontalAlignment="Right">Unit Price:</TextBlock>
								<TextBox Text="{Binding SelectedProduct.UnitPrice, Mode=TwoWay}" Height="23" />

								<TextBlock Margin="0,6,5,0" HorizontalAlignment="Right">Units In Stock:</TextBlock>
								<TextBox Text="{Binding SelectedProduct.UnitsInStock, Mode=TwoWay}" Height="23" />

								<TextBlock Margin="0,6,5,0" HorizontalAlignment="Right">Units On Order:</TextBlock>
								<TextBox Text="{Binding SelectedProduct.UnitsOnOrder, Mode=TwoWay}" Height="23" />

								<TextBlock Margin="0,6,5,0" HorizontalAlignment="Right">Reorder Level:</TextBlock>
								<TextBox Text="{Binding SelectedProduct.ReorderLevel, Mode=TwoWay}" Height="23" />

								<TextBlock Margin="0,6,5,0" HorizontalAlignment="Right">Supplier:</TextBlock>
								<input:RadComboBox ItemsSource="{Binding Suppliers}"
										SelectedItem="{Binding SelectedProduct.Supplier, Mode=TwoWay}"
										DisplayMemberPath="ContactName" Height="26" />

							</primitives:RadUniformGrid>

							<Border BorderBrush="#FFBCBCBC" BorderThickness="0 1 0 0">

								<Border BorderBrush="#FFF2F2F2" BorderThickness="0 1 0 0">
									<StackPanel Orientation="Horizontal" HorizontalAlignment="Right"
											VerticalAlignment="Bottom" Margin="0 7 0 0">
										<Button Width="106" Height="25" Margin="0 0 20 0" Content="Save"
												Click="ButtonSave_Click" Style="{StaticResource ButtonTemplate}" />
										<Button Width="106" Height="25" Margin="0 0 80 0" Content="Cancel"
												Click="ButtonCancel_Click" Style="{StaticResource ButtonTemplate}" />
									</StackPanel>
								</Border>

							</Border>

						</StackPanel>
					</Border>

					<Border x:Name="ViewPanel" Background="{StaticResource EditPanelBackground}">
						<StackPanel>
							<primitives:RadUniformGrid Margin="10 10 10 5" Columns="2">
								<TextBlock VerticalAlignment="Center" Margin="0,6,5,4" HorizontalAlignment="Right">Product Name:</TextBlock>
								<TextBlock VerticalAlignment="Center" Text="{Binding SelectedProduct.ProductName}"
										Margin="4,6,0,4" />

								<TextBlock VerticalAlignment="Center" Margin="0,6,5,4" HorizontalAlignment="Right">Quantity Per Unit:</TextBlock>
								<TextBlock VerticalAlignment="Center" Text="{Binding SelectedProduct.QuantityPerUnit}"
										Margin="4,6,0,4" />

								<TextBlock VerticalAlignment="Center" Margin="0,6,5,4" HorizontalAlignment="Right">Unit Price:</TextBlock>
								<TextBlock VerticalAlignment="Center" Text="{Binding SelectedProduct.UnitPrice}"
										Margin="4,6,0,4" />

								<TextBlock VerticalAlignment="Center" Margin="0,6,5,4" HorizontalAlignment="Right">Units In Stock:</TextBlock>
								<TextBlock VerticalAlignment="Center" Text="{Binding SelectedProduct.UnitsInStock}"
										Margin="4,6,0,4" />

								<TextBlock VerticalAlignment="Center" Margin="0,6,5,4" HorizontalAlignment="Right">Units On Order:</TextBlock>
								<TextBlock VerticalAlignment="Center" Text="{Binding SelectedProduct.UnitsOnOrder}"
										Margin="4,6,0,4" />

								<TextBlock VerticalAlignment="Center" Margin="0,6,5,4" HorizontalAlignment="Right">Reorder Level:</TextBlock>
								<TextBlock VerticalAlignment="Center" Text="{Binding SelectedProduct.ReorderLevel}"
										Margin="4,6,0,4" />

								<TextBlock VerticalAlignment="Center" Margin="0,6,5,4" HorizontalAlignment="Right">Supplier:</TextBlock>
								<TextBlock VerticalAlignment="Center"
										Text="{Binding SelectedProduct.Supplier.ContactName}" Margin="4,6,0,4" />

							</primitives:RadUniformGrid>

							<Border BorderBrush="#FFBCBCBC" BorderThickness="0 1 0 0">

								<Border BorderBrush="#FFF2F2F2" BorderThickness="0 1 0 0">
									<StackPanel Orientation="Horizontal" HorizontalAlignment="Right"
											VerticalAlignment="Bottom" Margin="0 7 0 0">
										<Button Width="106" Height="25" Margin="0 0 20 0" Content="Edit"
												Click="ButtonEdit_Click" Style="{StaticResource ButtonTemplate}" />

										<Button Width="106" Height="25" Margin="0 0 80 0" Content="Delete"
												Click="ButtonDelete_Click" Style="{StaticResource ButtonTemplate}" />
									</StackPanel>
								</Border>

							</Border>

						</StackPanel>
					</Border>
				</Grid>
			</Border>
		</Grid>
	</Grid>
</UserControl>