Files
Server-Dashboard/Server Dashboard/LoginWindow.xaml

307 lines
12 KiB
XML

<Window x:Class="Server_Dashboard.LoginWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
xmlns:local="clr-namespace:Server_Dashboard"
x:Name="Login"
mc:Ignorable="d"
Title="Server Dashboard" Height="700" Width="500" WindowStyle="None" Background="Transparent" ResizeMode="CanResize" local:CloseProperty.Value="True">
<WindowChrome.WindowChrome>
<WindowChrome CaptionHeight="0" ResizeBorderThickness="0"/>
</WindowChrome.WindowChrome>
<Window.DataContext>
<local:LoginViewModel/>
</Window.DataContext>
<!--#region Login forms main container-->
<Border Background="{StaticResource BackgroundSurface_00dp}">
<Grid Grid.Row="0">
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="*"/>
<RowDefinition Height="80"/>
<RowDefinition Height="80"/>
<RowDefinition Height="80"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="80"/>
<RowDefinition Height=".2*"/>
</Grid.RowDefinitions>
<i:Interaction.Triggers>
<i:EventTrigger EventName="MouseDown">
<i:CallMethodAction MethodName="DragMove" TargetObject="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Window}}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
<!--#region Custom title bar-->
<Grid Background="{StaticResource BackgroundSurface_04dp}" Grid.Row="0" Grid.ColumnSpan="2">
<Grid.Effect>
<DropShadowEffect Direction="270" ShadowDepth="0" BlurRadius="5"/>
</Grid.Effect>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="40"/>
</Grid.ColumnDefinitions>
<Label Grid.Column="0"/>
<Button Style="{StaticResource CloseButton}" Grid.Column="2" Content="✕">
<i:Interaction.Triggers>
<i:EventTrigger EventName="Click">
<i:CallMethodAction MethodName="Close" TargetObject="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Window}}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</Button>
</Grid>
<!--#endregion-->
<!--#region Greeting text-->
<Border
Height="100"
BorderBrush="{StaticResource DeepPurple_400}"
BorderThickness="0 2 0 2"
Background="{StaticResource BackgroundSurface_00dp}"
Grid.Row="1"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Grid.ColumnSpan="2"
>
<StackPanel
VerticalAlignment="Center"
Margin="0 0 0 5"
>
<TextBlock
Text="Server Dashboard"
FontSize="30"
HorizontalAlignment="Center"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.64"/>
</TextBlock.Foreground>
</TextBlock>
<TextBlock
Text="Login"
FontSize="30"
HorizontalAlignment="Center"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.64"/>
</TextBlock.Foreground>
</TextBlock>
</StackPanel>
</Border>
<!--#endregion-->
<!--#region Username form-->
<Border
CornerRadius="4"
Margin="0 10 0 10"
Width="350"
Height="60"
Background="{StaticResource BackgroundSurface_01dp}"
Grid.Row="2"
Grid.ColumnSpan="2"
>
<Border.Effect>
<DropShadowEffect
Direction="0"
ShadowDepth="0"
BlurRadius="5"
/>
</Border.Effect>
<Grid Grid.Column="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Image
Grid.Column="0"
Height="30"
Source="Assets/Images/userlogin.png"
/>
<TextBox
Text="{Binding Username}"
x:Name="UserName"
Grid.Column="1"
Margin="0 0 5 0"
/>
<TextBlock
VerticalAlignment="Center"
HorizontalAlignment="Left"
Text="Username"
Visibility="{Binding ElementName=UserName, Path=Text.IsEmpty, Converter={StaticResource UserNameVisibillity}}"
Grid.Column="1"
IsHitTestVisible="False"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.12"/>
</TextBlock.Foreground>
</TextBlock>
</Grid>
</Border>
<!--#endregion-->
<!--#region Password form-->
<Border
Margin="0 10 0 10"
Background="{StaticResource BackgroundSurface_01dp}"
Grid.Row="3"
Grid.ColumnSpan="2"
Width="350"
CornerRadius="4"
Padding="0 0 5 0"
>
<Border.Effect>
<DropShadowEffect Direction="0" ShadowDepth="0" BlurRadius="5"/>
</Border.Effect>
<Grid Grid.Column="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Height="30" Source="Assets/Images/userpasswd.png"/>
<PasswordBox
Width="290"
Height="60"
local:MonitorPasswordProperty.Value="True"
Grid.Column="1"
x:Name="Password"
>
<PasswordBox.InputBindings>
<KeyBinding
Key="Return"
Command="{Binding LoginCommand}"
CommandParameter="{Binding ElementName=Login}"
/>
</PasswordBox.InputBindings>
</PasswordBox>
<TextBlock
Visibility="{Binding ElementName=Password, Path=(local:HasTextProperty.Value), Converter={StaticResource UserNameVisibillity}}" x:Name="PasswordHint"
Text="Password"
Grid.Column="1"
IsHitTestVisible="False"
VerticalAlignment="Center"
HorizontalAlignment="Left"
>
<TextBlock.InputBindings>
<KeyBinding
Key="Return"
Command="{Binding LoginCommand}"
CommandParameter="{Binding ElementName=Login}"
/>
</TextBlock.InputBindings>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.12"/>
</TextBlock.Foreground>
</TextBlock>
</Grid>
</Border>
<!--#endregion-->
<!--#region Login button-->
<Button
Height="60"
Width="350"
Command="{Binding LoginCommand}"
CommandParameter="{Binding ElementName=Login}"
Grid.Row="4"
Content="LOGIN"
Grid.ColumnSpan="2"
/>
<!--#endregion-->
<!--#region Error text-->
<TextBlock
Text="{Binding ErrorText}"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Grid.Row="5"
Grid.Column="1"
Foreground="{StaticResource ErrorRed}"
FontSize="14"
/>
<!--#endregion-->
<!--#region Remember me and Password forgotten link-->
<Grid Grid.Row="6">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<CheckBox
IsChecked="{Binding RememberUser}"
Grid.Column="0"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Margin="75 0 0 0"
/>
<TextBlock
Grid.Column="1"
Text="Remember me?"
FontSize="14"
VerticalAlignment="Center"
HorizontalAlignment="Left"
Margin="10 0 0 0"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.64"/>
</TextBlock.Foreground>
</TextBlock>
<TextBlock
Grid.Column="3"
FontSize="14"
Margin="0 0 75 0"
VerticalAlignment="Center"
HorizontalAlignment="Right"
>
<!--Send recovery Email to user, probably replace with a button-->
<Hyperlink
NavigateUri="https://example.com"
local:HyperlinkExtensions.IsExternal="True"
>
Forgot password
</Hyperlink>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.64"/>
</TextBlock.Foreground>
</TextBlock>
</Grid>
<!--#endregion-->
<!--#region Link to register form-->
<Grid Grid.Row="7">
<StackPanel
Orientation="Horizontal"
HorizontalAlignment="Center"
>
<TextBlock
Text="Don't have an account?"
FontSize="16"
VerticalAlignment="Center"
HorizontalAlignment="Right"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.64"/>
</TextBlock.Foreground>
</TextBlock>
<Button
Command="{Binding RegisterCommand}"
Content="REGISTER"
VerticalAlignment="Center"
HorizontalAlignment="Left"
FontSize="12"
Height="30"
Width="80"
Margin="10 0 0 0"
/>
</StackPanel>
</Grid>
<!--#endregion-->
</Grid>
</Border>
<!--#endregion-->
</Window>