Feature/pin layout window

src/InvvardDev.EZLayoutDisplay.Desktop/InvvardDev.EZLayoutDisplay.Desktop.csproj

@@ -269,6 +269,10 @@
   <ItemGroup>
     <Resource Include="Skins\Images\warning-sign.png" />
   </ItemGroup>
+  <ItemGroup>
+    <Resource Include="Skins\Images\pin.png" />
+    <Resource Include="Skins\Images\pin.remove.png" />
+  </ItemGroup>
   <Import Project="$(MSBuildToolsPath)\Microsoft.CSharp.targets" />
   <!-- To modify your build process, add your task inside one of the targets below and uncomment it. 
        Other similar extension points exist, see Microsoft.Common.targets.

src/InvvardDev.EZLayoutDisplay.Desktop/Skins/DisplayLayoutSkin.xaml

@@ -1,6 +1,76 @@
 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
+    <Style x:Key="FocusVisual">
+        <Setter Property="Control.Template">
+            <Setter.Value>
+                <ControlTemplate>
+                    <Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
+    <SolidColorBrush x:Key="Button.Static.Background" Color="#FFDDDDDD"/>
+    <SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/>
+    <SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FFBEE6FD"/>
+    <SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FF3C7FB1"/>
+    <SolidColorBrush x:Key="Button.Pressed.Background" Color="#FFC4E5F6"/>
+    <SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/>
+    <SolidColorBrush x:Key="Button.Disabled.Background" Color="#FFF4F4F4"/>
+    <SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/>
+    <SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/>
+
+    <Style x:Key="ToggleButtonPinWindowStyle" TargetType="{x:Type ToggleButton}">
+        <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
+        <Setter Property="Background" Value="{StaticResource Button.Static.Background}"/>
+        <Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border}"/>
+        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="HorizontalContentAlignment" Value="Center"/>
+        <Setter Property="VerticalContentAlignment" Value="Center"/>
+        <Setter Property="Padding" Value="1"/>
+        <Setter Property="Height" Value="32"/>
+        <Setter Property="Margin" Value="0 0 0 5"/>
+        <Setter Property="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType="{x:Type ToggleButton}">
+                    <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"
+                            SnapsToDevicePixels="true" HorizontalAlignment="Right" Cursor="Hand">
+                        <StackPanel Width="100" VerticalAlignment="Center" Orientation="Horizontal" Margin="5,0">
+                            <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
+                            <Image x:Name="toggleIcon" Height="{TemplateBinding Height}" VerticalAlignment="Center" HorizontalAlignment="Right" Margin="10,0,0,0"/>
+                        </StackPanel>
+                    </Border>
+                    <ControlTemplate.Triggers>
+                        <Trigger Property="Button.IsDefaulted" Value="true">
+                            <Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
+                            <Setter Property="Source" TargetName="toggleIcon" Value="/InvvardDev.EZLayoutDisplay.Desktop;component/Skins/Images/pin.png"/>
+                        </Trigger>
+                        <Trigger Property="IsChecked" Value="False">
+                            <Setter Property="Source" TargetName="toggleIcon" Value="/InvvardDev.EZLayoutDisplay.Desktop;component/Skins/Images/pin.png"/>
+                        </Trigger>
+                        <Trigger Property="IsChecked" Value="True">
+                            <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background}"/>
+                            <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border}"/>
+                            <Setter Property="Source" TargetName="toggleIcon" Value="/InvvardDev.EZLayoutDisplay.Desktop;component/Skins/Images/pin.remove.png"/>
+                        </Trigger>
+                        <Trigger Property="IsMouseOver" Value="true">
+                            <Setter Property="Background" TargetName="border" Value="{StaticResource Button.MouseOver.Background}"/>
+                            <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border}"/>
+                        </Trigger>
+                        <Trigger Property="IsEnabled" Value="false">
+                            <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Disabled.Background}"/>
+                            <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Disabled.Border}"/>
+                            <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground}"/>
+                            <Setter Property="Source" TargetName="toggleIcon" Value="/InvvardDev.EZLayoutDisplay.Desktop;component/Skins/Images/pin.remove.png"/>
+                        </Trigger>
+                    </ControlTemplate.Triggers>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
+
     <Style TargetType="StackPanel" x:Key="SpLayerNameStyle">
         <Setter Property="Width" Value="180" />
         <Setter Property="Margin" Value="0,25,0,0" />

src/InvvardDev.EZLayoutDisplay.Desktop/View/DisplayLayoutWindow.xaml

@@ -4,14 +4,14 @@
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
-    xmlns:command="http://www.galasoft.ch/mvvmlight"
+    xmlns:command="http://www.galasoft.ch/mvvmlight" mc:Ignorable="d"
     x:Class="InvvardDev.EZLayoutDisplay.Desktop.View.DisplayLayoutWindow"
-    mc:Ignorable="d" Height="423" Width="1075"
-    WindowStartupLocation="CenterScreen"
+    DataContext="{Binding DisplayLayout, Source={StaticResource Locator}}"
+    Height="Auto" Width="Auto" SizeToContent="WidthAndHeight"
+    WindowStartupLocation="CenterScreen" Topmost="{Binding ElementName=ToggleWindowPin, Path=IsChecked}"
     ResizeMode="NoResize" Visibility="Visible" ShowInTaskbar="True"
-    WindowStyle="None" Background="{StaticResource WindowBackgroundBrush}"
-    Title="{Binding WindowTitle}" Icon="{StaticResource WindowIcon}"
-    DataContext="{Binding DisplayLayout, Source={StaticResource Locator}}">
+    WindowStyle="SingleBorderWindow" Background="{StaticResource WindowBackgroundBrush}"
+    Title="{Binding WindowTitle}" Icon="{StaticResource WindowIcon}">
 
     <Window.Resources>
         <ResourceDictionary>
@@ -28,12 +28,12 @@
         </i:EventTrigger>
     </i:Interaction.Triggers>
     <Window.InputBindings>
-        <KeyBinding Key="Escape" Command="{Binding LostFocusCommand, Mode=OneWay}" />
+        <KeyBinding Key="Escape" Command="{Binding HideWindowCommand, Mode=OneWay}" />
         <KeyBinding Key="Space" Command="{Binding NextLayerCommand, Mode=OneWay}" />
     </Window.InputBindings>
 
-    <Grid>
-        <ItemsControl ItemsSource="{Binding CurrentLayoutTemplate}"
+    <Grid Width="1075" Height="423">
+        <ItemsControl ItemsSource="{Binding CurrentLayoutTemplate}" Focusable="False"
                       ItemTemplateSelector="{StaticResource KeyContentTemplateSelector}"
                       Visibility="{Binding NoLayoutAvailable, Converter={StaticResource BoolToVisibleConverter}}">
             <ItemsControl.ItemsPanel>
@@ -51,7 +51,10 @@
 
         <StackPanel Style="{StaticResource SpControlHintStyle}"
             Visibility="{Binding NoLayoutAvailable, Converter={StaticResource BoolToVisibleConverter}}">
-            <TextBlock Text="{Binding ControlHintLabel}" Style="{StaticResource TbControlHintStyle}" />
+            <ToggleButton x:Name="ToggleWindowPin" Content="{Binding ToggleBtnPinWindowContent}" ToolTip="{Binding ToggleBtnPinWindowTooltip}"
+                          IsChecked="{Binding IsWindowPinned}" Focusable="False" Style="{StaticResource ToggleButtonPinWindowStyle}" />
+            <TextBlock Text="{Binding ControlHintEscapeLabel}" Style="{StaticResource TbControlHintStyle}" />
+            <TextBlock Text="{Binding ControlHintSpaceLabel}" Style="{StaticResource TbControlHintStyle}" /> 
         </StackPanel>
 
         <Grid Visibility="{Binding NoLayoutAvailable, Converter={StaticResource BoolToHiddenConverter}}" Width="350">

src/InvvardDev.EZLayoutDisplay.Desktop/ViewModel/DisplayLayoutViewModel.cs

@@ -31,19 +31,25 @@ public class DisplayLayoutViewModel : ViewModelBase
         private readonly ISettingsService _settingsService;
 
         private ICommand _lostFocusCommand;
+        private ICommand _hideWindowCommand;
         private ICommand _nextLayerCommand;
 
         private List<List<KeyTemplate>> _layoutTemplates;
         private ObservableCollection<KeyTemplate> _currentLayoutTemplate;
         private int _currentLayerIndex;
         private EZLayout _ezLayout;
 
+        private bool _isWindowPinned;
+
         private string _windowTitle;
         private string _noLayoutWarningFirstLine;
         private string _noLayoutWarningSecondLine;
         private string _currentLayerNameTitle;
         private string _currentLayerName;
-        private string _controlHintLabel;
+        private string _controlHintSpaceLabel;
+        private string _controlHintEscapeLabel;
+        private string _toggleBtnPinWindowContent;
+        private string _toggleBtnPinWindowTooltip;
         private bool _noLayoutAvailable;
 
         #endregion
@@ -96,12 +102,39 @@ public string CurrentLayerName
         }
 
         /// <summary>
-        /// Gets or sets the control hint label.
+        /// Gets or sets the control hint label for the Space bar.
         /// </summary>
-        public string ControlHintLabel
+        public string ControlHintSpaceLabel
         {
-            get => _controlHintLabel;
-            private set => Set(ref _controlHintLabel, value);
+            get => _controlHintSpaceLabel;
+            private set => Set(ref _controlHintSpaceLabel, value);
+        }
+
+        /// <summary>
+        /// Gets or sets the control hint label for the Space bar.
+        /// </summary>
+        public string ControlHintEscapeLabel
+        {
+            get => _controlHintEscapeLabel;
+            private set => Set(ref _controlHintEscapeLabel, value);
+        }
+
+        /// <summary>
+        /// Gets or sets the Pin window toggle button label.
+        /// </summary>
+        public string ToggleBtnPinWindowContent
+        {
+            get => _toggleBtnPinWindowContent;
+            private set => Set(ref _toggleBtnPinWindowContent, value);
+        }
+
+        /// <summary>
+        /// Gets or sets the Pin window toggle button label.
+        /// </summary>
+        public string ToggleBtnPinWindowTooltip
+        {
+            get => _toggleBtnPinWindowTooltip;
+            private set => Set(ref _toggleBtnPinWindowTooltip, value);
         }
 
         /// <summary>
@@ -131,6 +164,15 @@ public int CurrentLayerIndex
             private set => Set(ref _currentLayerIndex, value);
         }
 
+        /// <summary>
+        /// Gets or sets the pinned status.
+        /// </summary>
+        public bool IsWindowPinned
+        {
+            get => _isWindowPinned;
+            set => Set(ref _isWindowPinned, value);
+        }
+
         #endregion
 
         #region Relay commands
@@ -140,7 +182,14 @@ public int CurrentLayerIndex
         /// </summary>
         public ICommand LostFocusCommand =>
             _lostFocusCommand
-            ?? (_lostFocusCommand = new RelayCommand(LostFocus));
+            ?? (_lostFocusCommand = new RelayCommand(LostFocus, LostFocusCanExecute));
+
+        /// <summary>
+        /// Hide window command.
+        /// </summary>
+        public ICommand HideWindowCommand =>
+            _hideWindowCommand
+            ?? (_hideWindowCommand = new RelayCommand(LostFocus));
 
         /// <summary>
         /// Next layer command.
@@ -164,6 +213,7 @@ public DisplayLayoutViewModel(IWindowService windowService, ILayoutService layou
             CurrentLayoutTemplate = new ObservableCollection<KeyTemplate>();
 
             SetLabelUi();
+            SetWindowParameters();
             LoadCompleteLayout();
         }
 
@@ -176,7 +226,15 @@ private void SetLabelUi()
             NoLayoutWarningSecondLine = "Please, go to the settings and update the layout.";
             CurrentLayerNameTitle = "Current layer :";
             CurrentLayerName = "";
-            ControlHintLabel = "Press 'Space' to display next layer";
+            ControlHintSpaceLabel = "Press 'Space' to display next layer";
+            ControlHintEscapeLabel = "Press 'Escape' to hide window";
+            ToggleBtnPinWindowContent = "_Pin window";
+            ToggleBtnPinWindowTooltip = "Press 'P' to toggle";
+        }
+
+        private void SetWindowParameters()
+        {
+            IsWindowPinned = false;
         }
 
         private async void LoadCompleteLayout()
@@ -239,7 +297,7 @@ private void LoadDesignTimeModel()
                                                            DisplayType = KeyDisplayType.SimpleLabel,
                                                            KeyCategory = KeyCategory.DualFunction,
                                                            Color = "#BBB"
-            };
+                                                       };
 
             for (int i = 2 ; i < CurrentLayoutTemplate.Count ; i++)
             {
@@ -249,7 +307,7 @@ private void LoadDesignTimeModel()
                                                                KeyCategory = KeyCategory.French,
                                                                InternationalHint = "fr",
                                                                Color = "#777"
-                };
+                                                           };
             }
         }
 
@@ -337,6 +395,13 @@ private bool NextLayerCanExecute()
             return canExecute;
         }
 
+        private bool LostFocusCanExecute()
+        {
+            var canExecute = !IsWindowPinned;
+
+            return canExecute;
+        }
+
         #endregion
 
         #endregion