<Page
    x:Class="DashboardUWP.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:DashboardUWP"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" Loaded="OnLoaded">
    <Page.Resources>
        <DataTemplate x:Key="HamburgerMenuItemTemplate" x:DataType="controls:HamburgerMenuImageItem">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="50"/>
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>
                <Image VerticalAlignment="Center" Width="24" Height="24" Source="{Binding Thumbnail}" Stretch="Uniform" />
                <TextBlock Text="{Binding Label}" Margin="10" VerticalAlignment="Center" Foreground="#dedede" Grid.Column="1" FontSize="16" FontFamily="Segoe UI Semibold"/>
            </Grid>
        </DataTemplate>
    </Page.Resources>
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <controls:HamburgerMenu x:Name="Menu" PaneBackground="#051839" ItemClick="OnItemClick" HamburgerHeight="42" PaneForeground="#dedede" IsPaneOpen="True" DisplayMode="CompactOverlay" CompactPaneLength="50" ItemTemplate="{ThemeResource HamburgerMenuItemTemplate}">
            <controls:HamburgerMenu.ItemsSource>
                <controls:HamburgerMenuItemCollection>
                    <controls:HamburgerMenuImageItem x:Uid="MenuItem_Dashboard" Thumbnail="Assets/24X24_Dashboard.png"/>
                    <controls:HamburgerMenuImageItem x:Uid="MenuItem_Analysis" Thumbnail="Assets/24X24_Analysis.png" />
                    <controls:HamburgerMenuImageItem x:Uid="MenuItem_Reporting" Thumbnail="Assets/24X24_Reporting.png" />
                    <controls:HamburgerMenuImageItem x:Uid="MenuItem_Tasks" Thumbnail="Assets/24X24_Tasks.png" />
                    <controls:HamburgerMenuImageItem x:Uid="MenuItem_Products" Thumbnail="Assets/24X24_Products.png" />
                </controls:HamburgerMenuItemCollection>
            </controls:HamburgerMenu.ItemsSource>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="42"/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <Image Source="Assets/AcmeLogo-vertical-100px.png" HorizontalAlignment="Left" Margin="5 10"/>
                <Frame Grid.Row="1" x:Name="ContentFrame">
                    <Frame.ContentTransitions>
                        <TransitionCollection>
                            <NavigationThemeTransition>
                                <NavigationThemeTransition.DefaultNavigationTransitionInfo>
                                    <SuppressNavigationTransitionInfo/>
                                </NavigationThemeTransition.DefaultNavigationTransitionInfo>
                            </NavigationThemeTransition>
                        </TransitionCollection>
                    </Frame.ContentTransitions>
                </Frame>
            </Grid>
        </controls:HamburgerMenu>
    </Grid>
</Page>