Add project files.
This commit is contained in:
433
ClipForge/MainWindow.xaml
Normal file
433
ClipForge/MainWindow.xaml
Normal file
@@ -0,0 +1,433 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<Window
|
||||
x:Class="ClipForge.MainWindow"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:local="using:ClipForge"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
mc:Ignorable="d"
|
||||
Title="ClipForge">
|
||||
|
||||
<Window.SystemBackdrop>
|
||||
<MicaBackdrop />
|
||||
</Window.SystemBackdrop>
|
||||
|
||||
<Grid>
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition Width="200"/>
|
||||
<ColumnDefinition Width="*"/>
|
||||
</Grid.ColumnDefinitions>
|
||||
|
||||
<!-- SIDEBAR -->
|
||||
<Border Grid.Column="0"
|
||||
Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
|
||||
BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
|
||||
BorderThickness="0,0,1,0">
|
||||
<Grid>
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="48"/>
|
||||
<RowDefinition Height="*"/>
|
||||
<RowDefinition Height="Auto"/>
|
||||
</Grid.RowDefinitions>
|
||||
|
||||
<!-- App title -->
|
||||
<Border Grid.Row="0" Padding="16,0">
|
||||
<TextBlock Text="CLIPFORGE"
|
||||
FontSize="13"
|
||||
FontWeight="Bold"
|
||||
CharacterSpacing="80"
|
||||
Foreground="#E8FF47"
|
||||
VerticalAlignment="Center"/>
|
||||
</Border>
|
||||
|
||||
<!-- Nav items -->
|
||||
<StackPanel Grid.Row="1" Spacing="2" Padding="8,8">
|
||||
<Button x:Name="NavClips"
|
||||
HorizontalAlignment="Stretch"
|
||||
Click="NavClips_Click"
|
||||
Style="{StaticResource AccentButtonStyle}">
|
||||
<StackPanel Orientation="Horizontal" Spacing="10">
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="14"/>
|
||||
<TextBlock Text="Clips"
|
||||
FontSize="13"
|
||||
FontWeight="SemiBold"/>
|
||||
</StackPanel>
|
||||
</Button>
|
||||
<Button x:Name="NavSettings"
|
||||
HorizontalAlignment="Stretch"
|
||||
Click="NavSettings_Click">
|
||||
<StackPanel Orientation="Horizontal" Spacing="10">
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="14"/>
|
||||
<TextBlock Text="Settings"
|
||||
FontSize="13"
|
||||
FontWeight="SemiBold"/>
|
||||
</StackPanel>
|
||||
</Button>
|
||||
</StackPanel>
|
||||
|
||||
<!-- Record button -->
|
||||
<Button x:Name="RecordButton"
|
||||
Grid.Row="2"
|
||||
Margin="8"
|
||||
HorizontalAlignment="Stretch"
|
||||
Click="RecordButton_Click">
|
||||
<StackPanel Orientation="Horizontal" Spacing="8">
|
||||
<Ellipse x:Name="RecordDot"
|
||||
Width="8" Height="8"
|
||||
Fill="#FF4757"/>
|
||||
<TextBlock x:Name="RecordLabel"
|
||||
Text="CAPTURING"
|
||||
FontSize="11"
|
||||
FontWeight="Bold"
|
||||
CharacterSpacing="40"/>
|
||||
</StackPanel>
|
||||
</Button>
|
||||
</Grid>
|
||||
</Border>
|
||||
|
||||
<!-- MAIN CONTENT -->
|
||||
<Grid Grid.Column="1">
|
||||
|
||||
<!-- CLIPS PAGE -->
|
||||
<Grid x:Name="ClipsPage" Visibility="Visible">
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="Auto"/>
|
||||
<RowDefinition Height="Auto"/>
|
||||
<RowDefinition Height="*"/>
|
||||
</Grid.RowDefinitions>
|
||||
|
||||
<!-- Header -->
|
||||
<Border Grid.Row="0" Padding="24,20,24,0">
|
||||
<Grid>
|
||||
<StackPanel Orientation="Horizontal" Spacing="12"
|
||||
VerticalAlignment="Bottom">
|
||||
<TextBlock Text="My Clips"
|
||||
FontSize="24"
|
||||
FontWeight="Bold"/>
|
||||
<TextBlock x:Name="ClipCountText"
|
||||
Text="0 clips"
|
||||
FontSize="12"
|
||||
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
|
||||
VerticalAlignment="Bottom"
|
||||
Margin="0,0,0,3"/>
|
||||
</StackPanel>
|
||||
<Button Content="Open Folder"
|
||||
HorizontalAlignment="Right"
|
||||
Click="OpenFolder_Click"/>
|
||||
</Grid>
|
||||
</Border>
|
||||
|
||||
<!-- Toolbar -->
|
||||
<Border Grid.Row="1" Padding="24,12">
|
||||
<AutoSuggestBox x:Name="SearchBox"
|
||||
PlaceholderText="Search clips..."
|
||||
Width="260"
|
||||
HorizontalAlignment="Left"
|
||||
TextChanged="SearchBox_TextChanged"/>
|
||||
</Border>
|
||||
|
||||
<!-- Clip Grid -->
|
||||
<ScrollViewer Grid.Row="2" Padding="24,0,24,24">
|
||||
<ItemsControl x:Name="ClipGrid">
|
||||
<ItemsControl.ItemsPanel>
|
||||
<ItemsPanelTemplate>
|
||||
<ItemsWrapGrid Orientation="Horizontal"
|
||||
ItemWidth="232"/>
|
||||
</ItemsPanelTemplate>
|
||||
</ItemsControl.ItemsPanel>
|
||||
<ItemsControl.ItemTemplate>
|
||||
<DataTemplate x:DataType="local:ClipFile">
|
||||
<Border Width="220"
|
||||
Margin="0,0,12,12"
|
||||
Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
|
||||
BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
|
||||
BorderThickness="1"
|
||||
CornerRadius="8">
|
||||
<Grid>
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="124"/>
|
||||
<RowDefinition Height="Auto"/>
|
||||
</Grid.RowDefinitions>
|
||||
|
||||
<!-- Thumbnail -->
|
||||
<Border Grid.Row="0"
|
||||
Background="#1a1a2e"
|
||||
CornerRadius="8,8,0,0">
|
||||
<Grid>
|
||||
<!-- Placeholder icon -->
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="32"
|
||||
Foreground="#333345"
|
||||
HorizontalAlignment="Center"
|
||||
VerticalAlignment="Center"/>
|
||||
<!-- Actual thumbnail -->
|
||||
<Image Stretch="UniformToFill"
|
||||
HorizontalAlignment="Center"
|
||||
VerticalAlignment="Center">
|
||||
<Image.Source>
|
||||
<BitmapImage UriSource="{x:Bind ThumbnailPath, Mode=OneWay}"
|
||||
CreateOptions="IgnoreImageCache"/>
|
||||
</Image.Source>
|
||||
</Image>
|
||||
</Grid>
|
||||
</Border>
|
||||
|
||||
<!-- Duration badge -->
|
||||
<Border Grid.Row="0"
|
||||
Background="#99000000"
|
||||
CornerRadius="4"
|
||||
Padding="6,2"
|
||||
HorizontalAlignment="Right"
|
||||
VerticalAlignment="Bottom"
|
||||
Margin="0,0,6,6">
|
||||
<TextBlock Text="{x:Bind Duration}"
|
||||
FontSize="10"
|
||||
FontFamily="Consolas"
|
||||
Foreground="White"/>
|
||||
</Border>
|
||||
|
||||
<!-- Info -->
|
||||
<Border Grid.Row="1" Padding="10,8">
|
||||
<StackPanel Spacing="6">
|
||||
<TextBlock Text="{x:Bind Title}"
|
||||
FontSize="12"
|
||||
FontWeight="SemiBold"
|
||||
TextTrimming="CharacterEllipsis"/>
|
||||
<Grid>
|
||||
<TextBlock Text="{x:Bind CreatedAtDisplay}"
|
||||
FontSize="10"
|
||||
Foreground="{ThemeResource TextFillColorSecondaryBrush}"/>
|
||||
<TextBlock Text="{x:Bind FileSize}"
|
||||
FontSize="10"
|
||||
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
|
||||
HorizontalAlignment="Right"/>
|
||||
</Grid>
|
||||
<StackPanel Orientation="Horizontal" Spacing="6">
|
||||
<Button Tag="{x:Bind Path}"
|
||||
Click="TrimClip_Click"
|
||||
FontSize="11" Padding="8,4">
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="12"/>
|
||||
</Button>
|
||||
<Button Tag="{x:Bind Path}"
|
||||
Click="RenameClip_Click"
|
||||
FontSize="11" Padding="8,4">
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="12"/>
|
||||
</Button>
|
||||
<Button Tag="{x:Bind Path}"
|
||||
Click="DeleteClip_Click"
|
||||
FontSize="11" Padding="8,4">
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="12"/>
|
||||
</Button>
|
||||
</StackPanel>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
</Grid>
|
||||
</Border>
|
||||
</DataTemplate>
|
||||
</ItemsControl.ItemTemplate>
|
||||
</ItemsControl>
|
||||
</ScrollViewer>
|
||||
</Grid>
|
||||
|
||||
<!-- SETTINGS PAGE -->
|
||||
<Grid x:Name="SettingsPage" Visibility="Collapsed">
|
||||
<ScrollViewer Padding="24">
|
||||
<StackPanel Spacing="24" MaxWidth="520" HorizontalAlignment="Left">
|
||||
|
||||
<TextBlock Text="Settings"
|
||||
FontSize="24"
|
||||
FontWeight="Bold"/>
|
||||
|
||||
<!-- Clip Length -->
|
||||
<Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
|
||||
BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
|
||||
BorderThickness="1"
|
||||
CornerRadius="8"
|
||||
Padding="20">
|
||||
<StackPanel Spacing="12">
|
||||
<StackPanel Orientation="Horizontal" Spacing="8">
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="16"
|
||||
VerticalAlignment="Center"/>
|
||||
<TextBlock Text="Clip Length"
|
||||
FontSize="14"
|
||||
FontWeight="SemiBold"
|
||||
VerticalAlignment="Center"/>
|
||||
</StackPanel>
|
||||
<TextBlock Text="How many seconds to save when you press the hotkey."
|
||||
FontSize="12"
|
||||
Foreground="{ThemeResource TextFillColorSecondaryBrush}"/>
|
||||
<Grid>
|
||||
<Slider x:Name="ClipLengthSlider"
|
||||
Minimum="10"
|
||||
Maximum="120"
|
||||
StepFrequency="5"
|
||||
Value="30"
|
||||
ValueChanged="ClipLengthSlider_ValueChanged"/>
|
||||
<TextBlock x:Name="ClipLengthLabel"
|
||||
Text="30 seconds"
|
||||
FontSize="12"
|
||||
FontWeight="SemiBold"
|
||||
Foreground="#E8FF47"
|
||||
HorizontalAlignment="Right"
|
||||
VerticalAlignment="Center"/>
|
||||
</Grid>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
|
||||
<!-- Video Quality -->
|
||||
<Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
|
||||
BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
|
||||
BorderThickness="1"
|
||||
CornerRadius="8"
|
||||
Padding="20">
|
||||
<StackPanel Spacing="12">
|
||||
<StackPanel Orientation="Horizontal" Spacing="8">
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="16"
|
||||
VerticalAlignment="Center"/>
|
||||
<TextBlock Text="Video Quality"
|
||||
FontSize="14"
|
||||
FontWeight="SemiBold"
|
||||
VerticalAlignment="Center"/>
|
||||
</StackPanel>
|
||||
<TextBlock Text="Higher quality means larger file sizes."
|
||||
FontSize="12"
|
||||
Foreground="{ThemeResource TextFillColorSecondaryBrush}"/>
|
||||
<Grid>
|
||||
<Slider x:Name="QualitySlider"
|
||||
Minimum="10"
|
||||
Maximum="100"
|
||||
StepFrequency="5"
|
||||
Value="70"
|
||||
ValueChanged="QualitySlider_ValueChanged"/>
|
||||
<TextBlock x:Name="QualityLabel"
|
||||
Text="70%"
|
||||
FontSize="12"
|
||||
FontWeight="SemiBold"
|
||||
Foreground="#E8FF47"
|
||||
HorizontalAlignment="Right"
|
||||
VerticalAlignment="Center"/>
|
||||
</Grid>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
|
||||
<!-- Framerate -->
|
||||
<Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
|
||||
BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
|
||||
BorderThickness="1"
|
||||
CornerRadius="8"
|
||||
Padding="20">
|
||||
<StackPanel Spacing="12">
|
||||
<StackPanel Orientation="Horizontal" Spacing="8">
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="16"
|
||||
VerticalAlignment="Center"/>
|
||||
<TextBlock Text="Framerate"
|
||||
FontSize="14"
|
||||
FontWeight="SemiBold"
|
||||
VerticalAlignment="Center"/>
|
||||
</StackPanel>
|
||||
<TextBlock Text="Higher framerates are smoother but use more storage."
|
||||
FontSize="12"
|
||||
Foreground="{ThemeResource TextFillColorSecondaryBrush}"/>
|
||||
<ComboBox x:Name="FramerateCombo"
|
||||
SelectionChanged="FramerateCombo_SelectionChanged">
|
||||
<ComboBoxItem Content="30 FPS"/>
|
||||
<ComboBoxItem Content="60 FPS" IsSelected="True"/>
|
||||
</ComboBox>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
|
||||
<!-- Hotkey -->
|
||||
<Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
|
||||
BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
|
||||
BorderThickness="1"
|
||||
CornerRadius="8"
|
||||
Padding="20">
|
||||
<StackPanel Spacing="12">
|
||||
<StackPanel Orientation="Horizontal" Spacing="8">
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="16"
|
||||
VerticalAlignment="Center"/>
|
||||
<TextBlock Text="Clip Hotkey"
|
||||
FontSize="14"
|
||||
FontWeight="SemiBold"
|
||||
VerticalAlignment="Center"/>
|
||||
</StackPanel>
|
||||
<TextBlock Text="The key combination to save a clip."
|
||||
FontSize="12"
|
||||
Foreground="{ThemeResource TextFillColorSecondaryBrush}"/>
|
||||
<Border Background="#1a1a2e"
|
||||
CornerRadius="6"
|
||||
Padding="16,10"
|
||||
HorizontalAlignment="Left">
|
||||
<TextBlock Text="Alt + F9"
|
||||
FontFamily="Consolas"
|
||||
FontSize="14"
|
||||
FontWeight="Bold"
|
||||
Foreground="#E8FF47"/>
|
||||
</Border>
|
||||
<TextBlock Text="Hotkey remapping coming in a future update."
|
||||
FontSize="11"
|
||||
Foreground="{ThemeResource TextFillColorTertiaryBrush}"/>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
|
||||
<!-- Startup with Windows -->
|
||||
<Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
|
||||
BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
|
||||
BorderThickness="1"
|
||||
CornerRadius="8"
|
||||
Padding="20">
|
||||
<StackPanel Spacing="12">
|
||||
<StackPanel Orientation="Horizontal" Spacing="8">
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="16"
|
||||
VerticalAlignment="Center"/>
|
||||
<TextBlock Text="Startup"
|
||||
FontSize="14"
|
||||
FontWeight="SemiBold"
|
||||
VerticalAlignment="Center"/>
|
||||
</StackPanel>
|
||||
<TextBlock Text="Launch ClipForge automatically when Windows starts."
|
||||
FontSize="12"
|
||||
Foreground="{ThemeResource TextFillColorSecondaryBrush}"/>
|
||||
<ToggleSwitch x:Name="StartupToggle"
|
||||
OnContent="Enabled"
|
||||
OffContent="Disabled"
|
||||
Toggled="StartupToggle_Toggled"/>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
|
||||
<!-- Save button -->
|
||||
<Button x:Name="SaveSettingsButton"
|
||||
Content="Save Settings"
|
||||
Style="{StaticResource AccentButtonStyle}"
|
||||
Click="SaveSettings_Click"
|
||||
HorizontalAlignment="Left"/>
|
||||
|
||||
</StackPanel>
|
||||
</ScrollViewer>
|
||||
</Grid>
|
||||
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Window>
|
||||
Reference in New Issue
Block a user