Upgrade Avalonia

2026-11-12 11:56:30 +00:00 · 2023-07-26 22:13:40 +02:00
1 parent e03d6b20e9
commit ee6d295fd8
@@ -9,9 +9,9 @@
             x:Class="Artemis.UI.Screens.Workshop.CurrentUser.CurrentUserView"
             x:DataType="currentUser:CurrentUserViewModel">

-    <Panel IsVisible="{CompiledBinding !Loading}">
+    <Panel Name="Container" IsVisible="{CompiledBinding !Loading}">
        <!-- Signed out -->
-        <Ellipse Height="28" Width="28" IsVisible="{CompiledBinding Name, Converter={x:Static StringConverters.IsNullOrEmpty}}">
+        <Ellipse Height="{CompiledBinding Bounds.Height, ElementName=Container}" Width="{CompiledBinding Bounds.Height, ElementName=Container}" IsVisible="{CompiledBinding Name, Converter={x:Static StringConverters.IsNullOrEmpty}}">
            <Ellipse.ContextFlyout>
                <MenuFlyout>
                    <MenuItem Header="Login" Command="{CompiledBinding Login}">
@@ -27,7 +27,7 @@
        </Ellipse>

        <!-- Signed in -->
-        <Ellipse Height="28" Width="28" IsVisible="{CompiledBinding Name, Converter={x:Static StringConverters.IsNotNullOrEmpty}}" Name="UserMenu">
+        <Ellipse Height="{CompiledBinding Bounds.Height, ElementName=Container}" Width="{CompiledBinding Bounds.Height, ElementName=Container}" IsVisible="{CompiledBinding Name, Converter={x:Static StringConverters.IsNotNullOrEmpty}}" Name="UserMenu">
            <Ellipse.ContextFlyout>
                <Flyout>
                    <Grid ColumnDefinitions="Auto,*" RowDefinitions="*,*,*" MinWidth="300">
@@ -4,8 +4,6 @@
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
             xmlns:home="clr-namespace:Artemis.UI.Screens.Workshop.Home"
-             xmlns:controls="clr-namespace:Artemis.UI.Controls"
-             xmlns:acrylicBlur="clr-namespace:Artemis.UI.Controls.AcrylicBlur"
             mc:Ignorable="d" d:DesignWidth="1200" d:DesignHeight="800"
             x:Class="Artemis.UI.Screens.Workshop.Home.WorkshopHomeView"
             x:DataType="home:WorkshopHomeViewModel">
@@ -39,43 +37,42 @@
                </TextBlock.Effect>
            </TextBlock>

-            <StackPanel Grid.Row="1" Margin="30 -75 30 0" Spacing="10" Orientation="Horizontal" VerticalAlignment="Top">
-                <Border CornerRadius="{DynamicResource ControlCornerRadius}" ClipToBounds="True">
-                    <acrylicBlur:AcrylicBlur Blur="17">
-                        <Button Width="150" Height="180" Command="{CompiledBinding Navigate}" CommandParameter="workshop/profiles/1" VerticalContentAlignment="Top">
-                            <StackPanel>
-                                <avalonia:MaterialIcon Kind="FolderVideo" HorizontalAlignment="Left" Width="60" Height="60" Margin="0 5" />
-                                <TextBlock TextWrapping="Wrap" FontSize="16" Margin="0 5">Profiles</TextBlock>
-                                <TextBlock TextWrapping="Wrap" FontSize="12" Opacity="0.8">Browse new profiles created by other users.</TextBlock>
-                            </StackPanel>
-                        </Button>
-                    </acrylicBlur:AcrylicBlur>
-                </Border>
+            <StackPanel Margin="30 -75 30 0" Grid.Row="1">
+                <StackPanel  Spacing="10" Orientation="Horizontal" VerticalAlignment="Top">
+                    <Button Width="150" Height="180" Command="{CompiledBinding AddSubmission}" VerticalContentAlignment="Top">
+                        <StackPanel>
+                            <avalonia:MaterialIcon Kind="CloudUpload" HorizontalAlignment="Left" Width="60" Height="60" Margin="0 5" />
+                            <TextBlock TextWrapping="Wrap" FontSize="16" Margin="0 5">Add submission</TextBlock>
+                            <TextBlock TextWrapping="Wrap" FontSize="12" Opacity="0.8">Upload your own creations to the workshop!</TextBlock>
+                        </StackPanel>
+                    </Button>
+                    
+                    <Button Width="150" Height="180" Command="{CompiledBinding Navigate}" CommandParameter="workshop/profiles/1" VerticalContentAlignment="Top">
+                        <StackPanel>
+                            <avalonia:MaterialIcon Kind="FolderVideo" HorizontalAlignment="Left" Width="60" Height="60" Margin="0 5" />
+                            <TextBlock TextWrapping="Wrap" FontSize="16" Margin="0 5">Profiles</TextBlock>
+                            <TextBlock TextWrapping="Wrap" FontSize="12" Opacity="0.8">Browse new profiles created by other users.</TextBlock>
+                        </StackPanel>
+                    </Button>

-                <Border CornerRadius="{DynamicResource ControlCornerRadius}" ClipToBounds="True">
-                    <acrylicBlur:AcrylicBlur Blur="17">
-                        <Button Width="150" Height="180" Command="{CompiledBinding Navigate}" CommandParameter="workshop/layouts/1" VerticalContentAlignment="Top">
-                            <StackPanel>
-                                <avalonia:MaterialIcon Kind="KeyboardVariant" HorizontalAlignment="Left" Width="60" Height="60" Margin="0 5" />
-                                <TextBlock TextWrapping="Wrap" FontSize="16" Margin="0 5">Layouts</TextBlock>
-                                <TextBlock TextWrapping="Wrap" FontSize="12" Opacity="0.8">Layouts make your devices look great in the editor.</TextBlock>
-                            </StackPanel>
-                        </Button>
-                    </acrylicBlur:AcrylicBlur>
-                </Border>
+                    <Button Width="150" Height="180" Command="{CompiledBinding Navigate}" CommandParameter="workshop/layouts/1" VerticalContentAlignment="Top">
+                        <StackPanel>
+                            <avalonia:MaterialIcon Kind="KeyboardVariant" HorizontalAlignment="Left" Width="60" Height="60" Margin="0 5" />
+                            <TextBlock TextWrapping="Wrap" FontSize="16" Margin="0 5">Layouts</TextBlock>
+                            <TextBlock TextWrapping="Wrap" FontSize="12" Opacity="0.8">Layouts make your devices look great in the editor.</TextBlock>
+                        </StackPanel>
+                    </Button>
+                    
+
+                </StackPanel>
+                
+                <TextBlock Classes="h4" Margin="0 15 0 5">Featured submissions</TextBlock>
+                <TextBlock>Not yet implemented, here we'll show submissions we think are worth some extra attention.</TextBlock>
+                
+                <TextBlock Classes="h4" Margin="0 15 0 5">Recently updated</TextBlock>
+                <TextBlock>Not yet implemented, here we'll a few of the most recent uploads/updates to the workshop.</TextBlock>
            </StackPanel>
-
-
-            <Grid Grid.Row="1" Width="320" Height="200">
-                <Grid>
-                    <Rectangle Fill="Aqua" Height="200" Width="100" HorizontalAlignment="Left" VerticalAlignment="Top" />
-                    <Ellipse Fill="Magenta" Height="152" Width="152" HorizontalAlignment="Center" VerticalAlignment="Center" />
-                    <Rectangle Fill="Yellow" Height="100" Width="80" HorizontalAlignment="Right" VerticalAlignment="Bottom" />
-                </Grid>
-                <acrylicBlur:AcrylicBlur Margin="12" Blur="17">
-                    <TextBlock>Test</TextBlock>
-                </acrylicBlur:AcrylicBlur>
-            </Grid>
+           
        </Grid>
    </Border>
 </UserControl>
@@ -1,6 +1,10 @@
 using System.Reactive;
+using System.Threading;
+using System.Threading.Tasks;
+using Artemis.UI.Screens.Workshop.SubmissionWizard;
 using Artemis.UI.Shared;
 using Artemis.UI.Shared.Routing;
+using Artemis.UI.Shared.Services;
 using Artemis.WebClient.Workshop;
 using ReactiveUI;

@@ -8,13 +12,22 @@ namespace Artemis.UI.Screens.Workshop.Home;

 public class WorkshopHomeViewModel : ActivatableViewModelBase, IWorkshopViewModel
 {
-    public WorkshopHomeViewModel(IRouter router)
+    private readonly IWindowService _windowService;
+
+    public WorkshopHomeViewModel(IRouter router, IWindowService windowService)
    {
+        _windowService = windowService;
+        AddSubmission = ReactiveCommand.CreateFromTask(ExecuteAddSubmission);
        Navigate = ReactiveCommand.CreateFromTask<string>(async r => await router.Navigate(r));
    }

-    public ReactiveCommand<string, Unit> Navigate { get; set; }
+    public ReactiveCommand<Unit, Unit> AddSubmission { get; }
+    public ReactiveCommand<string, Unit> Navigate { get; }
+
+    private async Task ExecuteAddSubmission(CancellationToken arg)
+    {
+        await _windowService.ShowDialogAsync<SubmissionWizardViewModel>();
+    }

    public EntryType? EntryType => null;
-
 }
@@ -48,6 +48,8 @@
            </AutoCompleteBox.ItemTemplate>
        </AutoCompleteBox>
        <ContentControl HorizontalAlignment="Right" 
+                        Width="28"
+                        Height="28"
                        Margin="0 0 50 0"
                        Content="{CompiledBinding CurrentUserViewModel}"
                        windowing:AppWindow.AllowInteractionInTitleBar="True"/>
@@ -0,0 +1,11 @@
+<UserControl 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"
+             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
+             x:Class="Artemis.UI.Screens.Workshop.SubmissionWizard.Steps.WelcomeStepView">
+    <StackPanel>
+        <TextBlock>Welcome to the Workshop Submission Wizard 🧙</TextBlock>
+        <TextBlock>Here we'll take you, step by step, through the process of uploading your submission to the workshop.</TextBlock>
+    </StackPanel>
+</UserControl>
@@ -0,0 +1,17 @@
+using Avalonia.Markup.Xaml;
+using Avalonia.ReactiveUI;
+
+namespace Artemis.UI.Screens.Workshop.SubmissionWizard.Steps;
+
+public partial class WelcomeStepView : ReactiveUserControl<WelcomeStepViewModel>
+{
+    public WelcomeStepView()
+    {
+        InitializeComponent();
+    }
+
+    private void InitializeComponent()
+    {
+        AvaloniaXamlLoader.Load(this);
+    }
+}
@@ -0,0 +1,22 @@
+using System.Reactive;
+using ReactiveUI;
+
+namespace Artemis.UI.Screens.Workshop.SubmissionWizard.Steps;
+
+public class WelcomeStepViewModel : SubmissionViewModel
+{
+    #region Overrides of SubmissionViewModel
+
+    /// <inheritdoc />
+    public override ReactiveCommand<Unit, Unit> Continue { get; }
+
+    /// <inheritdoc />
+    public override ReactiveCommand<Unit, Unit> GoBack { get; } = null!;
+
+    public WelcomeStepViewModel()
+    {
+        ShowGoBack = false;
+    }
+
+    #endregion
+}
@@ -0,0 +1,56 @@
+<Window 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:controls="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia"
+        xmlns:submissionWizard="clr-namespace:Artemis.UI.Screens.Workshop.SubmissionWizard"
+        xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
+        xmlns:ui="clr-namespace:Artemis.UI"
+        mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
+        x:Class="Artemis.UI.Screens.Workshop.SubmissionWizard.SubmissionWizardView"
+        x:DataType="submissionWizard:SubmissionWizardViewModel"
+        Icon="/Assets/Images/Logo/application.ico"
+        Title="Artemis | Workshop submission wizard"
+        Width="1000"
+        Height="735"
+        WindowStartupLocation="CenterOwner">
+    <Grid Margin="15" RowDefinitions="Auto,*,Auto">
+        <Grid RowDefinitions="*,*" ColumnDefinitions="Auto,*,Auto" Margin="0 0 0 15">
+            <ContentControl Grid.Column="0" Grid.RowSpan="2" Width="65" Height="65" VerticalAlignment="Center" Margin="0 0 20 0" Content="{CompiledBinding CurrentUserViewModel}"/>
+            <TextBlock Grid.Row="0" Grid.Column="1" FontSize="36" VerticalAlignment="Bottom" Text="{CompiledBinding CurrentUserViewModel.Name, FallbackValue=Not logged in}"/>
+
+            <StackPanel Grid.Row="0" Grid.Column="2" HorizontalAlignment="Right" VerticalAlignment="Bottom" Orientation="Horizontal">
+                <controls:HyperlinkButton Classes="icon-button" ToolTip.Tip="View Wiki" NavigateUri="https://wiki.artemis-rgb.com?mtm_campaign=artemis&amp;mtm_kwd=workshop-wizard">
+                    <avalonia:MaterialIcon Kind="BookOpenOutline" />
+                </controls:HyperlinkButton>
+            </StackPanel>
+
+            <TextBlock Grid.Row="1"
+                       Grid.Column="1"
+                       VerticalAlignment="Top"
+                       Classes="subtitle"
+                       Text="New workshop submission" />
+        </Grid>
+
+        <Border Classes="card" Grid.Row="1" Grid.Column="0">
+            <controls:Frame Name="Frame" IsNavigationStackEnabled="False" CacheSize="0">
+                <controls:Frame.NavigationPageFactory>
+                    <ui:PageFactory/>
+                </controls:Frame.NavigationPageFactory>
+            </controls:Frame>
+        </Border>
+
+        <StackPanel Grid.Row="2" Grid.Column="0" HorizontalAlignment="Right" Orientation="Horizontal" Spacing="5" Margin="0 15 0 0">
+            <Button Command="{CompiledBinding Screen.GoBack}" IsVisible="{CompiledBinding Screen.ShowGoBack}">
+                Back
+            </Button>
+            <Button Command="{CompiledBinding Screen.Continue}" IsVisible="{CompiledBinding !Screen.ShowFinish}" Width="80">
+                Continue
+            </Button>
+            <Button Command="{CompiledBinding Screen.Continue}" IsVisible="{CompiledBinding Screen.ShowFinish}" Width="80">
+                Finish
+            </Button>
+        </StackPanel>
+    </Grid>
+
+</Window>
@@ -0,0 +1,33 @@
+using System;
+using System.Reactive.Disposables;
+using Artemis.UI.Shared;
+using Avalonia;
+using Avalonia.Threading;
+using ReactiveUI;
+
+namespace Artemis.UI.Screens.Workshop.SubmissionWizard;
+
+public partial class SubmissionWizardView : ReactiveAppWindow<SubmissionWizardViewModel>
+{
+    public SubmissionWizardView()
+    {
+        InitializeComponent();
+#if DEBUG
+        this.AttachDevTools();
+#endif
+
+        this.WhenActivated(d => ViewModel.WhenAnyValue(vm => vm.Screen).Subscribe(Navigate).DisposeWith(d));
+    }
+
+    private void Navigate(SubmissionViewModel viewModel)
+    {
+        try
+        {
+            Dispatcher.UIThread.Invoke(() => Frame.NavigateFromObject(viewModel));
+        }
+        catch (Exception)
+        {
+            // ignored
+        }
+    }
+}
@@ -0,0 +1,47 @@
+using System.Reactive;
+using Artemis.UI.Screens.Workshop.CurrentUser;
+using Artemis.UI.Screens.Workshop.SubmissionWizard.Steps;
+using Artemis.UI.Shared;
+using ReactiveUI;
+
+namespace Artemis.UI.Screens.Workshop.SubmissionWizard;
+
+public class SubmissionWizardViewModel : DialogViewModelBase<bool>
+{
+    private SubmissionViewModel _screen;
+
+    public SubmissionWizardViewModel(CurrentUserViewModel currentUserViewModel)
+    {
+        _screen = new WelcomeStepViewModel();
+        CurrentUserViewModel = currentUserViewModel;
+    }
+
+    public CurrentUserViewModel CurrentUserViewModel { get; }
+
+    public SubmissionViewModel Screen
+    {
+        get => _screen;
+        set => RaiseAndSetIfChanged(ref _screen, value);
+    }
+}
+
+public abstract class SubmissionViewModel : ActivatableViewModelBase
+{
+    private bool _showFinish;
+    private bool _showGoBack = true;
+
+    public abstract ReactiveCommand<Unit, Unit> Continue { get; }
+    public abstract ReactiveCommand<Unit, Unit> GoBack { get; }
+
+    public bool ShowGoBack
+    {
+        get => _showGoBack;
+        set => RaiseAndSetIfChanged(ref _showGoBack, value);
+    }
+
+    public bool ShowFinish
+    {
+        get => _showFinish;
+        set => RaiseAndSetIfChanged(ref _showFinish, value);
+    }
+}