msfs-popout-panel-manager/MainApp/UserControl/PopOutPanelCard.xaml

<UserControl
    x:Class="MSFSPopoutPanelManager.MainApp.PopOutPanelCard"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:c="clr-namespace:CalcBinding;assembly=CalcBinding"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="clr-namespace:MSFSPopoutPanelManager.MainApp"
    xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:profileDomain="clr-namespace:MSFSPopoutPanelManager.DomainModel.Profile;assembly=DomainModel"
    xmlns:system="clr-namespace:System;assembly=mscorlib"
    Width="860"
    mc:Ignorable="d">
    <UserControl.Resources>
        <system:Double x:Key="IconSize">22</system:Double>
        <system:Double x:Key="ButtonSize">28</system:Double>
        <system:Double x:Key="UpDownButtonSize">22</system:Double>
        <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
        <DataTrigger
            x:Key="TriggerIsProfileLocked"
            Binding="{Binding ProfileData.ActiveProfile.IsLocked}"
            Value="True">
            <Setter Property="FrameworkElement.IsHitTestVisible" Value="False" />
            <Setter Property="FrameworkElement.Opacity" Value="0.8" />
        </DataTrigger>
        <DataTrigger
            x:Key="TriggerIsProfileUnlocked"
            Binding="{Binding ProfileData.ActiveProfile.IsLocked}"
            Value="False">
            <Setter Property="FrameworkElement.IsHitTestVisible" Value="True" />
            <Setter Property="Button.Foreground" Value="White" />
        </DataTrigger>
        <Style TargetType="{x:Type Expander}">
            <Style.Triggers>
                <StaticResource ResourceKey="TriggerIsProfileLocked" />
                <StaticResource ResourceKey="TriggerIsProfileUnlocked" />
            </Style.Triggers>
        </Style>
        <Style
            x:Key="ToggleButton"
            BasedOn="{StaticResource MaterialDesignSwitchToggleButton}"
            TargetType="ToggleButton">
            <Setter Property="Margin" Value="4,0,4,0" />
        </Style>
        <Style
            x:Key="TextBlockLabel"
            BasedOn="{StaticResource {x:Type TextBlock}}"
            TargetType="TextBlock">
            <Setter Property="FontSize" Value="14" />
            <Setter Property="TextWrapping" Value="Wrap" />
            <Setter Property="Margin" Value="5,0,40,0" />
            <Setter Property="LineHeight" Value="18" />
        </Style>
        <Style BasedOn="{StaticResource MaterialDesignIconForegroundButton}" TargetType="Button" />
        <Style
            x:Key="PopOutPanelExpander"
            BasedOn="{StaticResource CustomMaterialDesignExpander}"
            TargetType="Expander">
            <Style.Triggers>
                <DataTrigger Binding="{Binding DataItem.IsPopOutSuccess}" Value="False">
                    <Setter Property="BorderBrush" Value="Red" />
                </DataTrigger>
                <DataTrigger Binding="{Binding DataItem.IsPopOutSuccess}" Value="True">
                    <Setter Property="BorderBrush" Value="Green" />
                </DataTrigger>
                <DataTrigger Binding="{Binding DataItem.IsSelectedPanelSource}" Value="True">
                    <Setter Property="Background" Value="SlateGray" />
                    <Setter Property="Opacity" Value="0.9" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
        <Style x:Key="PopOutPanelExpanderVisibility" TargetType="StackPanel">
            <Style.Triggers>
                <DataTrigger Binding="{Binding DataItem.IsPopOutSuccess}" Value="True">
                    <Setter Property="FrameworkElement.Visibility" Value="Visible" />
                </DataTrigger>
                <DataTrigger Binding="{Binding DataItem.IsPopOutSuccess}" Value="{x:Null}">
                    <Setter Property="FrameworkElement.Visibility" Value="Visible" />
                </DataTrigger>
                <DataTrigger Binding="{Binding DataItem.IsPopOutSuccess}" Value="False">
                    <Setter Property="FrameworkElement.Visibility" Value="Collapsed" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
        <Style x:Key="ErrorPanelExpanderVisibility" TargetType="StackPanel">
            <Style.Triggers>
                <DataTrigger Binding="{Binding DataItem.IsPopOutSuccess}" Value="True">
                    <Setter Property="FrameworkElement.Visibility" Value="Collapsed" />
                </DataTrigger>
                <DataTrigger Binding="{Binding DataItem.IsPopOutSuccess}" Value="{x:Null}">
                    <Setter Property="FrameworkElement.Visibility" Value="Collapsed" />
                </DataTrigger>
                <DataTrigger Binding="{Binding DataItem.IsPopOutSuccess}" Value="False">
                    <Setter Property="FrameworkElement.Visibility" Value="Visible" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
        <Style x:Key="TxtBlockErrorMessage" TargetType="TextBlock">
            <Style.Triggers>
                <DataTrigger Binding="{Binding DataItem.PanelType}" Value="{x:Static profileDomain:PanelType.CustomPopout}">
                    <Setter Property="Text" Value="Unable to pop out this panel. Please check the source panel circle defined for this panel is at the correct location and not blocked by other window. Also please check if this panel is a duplicate with another panel. Lastly, please close all instrumentation pop outs that were opened manually." />
                    <Setter Property="LineHeight" Value="18" />
                </DataTrigger>
                <DataTrigger Binding="{Binding DataItem.PanelType}" Value="{x:Static profileDomain:PanelType.BuiltInPopout}">
                    <Setter Property="Text" Value="Unable to configure this built-in panel. Please make sure this panel has been opened and popped out by the game." />
                    <Setter Property="LineHeight" Value="18" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
        <Style
            x:Key="TxtBlockDisableWhenFullScreen"
            BasedOn="{StaticResource TextBlockLabel}"
            TargetType="TextBlock">
            <Style.Triggers>
                <DataTrigger Binding="{Binding DataItem.FullScreen}" Value="True">
                    <Setter Property="Foreground" Value="DimGray" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>
    <DockPanel>
        <Expander
            x:Name="RootExpander"
            Width="860"
            materialDesign:ExpanderAssist.HorizontalHeaderPadding="10,0,10,0"
            BorderThickness="1">
            <Expander.Style>
                <Style BasedOn="{StaticResource PopOutPanelExpander}" TargetType="Expander">
                    <Style.Triggers>
                        <StaticResource ResourceKey="TriggerIsProfileLocked" />
                        <StaticResource ResourceKey="TriggerIsProfileUnlocked" />
                    </Style.Triggers>
                </Style>
            </Expander.Style>
            <Expander.Header>
                <StackPanel Width="805" Orientation="Horizontal">
                    <StackPanel
                        Width="24"
                        Height="52"
                        Margin="0"
                        Style="{StaticResource ErrorPanelExpanderVisibility}">
                        <materialDesign:PopupBox
                            x:Name="PopupErrorMessage"
                            Margin="0,15,0,0"
                            Padding="5"
                            PlacementMode="RightAndAlignMiddles"
                            PopupHorizontalOffset="-10"
                            PopupUniformCornerRadius="10"
                            PopupVerticalOffset="15"
                            StaysOpen="True">
                            <materialDesign:PopupBox.ToggleContent>
                                <materialDesign:PackIcon
                                    Width="{StaticResource IconSize}"
                                    Height="{StaticResource IconSize}"
                                    Foreground="Red"
                                    Kind="AlertCircleOutline" />
                            </materialDesign:PopupBox.ToggleContent>
                            <TextBlock
                                Width="450"
                                Style="{StaticResource TxtBlockErrorMessage}"
                                TextWrapping="Wrap" />
                        </materialDesign:PopupBox>
                    </StackPanel>

                    <!--  Drag panel handle  -->
                    <StackPanel
                        Width="24"
                        Height="52"
                        Margin="0"
                        Style="{StaticResource PopOutPanelExpanderVisibility}">
                        <materialDesign:PackIcon
                            x:Name="IconDrag"
                            Width="{StaticResource IconSize}"
                            Height="{StaticResource IconSize}"
                            Margin="0,15,0,0"
                            Kind="Menu"
                            Opacity="0.5" />
                    </StackPanel>

                    <!--  Panel name text box  -->
                    <TextBox
                        x:Name="TxtBoxPanelName"
                        Width="260"
                        Margin="8,0,0,0"
                        Padding="0"
                        VerticalAlignment="Center"
                        HorizontalContentAlignment="Left"
                        materialDesign:HintAssist.FloatingScale="1"
                        materialDesign:HintAssist.Hint="Panel Name"
                        GotFocus="TextBox_GotFocus"
                        IsEnabled="{c:Binding 'DataItem.PanelType==profileDomain:PanelType.CustomPopout'}"
                        KeyDown="TextBox_KeyDown"
                        SourceUpdated="Data_SourceUpdated"
                        Style="{StaticResource MaterialDesignFloatingHintTextBox}"
                        Text="{Binding DataItem.PanelName, Mode=TwoWay, NotifyOnSourceUpdated=True}" />

                    <!--  Identify source panel button  -->
                    <StackPanel
                        x:Name="StackPanelIdentifyPanelSource"
                        Width="440"
                        VerticalAlignment="Center"
                        Visibility="{c:Binding 'DataItem.PanelType==profileDomain:PanelType.CustomPopout and DataItem.PanelSource.X == null'}">
                        <Button
                            x:Name="BtnIdentifySourcePanel"
                            HorizontalAlignment="Center"
                            Command="{Binding AddPanelSourceLocationCommand}"
                            Content="Identify Source Panel Location"
                            Foreground="White"
                            KeyboardNavigation.AcceptsReturn="False"
                            Style="{StaticResource MaterialDesignOutlinedButton}"
                            ToolTip="Identify source aircraft instrumentation panel location" />
                    </StackPanel>

                    <!--  Panel configurations  -->
                    <StackPanel
                        x:Name="StackPanelAdjustment"
                        Width="440"
                        Orientation="Horizontal"
                        Visibility="{c:Binding 'DataItem.PanelType==profileDomain:PanelType.RefocusDisplay or DataItem.PanelType==profileDomain:PanelType.BuiltInPopout or DataItem.PanelType==profileDomain:PanelType.HudBarWindow or DataItem.PanelSource.X != null'}">
                        <local:PanelConfigField
                            Margin="20,0,0,0"
                            BindingPath="Top"
                            DataItem="{Binding DataItem}"
                            IsEnabled="{c:Binding 'DataItem.PanelType!=profileDomain:PanelType.RefocusDisplay'}"
                            SourceUpdated="Data_SourceUpdated" />
                        <local:PanelConfigField
                            Margin="20,0,0,0"
                            BindingPath="Left"
                            DataItem="{Binding DataItem}"
                            IsEnabled="{c:Binding 'DataItem.PanelType!=profileDomain:PanelType.RefocusDisplay'}"
                            SourceUpdated="Data_SourceUpdated" />
                        <local:PanelConfigField
                            Margin="20,0,0,0"
                            BindingPath="Width"
                            DataItem="{Binding DataItem}"
                            IsEnabled="{c:Binding 'DataItem.PanelType!=profileDomain:PanelType.HudBarWindow and DataItem.PanelType!=profileDomain:PanelType.RefocusDisplay'}"
                            SourceUpdated="Data_SourceUpdated" />
                        <local:PanelConfigField
                            Margin="20,0,0,0"
                            BindingPath="Height"
                            DataItem="{Binding DataItem}"
                            IsEnabled="{c:Binding 'DataItem.PanelType!=profileDomain:PanelType.HudBarWindow and DataItem.PanelType!=profileDomain:PanelType.RefocusDisplay'}"
                            SourceUpdated="Data_SourceUpdated" />

                        <local:MoveAndResizePanelButton Margin="12,0,0,0" Visibility="{c:Binding 'DataItem.PanelType!=profileDomain:PanelType.RefocusDisplay'}" />

                        <local:TouchEnabledButton
                            Width="{StaticResource IconSize}"
                            Margin="12,0,0,0"
                            Visibility="{c:Binding 'DataItem.PanelType!=profileDomain:PanelType.HudBarWindow and DataItem.PanelType!=profileDomain:PanelType.RefocusDisplay'}" />
                    </StackPanel>

                    <!--  Source panel icon  -->
                    <StackPanel Margin="12,0,0,0" VerticalAlignment="Center">
                        <Button
                            Width="{StaticResource IconSize}"
                            Height="{StaticResource IconSize}"
                            IsHitTestVisible="{Binding ProfileData.ActiveProfile.IsEditingPanelSource}"
                            PreviewMouseDown="PanelSourceIcon_PreviewMouseDown"
                            PreviewMouseUp="PanelSourceIcon_PreviewMouseUp"
                            Style="{StaticResource MaterialDesignIconButton}"
                            ToolTip="Hold the left mouse button to show the panel source location"
                            Visibility="{c:Binding 'DataItem.PanelType==profileDomain:PanelType.CustomPopout'}">
                            <materialDesign:PackIcon
                                Width="{StaticResource IconSize}"
                                Height="{StaticResource IconSize}"
                                Kind="Crosshairs">
                                <materialDesign:PackIcon.Style>
                                    <Style>
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding ProfileData.ActiveProfile.IsEditingPanelSource}" Value="True">
                                                <Setter Property="materialDesign:PackIcon.Foreground" Value="{Binding DataItem.PanelSource.Color}" />
                                            </DataTrigger>
                                            <DataTrigger Binding="{Binding ProfileData.ActiveProfile.IsEditingPanelSource}" Value="False">
                                                <Setter Property="materialDesign:PackIcon.Opacity" Value="0.3" />
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </materialDesign:PackIcon.Style>
                            </materialDesign:PackIcon>
                        </Button>
                        <StackPanel Width="{StaticResource IconSize}" Visibility="{c:Binding 'DataItem.PanelType!=profileDomain:PanelType.CustomPopOut'}" />
                    </StackPanel>

                    <!--  Delete panel button  -->
                    <StackPanel Margin="12,0,0,0" VerticalAlignment="Center">
                        <Button
                            Width="{StaticResource ButtonSize}"
                            Height="{StaticResource ButtonSize}"
                            Margin="0"
                            Command="{Binding DeletePanelCommand}"
                            KeyboardNavigation.AcceptsReturn="False"
                            ToolTip="Delete panel"
                            Visibility="{c:Binding 'DataItem.PanelType!=profileDomain:PanelType.RefocusDisplay and DataItem.PanelType!=profileDomain:PanelType.HudBarWindow'}">
                            <materialDesign:PackIcon
                                Width="{StaticResource IconSize}"
                                Height="{StaticResource IconSize}"
                                Kind="DeleteOutline" />
                        </Button>
                    </StackPanel>
                </StackPanel>
            </Expander.Header>
            <StackPanel
                Margin="42,8,24,16"
                Orientation="Horizontal"
                TextBlock.Foreground="{DynamicResource MaterialDesignBody}"
                Visibility="{c:Binding 'DataItem.PanelType!=profileDomain:PanelType.HudBarWindow and DataItem.PanelType!=profileDomain:PanelType.RefocusDisplay'}">
                <WrapPanel>
                    <ToggleButton
                        x:Name="TglBtnAlwaysOnTop"
                        Margin="0,0,0,0"
                        IsChecked="{Binding DataItem.AlwaysOnTop, Mode=TwoWay, NotifyOnSourceUpdated=True}"
                        IsEnabled="{c:Binding !DataItem.FullScreen}"
                        SourceUpdated="Data_SourceUpdated"
                        Style="{StaticResource ToggleButton}" />
                    <TextBlock Style="{StaticResource TxtBlockDisableWhenFullScreen}" ToolTip="Set this panel to be always on top">
                        Always on Top
                    </TextBlock>
                </WrapPanel>

                <WrapPanel>
                    <ToggleButton
                        x:Name="TglBtnFullScreen"
                        Margin="0,0,0,0"
                        IsChecked="{Binding DataItem.FullScreen, Mode=TwoWay, NotifyOnSourceUpdated=True}"
                        SourceUpdated="Data_SourceUpdated"
                        Style="{StaticResource ToggleButton}" />
                    <TextBlock Style="{StaticResource TextBlockLabel}" ToolTip="Expand this panel into full screen (emulate keystroke Alt-Enter)">Full Screen Mode</TextBlock>
                </WrapPanel>

                <WrapPanel>
                    <ToggleButton
                        x:Name="TglBtnHideTitlebar"
                        Margin="0,0,0,0"
                        IsChecked="{Binding DataItem.HideTitlebar, Mode=TwoWay, NotifyOnSourceUpdated=True}"
                        IsEnabled="{c:Binding !DataItem.FullScreen}"
                        SourceUpdated="Data_SourceUpdated"
                        Style="{StaticResource ToggleButton}" />
                    <TextBlock Style="{StaticResource TxtBlockDisableWhenFullScreen}" ToolTip="Hide the title bar for this panel">
                        Hide Title Bar
                    </TextBlock>
                </WrapPanel>

                <WrapPanel>
                    <ToggleButton
                        x:Name="TglBtnAutoGameRefocus"
                        Margin="0,0,0,0"
                        IsChecked="{Binding DataItem.AutoGameRefocus, Mode=TwoWay, NotifyOnSourceUpdated=True}"
                        SourceUpdated="Data_SourceUpdated"
                        Style="{StaticResource ToggleButton}" />
                    <TextBlock Style="{StaticResource TextBlockLabel}" ToolTip="Automatic game refocus when clicking this panel or when using touch on this panel">Automatic Game Refocus</TextBlock>
                </WrapPanel>
            </StackPanel>
        </Expander>
    </DockPanel>
</UserControl>