You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
491 lines
26 KiB
491 lines
26 KiB
<controls:UserControlBase xmlns="https://github.com/avaloniaui" |
|
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:vm="clr-namespace:StabilityMatrix.Avalonia.ViewModels" |
|
xmlns:ui="using:FluentAvalonia.UI.Controls" |
|
xmlns:mocks="clr-namespace:StabilityMatrix.Avalonia.DesignData" |
|
xmlns:controls="clr-namespace:StabilityMatrix.Avalonia.Controls" |
|
xmlns:system="clr-namespace:System;assembly=System.Runtime" |
|
xmlns:checkpointManager="clr-namespace:StabilityMatrix.Avalonia.ViewModels.CheckpointManager" |
|
xmlns:lang="clr-namespace:StabilityMatrix.Avalonia.Languages" |
|
d:DataContext="{x:Static mocks:DesignData.CheckpointsPageViewModel}" |
|
x:CompileBindings="True" |
|
x:DataType="vm:CheckpointsPageViewModel" |
|
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450" |
|
x:Class="StabilityMatrix.Avalonia.Views.CheckpointsPage"> |
|
|
|
<controls:UserControlBase.Resources> |
|
<!--Direction="0" |
|
ShadowDepth="0"--> |
|
<DropShadowEffect |
|
BlurRadius="8" |
|
Color="#FF000000" |
|
Opacity="0.2" |
|
x:Key="TextDropShadowEffect" /> |
|
|
|
<!-- Template for a single badge --> |
|
<DataTemplate DataType="{x:Type system:String}" x:Key="BadgeTemplate"> |
|
<controls:Card |
|
Height="18" |
|
Margin="4,0,0,0" |
|
Padding="3" |
|
Width="48"> |
|
<TextBlock |
|
FontSize="10" |
|
FontWeight="Medium" |
|
Foreground="{DynamicResource TextFillColorSecondaryBrush}" |
|
HorizontalAlignment="Center" |
|
Text="{Binding}" |
|
VerticalAlignment="Center" /> |
|
</controls:Card> |
|
</DataTemplate> |
|
|
|
<!-- Checkpoint File Card --> |
|
<DataTemplate DataType="{x:Type checkpointManager:CheckpointFile}" x:Key="CheckpointFileDataTemplate"> |
|
<Border |
|
DragDrop.AllowDrop="True" |
|
Background="Transparent" |
|
BorderThickness="2" |
|
Margin="4"> |
|
<Interaction.Behaviors> |
|
<BehaviorCollection> |
|
<ContextDragBehavior HorizontalDragThreshold="6" VerticalDragThreshold="6"/> |
|
</BehaviorCollection> |
|
</Interaction.Behaviors> |
|
|
|
<controls:Card MaxWidth="330" Width="330" |
|
CornerRadius="12"> |
|
<!-- Right click menu for a checkpoint file --> |
|
<controls:Card.ContextFlyout> |
|
<ui:FAMenuFlyout> |
|
<ui:MenuFlyoutItem Command="{Binding RenameCommand}" |
|
Text="{x:Static lang:Resources.Action_Rename}" IconSource="Rename" /> |
|
<ui:MenuFlyoutItem Command="{Binding DeleteCommand}" |
|
Text="{x:Static lang:Resources.Action_Delete}" IconSource="Delete" /> |
|
<ui:MenuFlyoutItem Command="{Binding OpenOnCivitAiCommand}" |
|
Text="{x:Static lang:Resources.Action_OpenOnCivitAi}" IconSource="Link" |
|
IsVisible="{Binding IsConnectedModel}"/> |
|
</ui:FAMenuFlyout> |
|
</controls:Card.ContextFlyout> |
|
<Grid> |
|
<!-- Main contents, hidden when IsLoading is true --> |
|
<StackPanel MinHeight="70"> |
|
<Grid ColumnDefinitions="*, Auto" RowDefinitions="Auto,*,Auto" IsVisible="{Binding !IsLoading}"> |
|
<StackPanel |
|
Grid.ColumnSpan="2" |
|
HorizontalAlignment="Left" |
|
IsEnabled="True" |
|
Margin="0,0,0,4" |
|
Orientation="Vertical"> |
|
<!-- Tooltip for title and version --> |
|
<ToolTip.Tip> |
|
<StackPanel> |
|
<!-- Title --> |
|
<TextBlock |
|
FontSize="14" |
|
FontWeight="Medium" |
|
Foreground="{DynamicResource TextFillColorPrimaryBrush}" |
|
HorizontalAlignment="Left" |
|
Margin="0,0,0,4" |
|
Text="{Binding Title}" |
|
TextWrapping="WrapWithOverflow" /> |
|
<!-- Version --> |
|
<TextBlock |
|
FontSize="13" |
|
Foreground="{DynamicResource TextFillColorTertiaryBrush}" |
|
HorizontalAlignment="Left" |
|
Margin="0,0,0,4" |
|
Text="{Binding ConnectedModel.VersionName, FallbackValue=''}" |
|
TextWrapping="WrapWithOverflow" |
|
IsVisible="{Binding IsConnectedModel}" /> |
|
<!-- Image --> |
|
<controls:BetterAdvancedImage |
|
Margin="0,0,0,4" |
|
CornerRadius="4" |
|
Source="{Binding PreviewImagePath}" |
|
Stretch="Uniform" |
|
IsVisible="{Binding IsConnectedModel}" /> |
|
</StackPanel> |
|
</ToolTip.Tip> |
|
<TextBlock |
|
Foreground="{DynamicResource TextFillColorPrimaryBrush}" |
|
HorizontalAlignment="Left" |
|
IsEnabled="True" |
|
MaxWidth="250" |
|
Text="{Binding Title}" |
|
TextTrimming="CharacterEllipsis" |
|
TextWrapping="NoWrap" /> |
|
<TextBlock |
|
FontSize="13" |
|
Foreground="{DynamicResource TextFillColorTertiaryBrush}" |
|
HorizontalAlignment="Left" |
|
IsEnabled="True" |
|
Text="{Binding ConnectedModel.VersionName, FallbackValue=''}" |
|
TextWrapping="WrapWithOverflow" |
|
IsVisible="{Binding IsConnectedModel}" /> |
|
</StackPanel> |
|
|
|
<controls:BetterAdvancedImage Grid.Row="1" |
|
Grid.Column="0" |
|
Grid.ColumnSpan="2" |
|
Margin="0, 4,0,4" |
|
CornerRadius="8" |
|
Source="{Binding PreviewImagePath}" |
|
Stretch="UniformToFill" |
|
Height="300" |
|
Width="300" |
|
IsVisible="{Binding $parent[ItemsControl].((vm:CheckpointsPageViewModel)DataContext).ShowConnectedModelImages}" /> |
|
|
|
<Grid Grid.Column="1" Grid.Row="0"> |
|
<Button |
|
Background="Transparent" |
|
BorderBrush="Transparent" |
|
FontSize="20" |
|
HorizontalAlignment="Right" |
|
IsEnabled="True" |
|
MaxHeight="48" |
|
MaxWidth="64" |
|
Padding="0" |
|
ToolTip.Tip="{x:Static lang:Resources.Label_ConnectedModel}" |
|
VerticalAlignment="Top" |
|
IsVisible="{Binding IsConnectedModel, Mode=OneWay}"> |
|
<ui:SymbolIcon |
|
Foreground="LightGreen" |
|
Symbol="CloudSyncComplete" |
|
ToolTip.Tip="{x:Static lang:Resources.Label_ConnectedModel}" /> |
|
</Button> |
|
<Button |
|
Background="Transparent" |
|
BorderBrush="Transparent" |
|
FontSize="20" |
|
HorizontalAlignment="Right" |
|
IsEnabled="True" |
|
MaxHeight="48" |
|
MaxWidth="64" |
|
Padding="0" |
|
ToolTip.Tip="{x:Static lang:Resources.Label_LocalModel}" |
|
VerticalAlignment="Top" |
|
IsVisible="{Binding !IsConnectedModel, Mode=OneWay}"> |
|
<ui:SymbolIcon |
|
Foreground="DimGray" |
|
Symbol="CloudOffline" |
|
ToolTip.Tip="{x:Static lang:Resources.Label_LocalModel}" /> |
|
</Button> |
|
</Grid> |
|
<TextBlock |
|
FontSize="11" |
|
Foreground="{DynamicResource TextFillColorTertiaryBrush}" |
|
Grid.Column="0" |
|
Grid.Row="2" |
|
IsEnabled="True" |
|
Margin="4,4" |
|
Text="{Binding FileName}" |
|
TextTrimming="CharacterEllipsis" |
|
ToolTip.Tip="{Binding FileName}" |
|
VerticalAlignment="Bottom" /> |
|
<ItemsRepeater |
|
Grid.Column="1" |
|
Grid.Row="2" |
|
HorizontalAlignment="Right" |
|
ItemTemplate="{StaticResource BadgeTemplate}" |
|
ItemsSource="{Binding Badges}" |
|
VerticalAlignment="Bottom"> |
|
|
|
<ItemsRepeater.Layout> |
|
<UniformGridLayout /> |
|
</ItemsRepeater.Layout> |
|
</ItemsRepeater> |
|
</Grid> |
|
</StackPanel> |
|
|
|
<!-- Progress ring --> |
|
<controls:ProgressRing |
|
Grid.Row="0" |
|
Height="32" |
|
Width="32" |
|
Foreground="{DynamicResource ThemeRedColor}" |
|
BorderThickness="4" |
|
HorizontalAlignment="Center" |
|
IsIndeterminate="True" |
|
Padding="0" |
|
VerticalAlignment="Center" |
|
IsEnabled="{Binding IsLoading}" |
|
IsVisible="{Binding IsLoading}" /> |
|
</Grid> |
|
</controls:Card> |
|
</Border> |
|
</DataTemplate> |
|
|
|
<!-- Checkpoint Folder Expander --> |
|
<DataTemplate DataType="{x:Type checkpointManager:CheckpointFolder}" x:Key="CheckpointFolderGridDataTemplate"> |
|
<Expander |
|
DragDrop.AllowDrop="True" |
|
CornerRadius="8" |
|
IsExpanded="{Binding IsExpanded}" |
|
Margin="4" |
|
Padding="8,8,8,8" |
|
IsVisible="{Binding IsCategoryEnabled, FallbackValue=True}"> |
|
|
|
<!-- Right click menu for a checkpoint folder --> |
|
<Expander.ContextFlyout> |
|
<ui:FAMenuFlyout> |
|
<ui:MenuFlyoutItem Text="{x:Static lang:Resources.Action_ShowInExplorer}" IconSource="Open" |
|
Command="{Binding ShowInExplorerCommand}" |
|
CommandParameter="{Binding DirectoryPath}"/> |
|
<!-- Only allow deletion of non-root folders (Parent is not null) --> |
|
<ui:MenuFlyoutItem Text="{x:Static lang:Resources.Action_Delete}" IconSource="Delete" |
|
IsEnabled="{Binding ParentFolder, Converter={x:Static ObjectConverters.IsNotNull}}" |
|
IsVisible="{Binding ParentFolder, Converter={x:Static ObjectConverters.IsNotNull}}" |
|
Command="{Binding DeleteCommand}"/> |
|
<ui:MenuFlyoutSeparator/> |
|
<ui:MenuFlyoutSubItem Text="{x:Static lang:Resources.Action_New}" IconSource="Add"> |
|
<ui:MenuFlyoutSubItem.Items> |
|
<ui:MenuFlyoutItem Text="{x:Static lang:Resources.Label_Folder}" IconSource="OpenFolder" |
|
Command="{Binding CreateSubFolderCommand}"/> |
|
</ui:MenuFlyoutSubItem.Items> |
|
</ui:MenuFlyoutSubItem> |
|
<ui:MenuFlyoutItem Text="{x:Static lang:Resources.Label_FindConnectedMetadata}" |
|
IconSource="Find" |
|
Command="{Binding FindConnectedMetadata}"/> |
|
</ui:FAMenuFlyout> |
|
</Expander.ContextFlyout> |
|
|
|
<!-- Editable header --> |
|
<Expander.Header> |
|
<Grid> |
|
<TextBlock Text="{Binding Title}" VerticalAlignment="Center"/> |
|
</Grid> |
|
</Expander.Header> |
|
|
|
<Grid RowDefinitions="Auto, Auto"> |
|
<!-- Subfolders --> |
|
<ItemsRepeater Grid.Row="0" |
|
HorizontalAlignment="Stretch" |
|
ItemTemplate="{DynamicResource CheckpointFolderGridDataTemplate}" |
|
ItemsSource="{Binding SubFolders, Mode=OneWay}" |
|
Margin="8,0,8,8" > |
|
<ItemsRepeater.Layout> |
|
<StackLayout Orientation="Vertical"/> |
|
</ItemsRepeater.Layout> |
|
</ItemsRepeater> |
|
<!-- Files Grid --> |
|
<Grid Grid.Row="1" Name="FilesGrid" |
|
Background="Transparent" |
|
DragDrop.AllowDrop="True"> |
|
<ItemsRepeater |
|
Name="FilesRepeater" |
|
ItemTemplate="{StaticResource CheckpointFileDataTemplate}" |
|
ItemsSource="{Binding DisplayedCheckpointFiles}"> |
|
<ItemsRepeater.Layout> |
|
<UniformGridLayout Orientation="Horizontal" |
|
MinColumnSpacing="4" MinRowSpacing="4"/> |
|
</ItemsRepeater.Layout> |
|
<TextBlock Text="Hi"/> |
|
</ItemsRepeater> |
|
<TextBlock VerticalAlignment="Center" |
|
TextAlignment="Center" |
|
HorizontalAlignment="Center" |
|
Margin="8,8,8,16" |
|
Text="{x:Static lang:Resources.Label_DragAndDropCheckpointsHereToImport}" |
|
IsVisible="{Binding !CheckpointFiles.Count}"/> |
|
<!-- Blurred background for drag and drop --> |
|
<Border |
|
CornerRadius="4" |
|
Grid.RowSpan="4" |
|
IsEnabled="False" |
|
IsVisible="{Binding IsDragBlurEnabled}"> |
|
<Border.Background> |
|
<SolidColorBrush Color="#EE202020" /> |
|
</Border.Background> |
|
</Border> |
|
<!-- Drag prompt text --> |
|
<TextBlock |
|
Effect="{StaticResource TextDropShadowEffect}" |
|
FontSize="24" |
|
HorizontalAlignment="Center" |
|
Text="{x:Static lang:Resources.Label_DropFileToImport}" |
|
VerticalAlignment="Center" |
|
IsVisible="{Binding IsCurrentDragTarget}" /> |
|
<StackPanel |
|
Margin="0,8" |
|
Orientation="Vertical" |
|
VerticalAlignment="Center"> |
|
<!-- Import progress --> |
|
<TextBlock |
|
Effect="{StaticResource TextDropShadowEffect}" |
|
FontSize="18" |
|
HorizontalAlignment="Center" |
|
Text="{Binding Progress.Text}" |
|
VerticalAlignment="Center" |
|
IsVisible="{Binding Progress.IsTextVisible}" /> |
|
<ProgressBar |
|
Effect="{StaticResource TextDropShadowEffect}" |
|
HorizontalAlignment="Stretch" |
|
IsIndeterminate="{Binding Progress.IsIndeterminate, FallbackValue=False}" |
|
Margin="64,8" |
|
VerticalAlignment="Center" |
|
IsVisible="{Binding Progress.IsProgressVisible}" |
|
Value="{Binding Progress.Value, FallbackValue=20}" /> |
|
</StackPanel> |
|
</Grid> |
|
</Grid> |
|
</Expander> |
|
</DataTemplate> |
|
|
|
<!-- Template for dropdown box --> |
|
<ControlTemplate x:Key="CategoryDropDownTemplate"> |
|
<Grid> |
|
<Border |
|
CornerRadius="{TemplateBinding Border.CornerRadius}" |
|
Margin="{TemplateBinding Margin}" |
|
Name="ContentBorder" |
|
Padding="0" |
|
VerticalAlignment="Stretch"> |
|
<Grid> |
|
<Rectangle |
|
Height="16" |
|
HorizontalAlignment="Left" |
|
Margin="0" |
|
RadiusX="2" |
|
RadiusY="2" |
|
VerticalAlignment="Center" |
|
IsVisible="False" |
|
Width="3" |
|
x:Name="ActiveRectangle"> |
|
<Rectangle.Fill> |
|
<SolidColorBrush Color="{DynamicResource SystemAccentColorSecondary}" /> |
|
</Rectangle.Fill> |
|
</Rectangle> |
|
<Grid ColumnDefinitions="*,Auto"> |
|
<!-- Setup grid rows --> |
|
<StackPanel |
|
Grid.Column="0" |
|
Margin="10,0,0,0" |
|
VerticalAlignment="Top"> |
|
<!--<CheckBox |
|
Content="{Binding TitleWithFilesCount}" |
|
IsChecked="{Binding IsCategoryEnabled, Mode=TwoWay}" />--> |
|
</StackPanel> |
|
</Grid> |
|
</Grid> |
|
</Border> |
|
</Grid> |
|
</ControlTemplate> |
|
|
|
</controls:UserControlBase.Resources> |
|
|
|
<Grid ColumnDefinitions="Auto,*" RowDefinitions="Auto,*" Margin="4, 0" |
|
x:Name="ParentGrid"> |
|
<!-- Top settings bar --> |
|
<StackPanel Grid.Column="0" Grid.Row="0"> |
|
<ToggleSwitch |
|
OffContent="{x:Static lang:Resources.Label_ImportAsConnected}" |
|
OnContent="{x:Static lang:Resources.Label_ImportAsConnected}" |
|
IsChecked="{Binding IsImportAsConnected}" |
|
Margin="24,4,24,-4" |
|
ToolTip.Tip="{x:Static lang:Resources.Label_ImportAsConnectedExplanation}" /> |
|
|
|
<ToggleSwitch |
|
OffContent="{x:Static lang:Resources.Label_ShowModelImages}" |
|
OnContent="{x:Static lang:Resources.Label_ShowModelImages}" |
|
IsChecked="{Binding ShowConnectedModelImages}" |
|
Margin="24,-4,24,4" /> |
|
</StackPanel> |
|
|
|
<StackPanel |
|
Grid.Column="1" |
|
Grid.Row="0" |
|
Spacing="8" |
|
HorizontalAlignment="Right" |
|
Margin="16,0" |
|
Orientation="Horizontal"> |
|
<TextBox Margin="8, 16" |
|
Watermark="{x:Static lang:Resources.Action_Search}" |
|
Height="16" |
|
MinWidth="220" |
|
KeyDown="InputElement_OnKeyDown" |
|
Text="{Binding SearchFilter, Mode=TwoWay}"> |
|
<TextBox.InnerRightContent> |
|
<Grid> |
|
<Button Classes="transparent-full" |
|
IsVisible="{Binding SearchFilter.Length}" |
|
Command="{Binding ClearSearchQuery}"> |
|
<ui:SymbolIcon Symbol="Cancel" /> |
|
</Button> |
|
<ui:SymbolIcon |
|
IsVisible="{Binding !SearchFilter.Length}" |
|
Margin="0,0,10,0" |
|
FontSize="16" |
|
Symbol="Find" /> |
|
</Grid> |
|
</TextBox.InnerRightContent> |
|
</TextBox> |
|
<controls:ProgressRing |
|
Width="16" |
|
Height="16" |
|
BorderThickness="4" |
|
IsIndeterminate="True" |
|
IsVisible="{Binding IsIndexing}"/> |
|
<TextBlock Text="{x:Static lang:Resources.Label_Indexing}" FontSize="11" |
|
VerticalAlignment="Center" |
|
IsVisible="{Binding IsIndexing}"/> |
|
<Button |
|
Command="{Binding OpenModelsFolderCommand}"> |
|
<TextBlock Text="{x:Static lang:Resources.Label_ModelsFolder}"/> |
|
</Button> |
|
<DropDownButton |
|
Content="{x:Static lang:Resources.Label_Categories}" |
|
Margin="8" |
|
VerticalAlignment="Center" |
|
HorizontalAlignment="Right"> |
|
<DropDownButton.Flyout> |
|
<ui:FAMenuFlyout |
|
ItemsSource="{Binding CheckpointFolders}"> |
|
<ui:FAMenuFlyout.ItemTemplate> |
|
<DataTemplate DataType="{x:Type checkpointManager:CheckpointFolder}"> |
|
<ui:ToggleMenuFlyoutItem |
|
Text="{Binding TitleWithFilesCount}" |
|
IsChecked="{Binding IsCategoryEnabled, Mode=TwoWay}"/> |
|
</DataTemplate> |
|
</ui:FAMenuFlyout.ItemTemplate> |
|
</ui:FAMenuFlyout> |
|
</DropDownButton.Flyout> |
|
</DropDownButton> |
|
</StackPanel> |
|
|
|
<!-- Main view with model cards --> |
|
<ScrollViewer |
|
Grid.Column="0" |
|
Grid.ColumnSpan="2" |
|
Grid.Row="1" |
|
x:Name="MainScrollViewer" |
|
HorizontalScrollBarVisibility="Disabled" |
|
VerticalScrollBarVisibility="Auto"> |
|
<Grid> |
|
<controls:ProgressRing |
|
Width="128" |
|
Height="128" |
|
BorderThickness="8" |
|
IsIndeterminate="True" |
|
IsVisible="{Binding IsLoading}" |
|
HorizontalAlignment="Center" |
|
VerticalAlignment="Center"/> |
|
<StackPanel Orientation="Vertical"> |
|
<ItemsControl |
|
HorizontalAlignment="Stretch" |
|
Name="FilesRepeater" |
|
x:Name="FilesRepeater" |
|
ItemTemplate="{StaticResource CheckpointFolderGridDataTemplate}" |
|
ItemsSource="{Binding DisplayedCheckpointFolders, Mode=OneWay}" |
|
Margin="8,0,8,8" /> |
|
</StackPanel> |
|
</Grid> |
|
</ScrollViewer> |
|
|
|
<!-- Overlay for draggable file panels --> |
|
<Panel Name="OverlayPanel" |
|
Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" /> |
|
</Grid> |
|
|
|
</controls:UserControlBase>
|
|
|