cambooth/src/CamBooth/CamBooth.App/MainWindow.xaml

549 lines
26 KiB
XML

<Window x:Class="CamBooth.App.MainWindow"
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:ui="http://schemas.lepo.co/wpfui/2022/xaml"
xmlns:local="clr-namespace:CamBooth.App"
xmlns:liveView="clr-namespace:CamBooth.App.Features.LiveView"
xmlns:core="clr-namespace:CamBooth.App.Core"
mc:Ignorable="d"
Title="MainWindow"
Background="Black"
Width="1600" Height="900"
WindowStyle="None"
ResizeMode="NoResize"
AllowsTransparency="True"
WindowStartupLocation="CenterScreen"
HorizontalAlignment="Stretch">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<!-- LiveView -->
<Frame Grid.Row="0"
x:Name="MainFrame"
NavigationUIVisibility="Hidden"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Background="Transparent"
Panel.ZIndex="1" />
<!-- Picture Gallery -->
<Frame Grid.Row="0"
x:Name="PicturePanel"
NavigationUIVisibility="Hidden"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Background="Transparent"
Panel.ZIndex="1" />
<!-- Timer overlay: fullscreen so the ring centers on the camera view -->
<Grid Grid.Row="0"
x:Name="TimerPanel"
Background="Transparent"
Panel.ZIndex="2"
Visibility="Hidden">
<liveView:TimerControlRectangleAnimation x:Name="TimerControlRectangleAnimation"
HorizontalAlignment="Center"
VerticalAlignment="Center"/>
</Grid>
<!-- Action Buttons Container (bottom-right) -->
<StackPanel Grid.Row="0"
x:Name="ActionButtonsContainer"
HorizontalAlignment="Right"
VerticalAlignment="Bottom"
Margin="20"
Panel.ZIndex="3"
Visibility="Hidden"
Orientation="Vertical"
Width="100">
<!-- Gallery/Sammlung Button -->
<Border Background="#1A1A1A"
BorderBrush="#D4AF37"
BorderThickness="2"
CornerRadius="10"
Padding="8"
Cursor="Hand"
Margin="0,0,0,12"
MouseLeftButtonDown="SetVisibilityPicturePanel"
Focusable="False">
<Border.Effect>
<DropShadowEffect Color="Black" BlurRadius="12" ShadowDepth="4" Opacity="0.5"/>
</Border.Effect>
<Border.Triggers>
<EventTrigger RoutedEvent="MouseEnter">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="(Border.RenderTransform).(ScaleTransform.ScaleX)"
To="1.05" Duration="0:0:0.2"/>
<DoubleAnimation Storyboard.TargetProperty="(Border.RenderTransform).(ScaleTransform.ScaleY)"
To="1.05" Duration="0:0:0.2"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="MouseLeave">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="(Border.RenderTransform).(ScaleTransform.ScaleX)"
To="1.0" Duration="0:0:0.2"/>
<DoubleAnimation Storyboard.TargetProperty="(Border.RenderTransform).(ScaleTransform.ScaleY)"
To="1.0" Duration="0:0:0.2"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Border.Triggers>
<Border.RenderTransform>
<ScaleTransform ScaleX="1" ScaleY="1" CenterX="0.5" CenterY="0.5"/>
</Border.RenderTransform>
<Border.RenderTransformOrigin>
<Point X="0.5" Y="0.5"/>
</Border.RenderTransformOrigin>
<StackPanel Orientation="Vertical" HorizontalAlignment="Center">
<!-- Gallery Icon -->
<Grid Width="55" Height="55" Margin="0,0,0,6">
<Border BorderBrush="#D4AF37"
BorderThickness="3"
CornerRadius="3"
Padding="4">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Border Grid.Row="0" Grid.Column="0"
Background="#D4AF37"
Margin="1.5"
CornerRadius="1.5"/>
<Border Grid.Row="0" Grid.Column="1"
Background="#D4AF37"
Margin="1.5"
CornerRadius="1.5"/>
<Border Grid.Row="1" Grid.Column="0"
Background="#D4AF37"
Margin="1.5"
CornerRadius="1.5"/>
<Border Grid.Row="1" Grid.Column="1"
Background="#D4AF37"
Margin="1.5"
CornerRadius="1.5"/>
</Grid>
</Border>
</Grid>
<!-- Text -->
<TextBlock Text="Foto"
Foreground="White"
FontSize="11"
FontWeight="Bold"
TextAlignment="Center"
Margin="0,0,0,2"/>
<TextBlock Text="Galerie"
Foreground="#D4AF37"
FontSize="8"
FontWeight="SemiBold"
TextAlignment="Center"/>
</StackPanel>
</Border>
<!-- Badge for new photos -->
<Border x:Name="NewPhotosBadge"
Background="#E61A1A1A"
BorderBrush="#FF0000"
BorderThickness="2"
CornerRadius="12"
Width="30"
Height="30"
HorizontalAlignment="Right"
VerticalAlignment="Top"
Margin="0,-42,-10,0"
Visibility="Collapsed"
Panel.ZIndex="10">
<TextBlock x:Name="NewPhotoCountText"
Text="1"
Foreground="White"
FontSize="16"
FontWeight="Bold"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
</Border>
<!-- QR/Sharing Button -->
<Border Background="#1A1A1A"
BorderBrush="#D4AF37"
BorderThickness="2"
CornerRadius="10"
Padding="8"
Cursor="Hand"
MouseLeftButtonDown="ShowQRCode"
Focusable="False">
<Border.Effect>
<DropShadowEffect Color="Black" BlurRadius="12" ShadowDepth="4" Opacity="0.5"/>
</Border.Effect>
<Border.Triggers>
<EventTrigger RoutedEvent="MouseEnter">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="(Border.RenderTransform).(ScaleTransform.ScaleX)"
To="1.05" Duration="0:0:0.2"/>
<DoubleAnimation Storyboard.TargetProperty="(Border.RenderTransform).(ScaleTransform.ScaleY)"
To="1.05" Duration="0:0:0.2"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="MouseLeave">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="(Border.RenderTransform).(ScaleTransform.ScaleX)"
To="1.0" Duration="0:0:0.2"/>
<DoubleAnimation Storyboard.TargetProperty="(Border.RenderTransform).(ScaleTransform.ScaleY)"
To="1.0" Duration="0:0:0.2"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Border.Triggers>
<Border.RenderTransform>
<ScaleTransform ScaleX="1" ScaleY="1" CenterX="0.5" CenterY="0.5"/>
</Border.RenderTransform>
<Border.RenderTransformOrigin>
<Point X="0.5" Y="0.5"/>
</Border.RenderTransformOrigin>
<StackPanel Orientation="Vertical" HorizontalAlignment="Center">
<!-- QR Code Icon -->
<Grid Width="55" Height="55" Margin="0,0,0,6">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Border Grid.Row="0" Grid.Column="0" Background="#D4AF37" Margin="1.5" CornerRadius="1.5"/>
<Border Grid.Row="0" Grid.Column="1" Background="Transparent" Margin="1.5"/>
<Border Grid.Row="0" Grid.Column="2" Background="#D4AF37" Margin="1.5" CornerRadius="1.5"/>
<Border Grid.Row="1" Grid.Column="0" Background="Transparent" Margin="1.5"/>
<Border Grid.Row="1" Grid.Column="1" Background="#D4AF37" Margin="1.5" CornerRadius="1.5"/>
<Border Grid.Row="1" Grid.Column="2" Background="Transparent" Margin="1.5"/>
<Border Grid.Row="2" Grid.Column="0" Background="#D4AF37" Margin="1.5" CornerRadius="1.5"/>
<Border Grid.Row="2" Grid.Column="1" Background="Transparent" Margin="1.5"/>
<Border Grid.Row="2" Grid.Column="2" Background="#D4AF37" Margin="1.5" CornerRadius="1.5"/>
<Border Grid.RowSpan="3" Grid.ColumnSpan="3"
BorderBrush="#D4AF37"
BorderThickness="2"
CornerRadius="3"/>
</Grid>
<!-- Text -->
<TextBlock Text="Fotos"
Foreground="White"
FontSize="10"
FontWeight="Bold"
TextAlignment="Center"
Margin="0,0,0,2"/>
<TextBlock Text="aufs Handy"
Foreground="#D4AF37"
FontSize="8"
FontWeight="SemiBold"
TextAlignment="Center"/>
</StackPanel>
</Border>
</StackPanel>
<!-- Hide Debug Button (top-right) -->
<Button Grid.Row="0"
x:Name="HideDebugButton"
Content="Hide Debug"
Click="SetVisibilityDebugConsole"
Style="{StaticResource SecondaryButtonStyle}"
Width="160"
Height="60"
HorizontalAlignment="Right"
VerticalAlignment="Top"
Margin="20"
Panel.ZIndex="5"
Visibility="Hidden"
FontSize="16" />
<StackPanel Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Bottom" Name="ButtonPanel" Background="Transparent" Panel.ZIndex="2"
Visibility="Hidden"
Margin="0 0 0 30">
<!-- Take Photo Button -->
<Button Width="240" Height="120"
Click="StartTakePhotoProcess"
Style="{StaticResource ModernRounded3DButtonStyle}"
FontSize="64"
Foreground="White"
Margin="0 0 5 0"
Background="Red"
BorderBrush="Transparent"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Content="🔴"/>
<Button x:Name="DebugCloseButton"
Content="Close"
Style="{StaticResource SecondaryButtonStyle}"
Click="CloseApp"
Width="200"
Height="75"
VerticalAlignment="Bottom"
Margin="0 0 5 0"
FontSize="16"
FontWeight="Bold" />
</StackPanel>
<!-- Gallery Prompt -->
<Border Grid.Row="0"
x:Name="GalleryPrompt"
HorizontalAlignment="Center"
VerticalAlignment="Top"
Margin="20,80,20,20"
Padding="16"
Background="#E61A1A1A"
BorderBrush="#66FFFFFF"
BorderThickness="1"
CornerRadius="12"
Panel.ZIndex="4"
Visibility="Collapsed">
<StackPanel Orientation="Horizontal" VerticalAlignment="Center">
<TextBlock Text="Foto gespeichert"
Foreground="White"
FontSize="24"
FontWeight="SemiBold"
VerticalAlignment="Center"
Margin="0 0 12 0" />
<Button Content="Jetzt in Galerie ansehen"
Click="OpenGalleryFromPrompt"
Style="{StaticResource PrimaryActionButtonStyle}"
Width="240"
Height="52"
FontWeight="SemiBold" />
</StackPanel>
</Border>
<!-- Shutdown Slider (bottom-left) -->
<!-- <Grid Grid.Row="0" -->
<!-- x:Name="ShutdownDock" -->
<!-- HorizontalAlignment="Left" -->
<!-- VerticalAlignment="Bottom" -->
<!-- Margin="20" -->
<!-- Panel.ZIndex="3" -->
<!-- Visibility="Hidden"> -->
<!-- <Grid.ColumnDefinitions> -->
<!-- <ColumnDefinition Width="Auto" /> -->
<!-- <ColumnDefinition Width="Auto" /> -->
<!-- </Grid.ColumnDefinitions> -->
<!-- -->
<!-- <ui:Button Grid.Column="0" -->
<!-- x:Name="ShutdownToggleButton" -->
<!-- Content="&#xE7E8;" -->
<!-- FontFamily="Segoe MDL2 Assets" -->
<!-- FontSize="28" -->
<!-- Width="64" -->
<!-- Height="64" -->
<!-- Appearance="Danger" -->
<!-- Click="ToggleShutdownSlider" /> -->
<!-- -->
<!-- <Border Grid.Column="1" -->
<!-- Width="160" -->
<!-- Height="64" -->
<!-- Margin="8 0 0 0" -->
<!-- CornerRadius="10" -->
<!-- Background="#44202020" -->
<!-- ClipToBounds="True"> -->
<!-- <Grid RenderTransformOrigin="0.5,0.5"> -->
<!-- <Grid.RenderTransform> -->
<!-- <TranslateTransform x:Name="ShutdownSliderTransform" X="160" /> -->
<!-- </Grid.RenderTransform> -->
<!-- <ui:Button x:Name="ShutdownConfirmButton" -->
<!-- Content="&#xE7E8;" -->
<!-- FontFamily="Segoe MDL2 Assets" -->
<!-- FontSize="24" -->
<!-- Appearance="Danger" -->
<!-- Width="160" -->
<!-- Height="64" -->
<!-- Click="ShutdownWindows" /> -->
<!-- </Grid> -->
<!-- </Border> -->
<!-- </Grid> -->
<!-- Flash overlay: briefly flashes white on shutter release -->
<Grid x:Name="FlashOverlay"
Grid.RowSpan="2"
Background="White"
Opacity="0"
Panel.ZIndex="9"
IsHitTestVisible="False"/>
<!-- Loading Overlay -->
<Grid Grid.RowSpan="2"
x:Name="LoadingOverlay"
Background="#DD000000"
Panel.ZIndex="11">
<Border Background="#E61A1A1A"
BorderBrush="#66FFFFFF"
BorderThickness="1"
CornerRadius="20"
Padding="48"
MaxWidth="600"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBlock Text="CamBooth wird geladen..."
Foreground="White"
FontSize="42"
FontWeight="Bold"
TextAlignment="Center"
Margin="0 0 0 30"/>
<!-- Loading Spinner -->
<Grid Width="100" Height="100" Margin="0 0 0 20">
<Ellipse Width="80" Height="80"
Stroke="#D4AF37"
StrokeThickness="6"
Opacity="0.3"
HorizontalAlignment="Center"
VerticalAlignment="Center"/>
<Ellipse x:Name="LoadingSpinner"
Width="80" Height="80"
Stroke="#D4AF37"
StrokeThickness="6"
StrokeDashArray="60 200"
StrokeDashCap="Round"
RenderTransformOrigin="0.5,0.5"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<Ellipse.RenderTransform>
<RotateTransform x:Name="LoadingSpinnerTransform" Angle="0"/>
</Ellipse.RenderTransform>
<Ellipse.Triggers>
<EventTrigger RoutedEvent="Ellipse.Loaded">
<BeginStoryboard>
<Storyboard RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="LoadingSpinnerTransform"
Storyboard.TargetProperty="Angle"
From="0" To="360"
Duration="0:0:1.5"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Ellipse.Triggers>
</Ellipse>
</Grid>
<TextBlock x:Name="LoadingStatusText"
Text="Fotos werden geladen..."
Foreground="#FFE8E8E8"
FontSize="20"
TextAlignment="Center"
TextWrapping="Wrap"
Margin="0 0 0 10"/>
<TextBlock x:Name="LoadingCountText"
Text="0 Fotos gefunden"
Foreground="#FFCCCCCC"
FontSize="16"
TextAlignment="Center"
Margin="0 0 0 0"/>
</StackPanel>
</Border>
</Grid>
<!-- Welcome Overlay -->
<Grid Grid.RowSpan="2"
x:Name="WelcomeOverlay"
Background="#CC000000"
Panel.ZIndex="10"
Visibility="Collapsed">
<Border Background="#E61A1A1A"
BorderBrush="#66FFFFFF"
BorderThickness="1"
CornerRadius="20"
Padding="48"
MaxWidth="900"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<StackPanel HorizontalAlignment="Center">
<TextBlock Text="Willkommen bei CamBooth!"
Foreground="White"
FontSize="56"
FontWeight="Bold"
TextAlignment="Center"
Margin="0 0 0 20"/>
<TextBlock Text="In wenigen Sekunden bist du bereit: Mit Start aktivierst du die Kamera und kannst direkt loslegen."
Foreground="#FFE8E8E8"
FontSize="28"
TextAlignment="Center"
TextWrapping="Wrap"
Margin="0 0 0 16"/>
<ui:Button Click="StartExperience"
Style="{StaticResource PrimaryActionButtonStyle}"
Width="480"
Height="100"
HorizontalAlignment="Center"
Foreground="#1F1A00"
Background="#FFFFD280"
Margin="0 12 0 0">
<TextBlock Text="Party starten"
FontSize="52"
FontWeight="Bold"
TextAlignment="Center"
HorizontalAlignment="Center"
VerticalAlignment="Center"/>
</ui:Button>
</StackPanel>
</Border>
</Grid>
<!-- DebugFrame -->
<Frame Grid.Row="1"
x:Name="DebugFrame"
Margin="5"
NavigationUIVisibility="Hidden"
VerticalAlignment="Bottom"
HorizontalAlignment="Center"
Background="LightGreen"
Panel.ZIndex="2" />
<!-- QR-Code Dialog -->
<core:BaseDialogOverlay x:Name="QRCodeOverlay"
DialogTitle="Alle Fotos aufs Handy"
Grid.RowSpan="2"
Panel.ZIndex="200"/>
<!-- Shutdown-Bestätigung Dialog -->
<core:BaseDialogOverlay x:Name="ShutdownConfirmOverlay"
DialogTitle="Sicherheitsabfrage"
PrimaryButtonText="Ja, ausschalten"
CloseButtonText="Abbrechen"
Grid.RowSpan="2"
Panel.ZIndex="200">
<TextBlock Text="Möchtest du die Fotobox wirklich ausschalten?"
Foreground="#FFE8E8E8"
FontSize="24"
TextAlignment="Center"
TextWrapping="Wrap"
MaxWidth="600"/>
</core:BaseDialogOverlay>
</Grid>
</Window>