<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="ChartSamples.Window1" Title="ComponentOne Chart™ for WPF" Background="Black" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:samples="clr-namespace:ChartSamples">
  <Border Background="Black" Padding="10">
    <Grid>
    <Grid.Resources>
      <SolidColorBrush x:Key="GlyphBrush" Color="#999" />
      <Style x:Key="ExpandCollapseToggleStyle" TargetType="ToggleButton">
        <Setter Property="Focusable" Value="False" />
        <Setter Property="Template">
          <Setter.Value>
            <ControlTemplate TargetType="ToggleButton">
              <Grid Width="15" Height="13" Background="Transparent">
                <Path x:Name="ExpandPath" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="1,1,1,1" Fill="{StaticResource GlyphBrush}" Data="M 4 0 L 8 4 L 4 8 Z" />
              </Grid>
              <ControlTemplate.Triggers>
                <Trigger Property="IsChecked" Value="True">
                  <Setter Property="Data" TargetName="ExpandPath" Value="M 0 4 L 8 4 L 4 8 Z" />
                </Trigger>
              </ControlTemplate.Triggers>
            </ControlTemplate>
          </Setter.Value>
        </Setter>
      </Style>
      <Style x:Key="TreeViewItemFocusVisual">
        <Setter Property="Control.Template">
          <Setter.Value>
            <ControlTemplate>
              <Border>
                <Rectangle Margin="0,0,0,0" StrokeThickness="5" Stroke="White" StrokeDashArray="1 2" Opacity="0" />
              </Border>
            </ControlTemplate>
          </Setter.Value>
        </Setter>
      </Style>
      <Style x:Key="tvi" TargetType="TreeViewItem">
        <Setter Property="IsExpanded" Value="True" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment,               RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />
        <Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment,               RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />
        <Setter Property="Padding" Value="3" />
        <Setter Property="Foreground" Value="LightGray" />
        <Setter Property="FocusVisualStyle" Value="{StaticResource TreeViewItemFocusVisual}" />
        <Setter Property="Template">
          <Setter.Value>
            <ControlTemplate TargetType="{x:Type TreeViewItem}">
              <Grid>
                <Grid.ColumnDefinitions>
                  <ColumnDefinition MinWidth="19" Width="Auto" />
                  <ColumnDefinition Width="Auto" />
                  <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                  <RowDefinition Height="Auto" />
                  <RowDefinition />
                </Grid.RowDefinitions>
                <ToggleButton x:Name="Expander" Style="{StaticResource ExpandCollapseToggleStyle}" IsChecked="{Binding Path=IsExpanded,                               RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press" />
                <Border Name="Bd" CornerRadius="3" Grid.Column="1" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
                  <ContentPresenter x:Name="PART_Header" ContentSource="Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" />
                </Border>
                <ItemsPresenter x:Name="ItemsHost" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2" />
              </Grid>
              <ControlTemplate.Triggers>
                <Trigger Property="IsExpanded" Value="false">
                  <Setter TargetName="ItemsHost" Property="Visibility" Value="Collapsed" />
                </Trigger>
                <Trigger Property="HasItems" Value="false">
                  <Setter TargetName="Expander" Property="Visibility" Value="Hidden" />
                </Trigger>
                <MultiTrigger>
                  <MultiTrigger.Conditions>
                    <Condition Property="HasHeader" Value="false" />
                    <Condition Property="Width" Value="Auto" />
                  </MultiTrigger.Conditions>
                  <Setter TargetName="PART_Header" Property="MinWidth" Value="75" />
                </MultiTrigger>
                <MultiTrigger>
                  <MultiTrigger.Conditions>
                    <Condition Property="HasHeader" Value="false" />
                    <Condition Property="Height" Value="Auto" />
                  </MultiTrigger.Conditions>
                  <Setter TargetName="PART_Header" Property="MinHeight" Value="19" />
                </MultiTrigger>
                <Trigger Property="IsSelected" Value="true">
                  <Setter TargetName="Bd" Property="Background" Value="DarkGray" />
                  <Setter Property="Foreground" Value="White" />
                </Trigger>
                <MultiTrigger>
                  <MultiTrigger.Conditions>
                    <Condition Property="IsSelected" Value="true" />
                    <Condition Property="IsSelectionActive" Value="false" />
                  </MultiTrigger.Conditions>
                  <Setter TargetName="Bd" Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" />
                  <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
                </MultiTrigger>
                <Trigger Property="IsEnabled" Value="false">
                  <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                </Trigger>
              </ControlTemplate.Triggers>
            </ControlTemplate>
          </Setter.Value>
        </Setter>
      </Style>
    </Grid.Resources>

      <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition />
        <RowDefinition Height="Auto" />
      </Grid.RowDefinitions>
      <Border Margin="7,7,4,4" CornerRadius="5" BorderThickness="1" BorderBrush="#FF777676" Grid.Row="0">
        <Border.Background>
          <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#FF343333" Offset="0" />
            <GradientStop Color="#FF3E3E3E" Offset="1" />
          </LinearGradientBrush>
        </Border.Background>
      </Border>
      <!-- Top panel -->
      <Border Margin="7,7,4,4" CornerRadius="5" BorderThickness="1" BorderBrush="#FF777676" Opacity="0.1" Grid.Row="0">
        <Border.Background>
          <LinearGradientBrush EndPoint="1.523,-1.604" StartPoint="0.549,5.531">
            <GradientStop Color="#01FFFFFF" Offset="0.992" />
            <GradientStop Color="#00FFFDFD" Offset="0" />
            <GradientStop Color="#00FFFDFD" Offset="0.286" />
            <GradientStop Color="#FFFFFDFD" Offset="0.298" />
            <GradientStop Color="#FEFEFDFD" Offset="0.346" />
            <GradientStop Color="#00FEFDFD" Offset="0.37" />
            <GradientStop Color="#FFFFFDFD" Offset="0.065" />
            <GradientStop Color="#00FFFCFC" Offset="0.1" />
            <GradientStop Color="#7EFEFDFD" Offset="0.441" />
            <GradientStop Color="#00FEFDFD" Offset="0.477" />
            <GradientStop Color="#00FEFDFD" Offset="0.531" />
            <GradientStop Color="#00FEFDFD" Offset="0.382" />
          </LinearGradientBrush>
        </Border.Background>
      </Border>
      <Border Margin="7,7,9,4" CornerRadius="5" Grid.Row="0">
        <StackPanel Orientation="Horizontal">
          <TextBlock Margin="8" FontSize="16" Text="ComponentOne Chart Samples" Foreground="#FFFFFFFF" VerticalAlignment="Top" />
        </StackPanel>
      </Border>

      <Border BorderBrush="#FF777676" Margin="7,7,4,4" CornerRadius="4" BorderThickness="1" Grid.Row="1">
        <Border.Background>
          <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#FF343333" Offset="0" />
            <GradientStop Color="#FF000000" Offset="1" />
            <GradientStop Color="#FF6D6D6D" Offset="0.226" />
            <GradientStop Color="#FE030303" Offset="0.244" />
          </LinearGradientBrush>
        </Border.Background>
        <Grid Grid.Row="1" Margin="7,7,4,4">
      <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
      <ColumnDefinition />
    </Grid.ColumnDefinitions>
          <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />

            <RowDefinition />
          </Grid.RowDefinitions>

          <Border CornerRadius="5" BorderBrush="#FFD9D9D9" BorderThickness="1" Margin="4" Grid.Column="0" Grid.Row="1" Grid.RowSpan="2">
            <Border.Background>
              <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FF000000" Offset="0.5" />
                <GradientStop Color="#FF373636" Offset="1" />
                <GradientStop Color="#FF000000" Offset="0" />
              </LinearGradientBrush>
            </Border.Background>

            <TreeView Background="Transparent" Margin="2" BorderThickness="0" Foreground="White" x:Name="tv" SelectedItemChanged="tv_SelectedItemChanged" Width="200">
        <TreeViewItem Style="{StaticResource tvi}" x:Name="iGallery" Header="Gallery">
          <TreeViewItem.Tag>
            <samples:Gallery />
          </TreeViewItem.Tag>
        </TreeViewItem>
        <TreeViewItem Style="{StaticResource tvi}" x:Name="iBasics" Header="Basics">
          <TreeViewItem Header="Labels" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:Labels />
            </TreeViewItem.Tag>
          </TreeViewItem>
          <TreeViewItem Header="Radar" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:Radar />
            </TreeViewItem.Tag>
          </TreeViewItem>
          <!--<TreeViewItem Header="Image Export" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:ImageExport />
            </TreeViewItem.Tag>
          </TreeViewItem>-->
        </TreeViewItem>

        <TreeViewItem Style="{StaticResource tvi}" Header="Interaction">
          <TreeViewItem Header="Interactive Zoom" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:InteractiveChart />
            </TreeViewItem.Tag>
          </TreeViewItem>

          <!--<TreeViewItem Header="Drag And Drop" Style="{StaticResource tvi}" >
            <TreeViewItem.Tag>
              <samples:DragDrop />
            </TreeViewItem.Tag>
          </TreeViewItem>

                <TreeViewItem Header="Markers" Style="{StaticResource tvi}" >
                    <TreeViewItem.Tag>
                      <samples:Markers />
                    </TreeViewItem.Tag>
                  </TreeViewItem>

                  <TreeViewItem Header="MouseMarkers" Style="{StaticResource tvi}" >
                    <TreeViewItem.Tag>
                      <samples:MouseMarker />
                    </TreeViewItem.Tag>
                  </TreeViewItem>

                <TreeViewItem Header="Add/Remove Markers" Style="{StaticResource tvi}" >
                  <TreeViewItem.Tag>
                    <samples:AddRemoveMarkers />
                  </TreeViewItem.Tag>
                </TreeViewItem>-->

        </TreeViewItem>

        <TreeViewItem Style="{StaticResource tvi}" Header="Appearance">
          <TreeViewItem Header="Bubble" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:Bubble />
            </TreeViewItem.Tag>
          </TreeViewItem>

          <TreeViewItem Header="Animation" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:Animation />
            </TreeViewItem.Tag>
          </TreeViewItem>
        </TreeViewItem>

        <TreeViewItem Style="{StaticResource tvi}" Header="Performance">
          <TreeViewItem Header="Live Data" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:Dynamic />
            </TreeViewItem.Tag>
          </TreeViewItem>

          <TreeViewItem Header="Large Data" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:LargeData />
            </TreeViewItem.Tag>
          </TreeViewItem>
        </TreeViewItem>

        <TreeViewItem Style="{StaticResource tvi}" x:Name="iCombi" Header="Combination">
                
          <!--<TreeViewItem Header="Financial" Style="{StaticResource tvi}" >
            <TreeViewItem.Tag>
              <samples:FinancialChart />
            </TreeViewItem.Tag>
          </TreeViewItem>-->

          <TreeViewItem Header="Complex" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:ComplexChart />
            </TreeViewItem.Tag>
          </TreeViewItem>

                <!--<TreeViewItem Header="Plot areas(vertically)" Style="{StaticResource tvi}" >
                  <TreeViewItem.Tag>
                    <samples:PlotAreasVertical />
                  </TreeViewItem.Tag>
                </TreeViewItem>

                <TreeViewItem Header="Plot areas(horizontally)" Style="{StaticResource tvi}" >
                  <TreeViewItem.Tag>
                    <samples:PlotAreasHorizontal />
                  </TreeViewItem.Tag>
                </TreeViewItem>-->

        </TreeViewItem>

        <TreeViewItem Style="{StaticResource tvi}" Header="Axes">
          <TreeViewItem Header="Logarithmic" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:LogAxes />
            </TreeViewItem.Tag>
          </TreeViewItem>

          <TreeViewItem Header="Ticks" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:AxisTicks />
            </TreeViewItem.Tag>
          </TreeViewItem>

          <TreeViewItem Header="Origin" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:AxisOrigin />
            </TreeViewItem.Tag>
          </TreeViewItem>

          <TreeViewItem Header="Dependent" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:DependentAxes />
            </TreeViewItem.Tag>
          </TreeViewItem>

          <TreeViewItem Header="Custom Labels" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:CustomLabels />
            </TreeViewItem.Tag>
          </TreeViewItem>
        </TreeViewItem>

        <TreeViewItem Style="{StaticResource tvi}" Header="Advanced">
          <!--<TreeViewItem Header="Functions" Style="{StaticResource tvi}" >
            <TreeViewItem.Tag>
              <samples:Functions />
            </TreeViewItem.Tag>
          </TreeViewItem>-->

          <TreeViewItem Header="Moving Average" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:MovAverage />
            </TreeViewItem.Tag>
          </TreeViewItem>

          <TreeViewItem Header="Parametric" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:Parametric />
            </TreeViewItem.Tag>
          </TreeViewItem>

          <TreeViewItem Header="Trend Lines" Style="{StaticResource tvi}">
            <TreeViewItem.Tag>
              <samples:TrendLines />
            </TreeViewItem.Tag>
          </TreeViewItem>

                <!--<TreeViewItem Header="Polygon"  Style="{StaticResource tvi}" >
                  <TreeViewItem.Tag>
                    <samples:PolygonPlot />
                  </TreeViewItem.Tag>
                </TreeViewItem>-->
        </TreeViewItem>

              <TreeViewItem Style="{StaticResource tvi}" Header="Aggregation">

                <TreeViewItem Header="Aggregate" Style="{StaticResource tvi}">
                  <TreeViewItem.Tag>
                    <samples:AggregateChart />
                  </TreeViewItem.Tag>
                </TreeViewItem>
                
                <TreeViewItem Header="Date Axis" Style="{StaticResource tvi}">
                  <TreeViewItem.Tag>
                    <samples:AggregateDateAxis />
                  </TreeViewItem.Tag>
                </TreeViewItem>

                <TreeViewItem Header="Category Axis" Style="{StaticResource tvi}">
                  <TreeViewItem.Tag>
                    <samples:AggregateCategoryAxis />
                  </TreeViewItem.Tag>
                </TreeViewItem>

                <TreeViewItem Header="Range distribution" Style="{StaticResource tvi}">
                  <TreeViewItem.Tag>
                    <samples:AggregateRange />
                  </TreeViewItem.Tag>
                </TreeViewItem>

              </TreeViewItem>
      </TreeView>
    </Border>
      
          <Border CornerRadius="5" Grid.Column="1" Grid.Row="2" Margin="4">
            <Border.Background>
              <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FF000000" Offset="0" />
                <GradientStop Color="#FF373636" Offset="1" />
                <GradientStop Color="#FF000000" Offset="0.5" />
              </LinearGradientBrush>
            </Border.Background>
            <Border Background="#02FFFFFF" CornerRadius="5" BorderBrush="#FFD9D9D9" BorderThickness="1" RenderTransformOrigin="0.5,0.5">
              <Border.RenderTransform>
                <TransformGroup>
                  <ScaleTransform ScaleX="1" ScaleY="1" />
                  <SkewTransform AngleX="0" AngleY="0" />
                  <RotateTransform Angle="0" />
                  <TranslateTransform X="0" Y="0" />
                </TransformGroup>
              </Border.RenderTransform>
            </Border>
          </Border>

          <Border Padding="16" Margin="5" Grid.Column="2" x:Name="sampleContainer" Background="#FF707070" Grid.Row="2" />

          <Grid Grid.Column="1" Grid.Row="1" Margin="4" Visibility="Visible" x:Name="_description">
            <Border CornerRadius="5" BorderThickness="1" BorderBrush="#FF777676">
              <Border.Background>
                <LinearGradientBrush EndPoint="0.5,1.011" StartPoint="0.5,-0.011">
                  <GradientStop Color="#FF343333" Offset="0" />
                  <GradientStop Color="#FF3E3E3E" Offset="1" />
                </LinearGradientBrush>
              </Border.Background>
    </Border>

            <Border CornerRadius="5" BorderThickness="1" BorderBrush="#FF777676" Opacity="0.1">
              <Border.Background>
                <LinearGradientBrush EndPoint="1.523,-1.604" StartPoint="0.549,5.531">
                  <GradientStop Color="#01FFFFFF" Offset="0.992" />
                  <GradientStop Color="#00FFFDFD" Offset="0" />
                  <GradientStop Color="#00FFFDFD" Offset="0.286" />
                  <GradientStop Color="#FFFFFDFD" Offset="0.298" />
                  <GradientStop Color="#FEFEFDFD" Offset="0.346" />
                  <GradientStop Color="#00FEFDFD" Offset="0.37" />
                  <GradientStop Color="#FFFFFDFD" Offset="0.065" />
                  <GradientStop Color="#00FFFCFC" Offset="0.1" />
                  <GradientStop Color="#7EFEFDFD" Offset="0.441" />
                  <GradientStop Color="#00FEFDFD" Offset="0.477" />
                  <GradientStop Color="#00FEFDFD" Offset="0.531" />
                  <GradientStop Color="#00FEFDFD" Offset="0.382" />
                </LinearGradientBrush>
              </Border.Background>
            </Border>

            <TextBlock x:Name="ControlDescription" FontSize="12" Margin="10" Foreground="#FFC8C8C8" TextWrapping="Wrap" FontWeight="Normal" />
          </Grid>
  </Grid>
      </Border>
    </Grid>
  </Border>
</Window>