ProfilePage.ux

<Page ux:Class="ProfilePage" Transition="Default">
    <Router ux:Dependency="router" />
    <JavaScript File="ProfilePage.js" />
    <DockPanel ux:Name="logoutPanel">
    	<TopFrameBackground Dock="Top" Background="#000" />
        <DockPanel>
            <Panel Dock="Top" Height="50">
                <Image File="Assets/Images/GradientBg.png" Layer="Background" StretchMode="Fill" />
                <DockPanel ux:Name="navbarDock">
                    <Image File="Assets/Images/ArrowBack.png" Dock="Left" HitTestMode="LocalBounds" Width="20" Clicked="{GoBack}" />
                    <Panel Dock="Fill">
                        <ux:Include File="DropShadow.inc.ux" />
                        <Text Value="Profile" Alignment="Center" FontSize="22" Font="Regular" TextColor="#fff" TextWrapping="NoWrap" />
                    </Panel>
                    <Panel Dock="Right" Width="20" />
                </DockPanel>
            </Panel>
            <!-- Logout panel -->
            <ScrollView ux:Name="logoutScrollView" Dock="Fill" AllowedScrollDirections="Vertical" ClipToBounds="false">
                <ux:Include File="GradientBackground.inc.ux" />
                <StackPanel Padding="20">
                    <Circle Width="100" Height="100" Color="LoColor">
                        <ImageFill Url="{user.userpic_https_url}" />
                        <ux:Include File="DropShadow.inc.ux" />
                    </Circle>
                    <Text Alignment="Center" Value="{user.username}" TextColor="#fff" FontSize="22" Font="Regular" Margin="0,10,0,0" TextWrapping="NoWrap">
                        <ux:Include File="DropShadow.inc.ux" />
                    </Text>
                    <Text Alignment="Center" Value="{user.fullname}" TextColor="#fff" FontSize="20" Font="Light" TextWrapping="NoWrap">
                        <ux:Include File="DropShadow.inc.ux" />
                    </Text>
                    <Text ux:Name="domainText" Alignment="Center" TextColor="HiColor" FontSize="16" Font="Light" Value="{user.https_domain}">
                        <WhilePressed>
                            <Change domainText.Opacity="0.5" Duration="0.2" Easing="CircularInOut" />
                        </WhilePressed>
                        <Clicked>
                            <LaunchUri Uri="{user.https_domain}" />
                        </Clicked>
                    </Text>
                    <Grid Columns="2" Margin="0,20,0,0">
                        <Panel Column="1" Alignment="Right" Padding="4,0">
                            <Text Value="{user.photos_count}" TextColor="HiColor" FontSize="36" Font="Regular" TextWrapping="NoWrap" />
                            <ux:Include File="DropShadow.inc.ux" />
                        </Panel>
                        <Text Column="2" Alignment="Left" Value="photos" TextColor="#fff" FontSize="20" Font="Light" TextWrapping="NoWrap" />
                    </Grid>
                    <Grid Columns="2" Padding="2">
                        <Panel Column="1" Alignment="Right" Padding="4,0">
                            <Text Value="{user.followers_count}" TextColor="HiColor" FontSize="36" Font="Regular" TextWrapping="NoWrap" />
                            <ux:Include File="DropShadow.inc.ux" />
                        </Panel>
                        <Text Column="2" Alignment="Left" Value="followers" TextColor="#fff" FontSize="20" Font="Light" TextWrapping="NoWrap" />
                    </Grid>
                    <Grid Columns="2" Padding="2">
                        <Panel Column="1" Alignment="Right" Padding="4,0">
                            <Text Value="{user.friends_count}" TextColor="HiColor" FontSize="36" Font="Regular" TextWrapping="NoWrap" />
                            <ux:Include File="DropShadow.inc.ux" />
                        </Panel>
                        <Text Column="2" Alignment="Left" Value="friends" TextColor="#fff" FontSize="20" Font="Light" TextWrapping="NoWrap" />
                    </Grid>
                    <D500px.Button ux:Name="logoutButton" Text="Log Out" Margin="0,20,0,0" Alignment="Center">
                        <Clicked>
                            <Callback Handler="{SignOut}" />
                        </Clicked>
                    </D500px.Button>
                </StackPanel>
            </ScrollView>
        </DockPanel>
	    <BottomFrameBackground Dock="Bottom" IncludesKeyboard="false" Background="#000" />
	</DockPanel>
</Page>