<?xml version="1.0" encoding="utf-8"?>
<UserControl x:Class="GeoDashboard.MainPage" FontFamily="Segoe UI" FontSize="12" Foreground="White" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="700" 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" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:esri="http://schemas.esri.com/arcgis/client/2009" xmlns:local="clr-namespace:GeoDashboard">

  <UserControl.Resources>

    <!-- our ViewModel -->
    <local:ViewModel x:Key="_vm" />

  </UserControl.Resources>

  <Grid x:Name="LayoutRoot" Background="#ff252525" DataContext="{StaticResource _vm}">
    <Grid.RowDefinitions>
      <RowDefinition Height="auto" />
      <RowDefinition MinHeight="300" />
      <RowDefinition />
    </Grid.RowDefinitions>

    <!-- app title bar -->
    <Grid Background="Black">
      <Grid.RowDefinitions>
        <RowDefinition Height="auto" />
        <RowDefinition Height="auto" />
      </Grid.RowDefinitions>
      <StackPanel Orientation="Horizontal" Grid.RowSpan="2">
        <Image Source="Resources/slLogo_48.png" Margin="8" />
        <TextBlock Text="ComponentOne GeoDashboard" Foreground="White" FontSize="28" FontFamily="Segoe UI Light" VerticalAlignment="Center" />
      </StackPanel>
      <TextBlock Text="{Binding SelectedLocation, TargetNullValue='Please select a location within the USA.'}" Foreground="White" FontSize="20" HorizontalAlignment="Right" />
      <HyperlinkButton Name="_goToCurrentLocation" Grid.Row="1" Content="Go to current location" HorizontalAlignment="Right" Foreground="White" />
    </Grid>

    <!-- map -->
    <esri:Map Name="_map" Grid.Row="1" WrapAround="True" Extent="-9120937, 4724643, -8695365, 5142031">
      <esri:ArcGISTiledMapServiceLayer Url="http://services.arcgisonline.com:80/ArcGIS/rest/services/NatGeo_World_Map/MapServer" />
      <esri:ArcGISTiledMapServiceLayer ID="_demographics" Url="http://services.arcgisonline.com:80/ArcGIS/rest/services/NatGeo_World_Map/MapServer" Opacity=".4" Visible="False" />
    </esri:Map>

    <!-- cross-hair -->
    <Grid IsHitTestVisible="False" Grid.Row="1">
      <Ellipse Width="150" Height="150" Stroke="{StaticResource _brCrossHair}" StrokeThickness="2" VerticalAlignment="Center" HorizontalAlignment="Center" />
      <Ellipse Width="75" Height="75" Stroke="{StaticResource _brCrossHair}" StrokeThickness="2" VerticalAlignment="Center" HorizontalAlignment="Center" />
      <Rectangle HorizontalAlignment="Center" VerticalAlignment="Stretch" Fill="{StaticResource _brCrossHair}" Width="2" />
      <Rectangle HorizontalAlignment="Stretch" VerticalAlignment="Center" Fill="{StaticResource _brCrossHair}" Height="2" />
    </Grid>

    <!-- info tiles -->
    <ScrollViewer Grid.Row="2">
      <local:TilePanel Name="_gTiles" Background="Transparent">
        <local:TapestryTile />
        <local:SexTile />
        <local:AgeTile />
        <local:IncomeTile />
        <local:NetWorthTile />
        <local:AboutTile />
        <local:HomeValueTile />
        <local:HomeValueHistogramTile />
      </local:TilePanel>
    </ScrollViewer>
  </Grid>
</UserControl>