<?xml version="1.0" encoding="utf-8"?>
<UserControl x:Class="QuickStart.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml">

    <UserControl.Resources>

        <!-- style used to display the border around each control -->
        <Style x:Key="ControlBorder" TargetType="Border">
            <Setter Property="BorderThickness" Value="3" />
            <Setter Property="Background" Value="#FFC2F5CB" />
            <Setter Property="BorderBrush" Value="#FF257004" />
            <Setter Property="CornerRadius" Value="6" />
            <Setter Property="Margin" Value="5" />
            <Setter Property="Padding" Value="5" />
        </Style>
        
        <!-- style used to display control titles -->
        <Style x:Key="ControlTitle" TargetType="TextBlock">
            <Setter Property="FontSize" Value="14" />
            <Setter Property="HorizontalAlignment" Value="Center" />
            <Setter Property="FontFamily" Value="Courier New" />
            <Setter Property="FontWeight" Value="Bold" />
            <Setter Property="Foreground" Value="#FF1F6900" />
        </Style>

    </UserControl.Resources>
    
    <Grid x:Name="LayoutRoot" Background="White">

        <!-- ScrollViewer with one entry for each control type -->
        <ScrollViewer>
            <StackPanel x:Name="_mainPanel" Margin="6">

                <!--
                =====================================================
                C1.Silverlight.dll
                =====================================================
                -->

                <!-- C1ComboBox -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1ComboBox" Style="{StaticResource ControlTitle}" />
						<c1:C1ComboBox x:Name="_cmb1" Width="200" />
						<c1:C1ComboBox x:Name="_cmb2" Width="200" />
					</StackPanel>
                </Border>

                <!-- C1MaskedTextBox -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1MaskedTextBox" Style="{StaticResource ControlTitle}" />
						<c1:C1MaskedTextBox Width="200" Watermark="Phone Number" Mask="(999) 000-0000" />
						<c1:C1MaskedTextBox Width="200" Watermark="Short Date" Mask="00/00/0000" />
						<c1:C1MaskedTextBox Width="200" Watermark="Social Security Number" Mask="000-00-0000" />
					</StackPanel>
                </Border>

                <!-- C1NumericBox -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1NumericBox" Style="{StaticResource ControlTitle}" />
						<c1:C1NumericBox Width="200" Format="F2" Value="3.1416" />
						<c1:C1NumericBox Width="200" Format="#,##0.00" Increment="100" Minimum="0" Maximum="10000" Value="3.1416" />
						<c1:C1NumericBox Width="200" Format="F2" Value="3.1416" ShowButtons="False" AllowNull="True" Watermark="No value specified" />
					  </StackPanel>
                </Border>

                <!-- C1Menu -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1Menu" Style="{StaticResource ControlTitle}" />
                        <c1:C1Menu x:Name="_menu" Width="400" Height="40">
                            <c1:C1MenuItem Header="File">
                                <c1:C1MenuItem Header="New">
                                    <c1:C1MenuItem Header="Project" />
                                    <c1:C1MenuItem Header="File" />
                                </c1:C1MenuItem>
                                <c1:C1MenuItem Header="Open" />
                            </c1:C1MenuItem>
                            <c1:C1MenuItem Header="Edit">
                                <c1:C1MenuItem Header="Cut" />
                                <c1:C1MenuItem Header="Copy" />
                                <c1:C1MenuItem Header="Test" />
                            </c1:C1MenuItem>
                            <c1:C1MenuItem Header="Window">
                                <c1:C1MenuItem Header="Floating" IsCheckable="True" />
                                <c1:C1MenuItem Header="Dockable" IsCheckable="True" />
                            </c1:C1MenuItem>
                        </c1:C1Menu>
                    </StackPanel>
                </Border>

                <!-- C1ContextMenu -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1ContextMenu" Style="{StaticResource ControlTitle}" />
                        <TextBlock Text="Right-click me please...">
                            <c1:C1ContextMenuService.ContextMenu>
                                <!-- C1ContextMenu used by C1ContextMenuService -->
                                <c1:C1ContextMenu x:Name="contextMenu" ItemClick="C1ContextMenu_ItemClick">
                                    <c1:C1MenuItem Header="Cut" />
                                    <c1:C1MenuItem Header="Copy" />
                                    <c1:C1MenuItem Header="Paste" />
                                    <c1:C1MenuItem Header="Delete" />
                                    <c1:C1MenuItem Header="Rename" />
                                    <c1:C1Separator />
                                    <c1:C1MenuItem Header="Properties" />
                                </c1:C1ContextMenu>
                            </c1:C1ContextMenuService.ContextMenu>
                        </TextBlock> 
                    </StackPanel>
                </Border>
                
                <!-- C1Window -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1Window" Style="{StaticResource ControlTitle}" />
                        <Button Click="OpenWindow" Content="Open window (modeless)" Width="300" />
                        <Button Click="ShowDialog" Content="Open window (modal)" Width="300" />
                    </StackPanel>
                </Border>

                <!-- C1MessageBox -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1MessageBox" Style="{StaticResource ControlTitle}" />
                        <Button Click="ShowMessageBox" Content="Show C1MessageBox" Width="300" />
                    </StackPanel>
                </Border>

                <!-- C1TreeView -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1TreeView" Style="{StaticResource ControlTitle}" />
						<c1:C1TreeView x:Name="_tv" Width="400" Height="150" AllowDragDrop="True">
							<c1:C1TreeViewItem Header="Item 1">
								<c1:C1TreeViewItem Header="Item 1.1" />
								<c1:C1TreeViewItem Header="Item 1.2" />
							</c1:C1TreeViewItem>
							<c1:C1TreeViewItem Header="Item 2">
								<c1:C1TreeViewItem Header="Item 2.1" />
								<c1:C1TreeViewItem Header="Item 2.2" />
								<c1:C1TreeViewItem Header="Last Item" />
							</c1:C1TreeViewItem>
						</c1:C1TreeView>
					</StackPanel>
                </Border>

                <!-- C1HyperPanel -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1HyperPanel" Style="{StaticResource ControlTitle}" />
						<c1:C1HyperPanel x:Name="_hp1" Orientation="Horizontal" HorizontalAlignment="Center" Margin="8" Distribution="0.4" />
						<c1:C1HyperPanel x:Name="_hp2" Orientation="Horizontal" HorizontalAlignment="Center" Margin="8" Distribution="0.1" MinElementScale="0.2" ApplyOpacity="False" />
					</StackPanel>
                </Border>

                <!-- C1DragDropManager -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1DragDropManager" Style="{StaticResource ControlTitle}" />
                        <Grid x:Name="_ddGrid" Background="LightGray" ShowGridLines="True" Width="400" Height="300">
                            <Grid.RowDefinitions>
                                <RowDefinition /><RowDefinition />
                                <RowDefinition /><RowDefinition />
                                <RowDefinition /><RowDefinition />
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition /><ColumnDefinition />
                                <ColumnDefinition /><ColumnDefinition />
                                <ColumnDefinition /><ColumnDefinition />
                            </Grid.ColumnDefinitions>
                        <TextBlock Text="Drag Me" Grid.Row="1" Grid.Column="2" />
                        <TextBlock Text="Or Me" Grid.Row="3" Grid.Column="4" />
                        <Rectangle Fill="Red" Grid.Row="2" Grid.Column="0" />
                        <Rectangle Fill="Blue" Grid.Row="0" Grid.Column="4" />
                        </Grid>
                    </StackPanel>
                </Border>
                
                <!--
                =====================================================
                C1.Silverlight.Extended.dll
                =====================================================
                -->
                
                <!-- C1Expander -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1Expander (C1.Silverlight.Extended)" Style="{StaticResource ControlTitle}" />

                        <!-- simplest expander, show content below header -->
                        <c1:C1Expander Margin="2" Width="300" HeaderFontWeight="Bold" Header="Click me" Content="Collapsible Content" />

                        <!-- show content to the right of the header -->
                        <c1:C1Expander Margin="2" Width="300" ExpandDirection="Right" HeaderFontWeight="Bold" Header="Click me" Content="Collapsible Content" />

                        <!-- show content above header, add red border around the header -->
                        <c1:C1Expander Margin="2" Width="300" ExpandDirection="Up" Content="Collapsible content">
                          <c1:C1Expander.Header>
                            <Border BorderThickness="2" BorderBrush="Red">
                              <TextBlock Text="Click Me!" />
                            </Border>
                          </c1:C1Expander.Header>
                        </c1:C1Expander>

                        <!-- show content to the left of the header -->
                        <c1:C1Expander Margin="2" Width="300" ExpandDirection="Left" HeaderFontWeight="Bold" Header="Click Me!" Content="Collapsible Content" />

                      </StackPanel>
                </Border>

                <!-- C1Accordion -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1Accordion (C1.Silverlight.Extended)" Style="{StaticResource ControlTitle}" />
                        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">

                          <!-- traditional accordion (items expand below headers) -->
                          <c1:C1Accordion Height="200" Width="300" Margin="10" Fill="True" AllowCollapseAll="False">
                            <c1:C1AccordionItem Header="Beverages" Content="Tea, Coffee, Milk" />
                            <c1:C1AccordionItem Header="Dairy" Content="Milk, Cheese, Cream" />
                            <c1:C1AccordionItem Header="Desserts" Content="Pies, Fruit, Ice-cream" />
                          </c1:C1Accordion>

                          <!-- horizontal data-bound accordion -->
                          <c1:C1Accordion x:Name="_templatedAccordion" Margin="10" ExpandDirection="Right">
                            <c1:C1Accordion.ItemTemplate>
                              <DataTemplate>
                                <c1:C1AccordionItem Margin="5" Padding="5" Header="{Binding Key}" Content="{Binding Value}" />
                              </DataTemplate>
                            </c1:C1Accordion.ItemTemplate>
                          </c1:C1Accordion>

                        </StackPanel>
                      </StackPanel>
                </Border>

                <!-- C1Image -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1Image (C1.Silverlight.Imaging)" Style="{StaticResource ControlTitle}" />
                        <c1:C1Image Source="puma.gif" Stretch="None" />
                    </StackPanel>
                </Border>

                <!-- C1HtmlHost -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1HtmlHost (C1.Silverlight.Extended)" Style="{StaticResource ControlTitle}" />
						<c1:C1HtmlHost Width="400" Height="20" SourceHtml="This is &lt;b&gt;HTML&lt;/b&gt; hosted in a Browser!" />
						<c1:C1HtmlHost Width="400" Height="200" SourceUri="http://www.componentone.com" />
					</StackPanel>
                </Border>

                <!-- C1Book -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1Book (C1.Silverlight.Extended)" Style="{StaticResource ControlTitle}" />
                        <c1:C1Book x:Name="_book" Width="500" Height="300">

                            <!-- template for left pages -->
                            <c1:C1Book.LeftPageTemplate>
                                <ControlTemplate>
                                    <Border BorderThickness="1,1,2,2" BorderBrush="Gray" Background="WhiteSmoke">
                                        <StackPanel Margin="10,10,25,10">
                                            <TextBlock Text="C1Book Sample" FontSize="9" Margin="0,0,0,10" HorizontalAlignment="Left" />
                                            <ContentPresenter />
                                            <!-- content goes here -->
                                        </StackPanel>
                                    </Border>
                                </ControlTemplate>
                            </c1:C1Book.LeftPageTemplate>

                            <!-- template for right pages -->
                            <c1:C1Book.RightPageTemplate>
                                <ControlTemplate>
                                    <Border BorderThickness="1,1,2,2" BorderBrush="Gray" Background="White">
                                        <StackPanel Margin="25,10,15,10">
                                            <TextBlock Text="C1.Silverlight.Extended.dll" FontSize="9" HorizontalAlignment="Right" Margin="0,0,0,10" />
                                            <ContentPresenter />
                                            <!-- content goes here -->
                                        </StackPanel>
                                    </Border>
                                </ControlTemplate>
                            </c1:C1Book.RightPageTemplate>

                            <!-- book content: each element is a page -->
                            <TextBlock Text="This is Page 1" />
                            <TextBlock Text="This is Page 2" />
                            <TextBox Text="This is Page 3 (type here)" AcceptsReturn="True" />
                            <Button Content="This is Page 4 (click it)" />
                            <Image Source="cover1.jpg" />
                            <Image Source="cover2.jpg" />
                            <Image Source="cover3.jpg" />
                            <Image Source="cover4.jpg" />
                            <TextBlock Text="This is the last page..." />
                        </c1:C1Book>
                    </StackPanel>
                </Border>

                <!--
                =====================================================
                C1.Silverlight.RichTextBox.dll
                =====================================================
                -->
                
                <!-- C1RichTextBox (M4 version) -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1RichTextBox (C1.Silverlight.RichTextBox)" Style="{StaticResource ControlTitle}" />
						<StackPanel Orientation="Horizontal" Width="400">
							<ToggleButton x:Name="_btnBold" Padding="4,0,4,0" Content="B" FontWeight="Bold" />
							<ToggleButton x:Name="_btnItalics" Padding="4,0,4,0" Content="I" FontStyle="Italic" />
							<ToggleButton x:Name="_btnUnderline" Padding="4,0,4,0"><TextBlock Text="U" TextDecorations="Underline" /></ToggleButton>
						</StackPanel>
						<c1:C1RichTextBox x:Name="_rtb" Width="400" Height="100" TextWrapping="Wrap" Html="This is a &lt;b&gt;C1RichTextBox&lt;/b&gt; control." />
					  </StackPanel>
                </Border>

                <!--
                =====================================================
                C1.Silverlight.Uploader.dll
                =====================================================
                -->
                
                <!-- C1Uploader -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1Uploader (C1.Silverlight.Uploader)" Style="{StaticResource ControlTitle}" />
                        <StackPanel HorizontalAlignment="Center">
                            <Button Content="Upload Photos..." Width="120" HorizontalAlignment="Left" Click="Upload_Click" />
                            <ScrollViewer Width="400" Background="White">
                                <StackPanel x:Name="_spPictures" />
                            </ScrollViewer>
                        </StackPanel>
                    </StackPanel>
                </Border>

                <!--
                =====================================================
                M3 C1.Silverlight.Gauge.dll
                =====================================================
                -->

                <!-- C1RadialGauge and C1LinearGauge -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1Gauge (C1.Silverlight.Gauge)" Style="{StaticResource ControlTitle}" />

                        <!-- simple RadialGauge -->
                        <c1:C1RadialGauge x:Name="_gauge1" Width="300" Height="250" StartAngle="0" SweepAngle="270" Radius="0.9" Minimum="0" Maximum="270" Value="50">
                          <c1:C1RadialGauge.Decorators>
                                <c1:C1GaugeMark Interval="30" />
                                <c1:C1GaugeLabel Interval="30" Location="0.9" />
                                <c1:C1GaugeMark Interval="5" />
                                <c1:C1GaugeRange From="0" To="60" Location="0.4" Width="0.3" Fill="#A000F000" />
                                <c1:C1GaugeRange From="60" To="120" Location="0.4" Width="0.3" Fill="#A0F0F000" />
                                <c1:C1GaugeRange From="120" To="180" Location="0.4" Width="0.3" Fill="#A0F0A000" />
                                <c1:C1GaugeRange From="180" To="270" Location="0.4" Width="0.3" Fill="#A0F00000" />
                          </c1:C1RadialGauge.Decorators>
                        </c1:C1RadialGauge>

                        <!-- simple LinearGauge -->
                        <c1:C1LinearGauge x:Name="_gauge2" Width="300" Height="60" Minimum="0" Maximum="270" Value="50" YAxisLocation="0.5" XAxisLocation="0.1" XAxisLength="0.8">
                            <c1:C1GaugeRange Width="0.01" Fill="Black" />
                            <c1:C1GaugeLabel Interval="60" />
                            <c1:C1GaugeMark Interval="30" />
                            <c1:C1GaugeMark Interval="5" />
                        </c1:C1LinearGauge>

                        <!-- Slider used to set Gauge values -->
                        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
                          <TextBlock Width="80" />
                          <Slider x:Name="_slider" Width="300" Minimum="0" Maximum="270" Value="50" ValueChanged="_slider_ValueChanged" />
                          <TextBlock x:Name="_txtGaugeValue" Width="80" Text="50" TextAlignment="Center" />
                        </StackPanel>
                    </StackPanel>
                </Border>

                <!--
                =====================================================
                M3 C1.Silverlight.Maps.dll
                =====================================================
                -->
                
                <!-- C1Maps -->
                <!-- IMPORTANT NOTES: 
                
                  1 - C1Maps requires a web site or app to work. 
                      In a standalone, single-project Silverlight solution it will not display anything.
                
                  2 - C1Maps allows you to display geographical information from several sources, 
                      including services by Microsoft and Google. 
                      These services are NOT free, and C1Maps does NOT include a license for them. 
                      If you want to use C1Maps in your applications, you are responsible for contacting 
                      the provider and procuring the necessary license.
                
                -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1Maps (C1.Silverlight.Maps)" Style="{StaticResource ControlTitle}" />
                        <c1:C1Maps Width="500" Height="350" Center="-79.924706, 40.458833" Zoom="3" MouseMove="C1Maps_MouseMove">
                            <c1:C1MapItemsLayer>
                                <Ellipse Width="15" Height="15" Fill="Yellow" Opacity="0.5" c1:C1MapCanvas.LatLong="-79.924706, 40.458833" />
                            </c1:C1MapItemsLayer>
                        </c1:C1Maps>
                        <TextBlock x:Name="_tbMapCoords" Width="500" Text="0, 0" />
                    </StackPanel>
                </Border>

                <!--
                =====================================================
                C1.Silverlight.Chart.dll
                =====================================================
                -->
                <Border Style="{StaticResource ControlBorder}">
                    <StackPanel>
                        <TextBlock Text="C1Chart (C1.Silverlight.Chart)" Style="{StaticResource ControlTitle}" />

                        <!-- controls to customize the chart -->
                        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
                            <TextBlock Text="Chart Type: " FontSize="11" VerticalAlignment="Center" />
                            <ComboBox x:Name="_cbChartType" SelectionChanged="_cbChartType_SelectedItemChanged" SelectedIndex="0" FontSize="11" Width="150">
                                <ComboBoxItem Content="Line" />
                                <ComboBoxItem Content="Area" />
                                <ComboBoxItem Content="Column" />
                            </ComboBox>
                            <TextBlock Text="Palette: " FontSize="11" VerticalAlignment="Center" Margin="20,0,0,0" />
                            <ComboBox x:Name="_cbPalette" SelectionChanged="_cbPalette_SelectedItemChanged" SelectedIndex="0" FontSize="11" Width="150" MaxDropDownHeight="150">
                                <ComboBoxItem Content="Default" />
                                <ComboBoxItem Content="Standard" />
                                <ComboBoxItem Content="Office" />
                                <ComboBoxItem Content="GrayScale" />
                                <ComboBoxItem Content="Apex" />
                                <ComboBoxItem Content="Aspect" />
                                <ComboBoxItem Content="Civic" />
                                <ComboBoxItem Content="Concourse" />
                                <ComboBoxItem Content="Equity" />
                                <ComboBoxItem Content="Flow" />
                                <ComboBoxItem Content="Foundry" />
                                <ComboBoxItem Content="Median" />
                                <ComboBoxItem Content="Metro" />
                                <ComboBoxItem Content="Module" />
                                <ComboBoxItem Content="Opulent" />
                                <ComboBoxItem Content="Oriel" />
                                <ComboBoxItem Content="Origin" />
                                <ComboBoxItem Content="Paper" />
                                <ComboBoxItem Content="Solstice" />
                                <ComboBoxItem Content="Technic" />
                                <ComboBoxItem Content="Trek" />
                                <ComboBoxItem Content="Urban" />
                                <ComboBoxItem Content="Verve" />
                            </ComboBox>
                            <Button Content="Generate" Margin="20,0,0,0" Padding="5,0,5,0" Click="_btnChart_Click" />
                        </StackPanel>

                        <!-- chart and legend -->
                        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
                            <c1:C1Chart x:Name="_chart" Width="500" Height="350" />
                            <Border CornerRadius="5" BorderThickness="2" BorderBrush="DarkGray" Background="WhiteSmoke" Padding="5" VerticalAlignment="Center">
                                <c1:C1ChartLegend x:Name="_legend" />
                            </Border>
                        </StackPanel>
                        
                    </StackPanel>
                </Border>

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