/ src / modules / Workspaces / WorkspacesEditor / MainPage.xaml
MainPage.xaml
  1  <Page
  2      x:Class="WorkspacesEditor.MainPage"
  3      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  4      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  5      xmlns:converters="clr-namespace:WorkspacesEditor.Converters"
  6      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  7      xmlns:local="clr-namespace:WorkspacesEditor"
  8      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  9      xmlns:props="clr-namespace:WorkspacesEditor.Properties"
 10      Title="MainPage"
 11      d:DesignHeight="450"
 12      d:DesignWidth="800"
 13      mc:Ignorable="d">
 14      <Page.Resources>
 15          <BooleanToVisibilityConverter x:Key="BoolToVis" />
 16          <converters:BooleanToInvertedVisibilityConverter x:Key="BooleanToInvertedVisibilityConverter" />
 17          <Thickness x:Key="ContentDialogPadding">24,16,0,24</Thickness>
 18          <Thickness x:Key="ContentDialogCommandSpaceMargin">0,24,24,0</Thickness>
 19          <Style x:Key="DeleteButtonStyle" TargetType="Button">
 20              <Setter Property="Background" Value="{DynamicResource TertiaryBackgroundBrush}" />
 21              <Setter Property="Template">
 22                  <Setter.Value>
 23                      <ControlTemplate TargetType="{x:Type Button}">
 24                          <Border
 25                              x:Name="border"
 26                              Padding="26,6,26,6"
 27                              Background="{TemplateBinding Background}"
 28                              BorderBrush="Transparent">
 29                              <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
 30                          </Border>
 31                          <ControlTemplate.Triggers>
 32                              <Trigger Property="IsMouseOver" Value="True">
 33                                  <Setter TargetName="border" Property="Background" Value="{DynamicResource TitleBarSecondaryForegroundBrush}" />
 34                              </Trigger>
 35                              <Trigger Property="IsPressed" Value="True">
 36                                  <Setter TargetName="border" Property="Background" Value="{DynamicResource TitleBarSecondaryForegroundBrush}" />
 37                              </Trigger>
 38                          </ControlTemplate.Triggers>
 39                      </ControlTemplate>
 40                  </Setter.Value>
 41              </Setter>
 42          </Style>
 43      </Page.Resources>
 44  
 45      <Grid>
 46          <Grid.RowDefinitions>
 47              <RowDefinition Height="Auto" />
 48              <RowDefinition Height="Auto" />
 49              <RowDefinition Height="*" />
 50          </Grid.RowDefinitions>
 51  
 52          <local:HeadingTextBlock
 53              x:Name="WorkspacesHeaderBlock"
 54              Grid.Row="0"
 55              Margin="40,20,40,20"
 56              AutomationProperties.HeadingLevel="Level1"
 57              FontSize="24"
 58              FontWeight="SemiBold"
 59              Foreground="{DynamicResource PrimaryForegroundBrush}"
 60              Text="{x:Static props:Resources.Workspaces}" />
 61  
 62          <Button
 63              x:Name="NewProjectButton"
 64              Grid.Row="0"
 65              Height="36"
 66              Margin="0,20,40,20"
 67              Padding="0"
 68              HorizontalAlignment="Right"
 69              VerticalAlignment="Bottom"
 70              AutomationProperties.Name="{x:Static props:Resources.CreateWorkspace}"
 71              Click="NewProjectButton_Click"
 72              Style="{StaticResource AccentButtonStyle}"
 73              TabIndex="3">
 74              <StackPanel Margin="12,8,12,8" Orientation="Horizontal">
 75                  <TextBlock
 76                      AutomationProperties.Name="{x:Static props:Resources.CreateWorkspace}"
 77                      FontFamily="{DynamicResource SymbolThemeFontFamily}"
 78                      Foreground="{DynamicResource AccentButtonForeground}"
 79                      Text="&#xE710;" />
 80                  <TextBlock
 81                      Margin="12,-3,0,0"
 82                      Foreground="{DynamicResource AccentButtonForeground}"
 83                      Text="{x:Static props:Resources.CreateWorkspace}" />
 84              </StackPanel>
 85              <Button.Effect>
 86                  <DropShadowEffect
 87                      BlurRadius="6"
 88                      Opacity="0.32"
 89                      ShadowDepth="1" />
 90              </Button.Effect>
 91          </Button>
 92  
 93          <Border
 94              Grid.Row="1"
 95              Margin="40,0,0,0"
 96              HorizontalAlignment="Left"
 97              VerticalAlignment="Center"
 98              BorderThickness="2"
 99              CornerRadius="5">
100              <StackPanel Orientation="Horizontal">
101                  <Grid>
102                      <TextBox
103                          x:Name="SearchTextBox"
104                          Width="320"
105                          Background="{DynamicResource SecondaryBackgroundBrush}"
106                          BorderBrush="{DynamicResource PrimaryBorderBrush}"
107                          Text="{Binding SearchTerm, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
108                          ToolTip="{x:Static props:Resources.SearchExplanation}" />
109                      <TextBlock
110                          Margin="10,0,0,0"
111                          VerticalAlignment="Center"
112                          Foreground="{DynamicResource SecondaryForegroundBrush}"
113                          IsHitTestVisible="False"
114                          Text="{x:Static props:Resources.Search}"
115                          ToolTip="{x:Static props:Resources.SearchExplanation}">
116                          <TextBlock.Style>
117                              <Style TargetType="{x:Type TextBlock}">
118                                  <Setter Property="Visibility" Value="Collapsed" />
119                                  <Style.Triggers>
120                                      <DataTrigger Binding="{Binding Text, ElementName=SearchTextBox}" Value="">
121                                          <Setter Property="Visibility" Value="Visible" />
122                                      </DataTrigger>
123                                  </Style.Triggers>
124                              </Style>
125                          </TextBlock.Style>
126                      </TextBlock>
127                  </Grid>
128                  <TextBlock
129                      Margin="-50,0,34,0"
130                      HorizontalAlignment="Left"
131                      VerticalAlignment="Center"
132                      AutomationProperties.Name="{x:Static props:Resources.Search}"
133                      FontFamily="{DynamicResource SymbolThemeFontFamily}"
134                      Foreground="{DynamicResource SecondaryForegroundBrush}"
135                      Text="&#xE71E;" />
136              </StackPanel>
137          </Border>
138  
139          <StackPanel
140              Grid.Row="1"
141              Margin="0,0,40,0"
142              HorizontalAlignment="Right"
143              Orientation="Horizontal">
144              <TextBlock
145                  Margin="10,0,10,0"
146                  VerticalAlignment="Center"
147                  Foreground="{DynamicResource PrimaryForegroundBrush}"
148                  Text="{x:Static props:Resources.SortBy}" />
149              <ComboBox
150                  Width="140"
151                  Background="{DynamicResource SecondaryBackgroundBrush}"
152                  BorderBrush="{DynamicResource PrimaryBorderBrush}"
153                  BorderThickness="2"
154                  SelectedIndex="{Binding OrderByIndex, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
155                  <ComboBoxItem Content="{x:Static props:Resources.LastLaunched}" />
156                  <ComboBoxItem Content="{x:Static props:Resources.Created}" />
157                  <ComboBoxItem Content="{x:Static props:Resources.Name}" />
158              </ComboBox>
159          </StackPanel>
160          <TextBlock
161              Grid.Row="2"
162              HorizontalAlignment="Center"
163              VerticalAlignment="Center"
164              FontSize="20"
165              Foreground="{DynamicResource SecondaryForegroundBrush}"
166              Text="{Binding EmptyWorkspacesViewMessage, UpdateSourceTrigger=PropertyChanged}"
167              TextAlignment="Center"
168              Visibility="{Binding IsWorkspacesViewEmpty, Mode=OneWay, Converter={StaticResource BoolToVis}, UpdateSourceTrigger=PropertyChanged}" />
169          <ScrollViewer
170              Grid.Row="2"
171              Margin="40,15,40,40"
172              VerticalContentAlignment="Stretch"
173              VerticalScrollBarVisibility="Auto"
174              Visibility="{Binding IsWorkspacesViewEmpty, Mode=OneWay, Converter={StaticResource BooleanToInvertedVisibilityConverter}, UpdateSourceTrigger=PropertyChanged}">
175              <ItemsControl x:Name="WorkspacesItemsControl" ItemsSource="{Binding WorkspacesView, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}">
176                  <ItemsControl.ItemsPanel>
177                      <ItemsPanelTemplate>
178                          <StackPanel
179                              HorizontalAlignment="Stretch"
180                              IsItemsHost="True"
181                              Orientation="Vertical" />
182                      </ItemsPanelTemplate>
183                  </ItemsControl.ItemsPanel>
184                  <ItemsControl.ItemTemplate>
185                      <DataTemplate DataType="models:Project">
186                          <Button
187                              x:Name="EditButton"
188                              Margin="0,12,0,0"
189                              Padding="1"
190                              HorizontalAlignment="Stretch"
191                              HorizontalContentAlignment="Stretch"
192                              AutomationProperties.Name="{x:Static props:Resources.Edit}"
193                              Background="{DynamicResource SecondaryBackgroundBrush}"
194                              Click="EditButtonClicked">
195                              <Border
196                                  HorizontalAlignment="Stretch"
197                                  Background="{DynamicResource SecondaryBackgroundBrush}"
198                                  CornerRadius="5">
199                                  <Grid HorizontalAlignment="Stretch">
200                                      <Grid.ColumnDefinitions>
201                                          <ColumnDefinition Width="*" />
202                                          <ColumnDefinition Width="Auto" />
203                                      </Grid.ColumnDefinitions>
204                                      <StackPanel
205                                          Margin="12,14,10,10"
206                                          HorizontalAlignment="Left"
207                                          Orientation="Vertical">
208                                          <TextBlock
209                                              Margin="0,0,0,8"
210                                              HorizontalAlignment="Left"
211                                              VerticalAlignment="Center"
212                                              FontSize="16"
213                                              FontWeight="SemiBold"
214                                              Text="{Binding Name, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}" />
215                                          <StackPanel
216                                              Margin="0,0,0,8"
217                                              VerticalAlignment="Center"
218                                              Orientation="Horizontal">
219                                              <Image Height="20" Source="{Binding PreviewIcons, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}" />
220                                              <TextBlock
221                                                  Margin="6,0,4,0"
222                                                  VerticalAlignment="Center"
223                                                  Text="{Binding AppsCountString}" />
224                                          </StackPanel>
225                                          <StackPanel VerticalAlignment="Center" Orientation="Horizontal">
226                                              <TextBlock
227                                                  Margin="0,3,10,0"
228                                                  FontFamily="{DynamicResource SymbolThemeFontFamily}"
229                                                  Foreground="{DynamicResource PrimaryForegroundBrush}"
230                                                  Text="&#xE81C;" />
231                                              <TextBlock Text="{Binding LastLaunched, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}" />
232                                          </StackPanel>
233                                      </StackPanel>
234                                      <StackPanel
235                                          Grid.Column="1"
236                                          Margin="12,12,12,12"
237                                          Orientation="Vertical">
238                                          <StackPanel
239                                              x:Name="WorkspaceActionGroup"
240                                              HorizontalAlignment="Right"
241                                              Orientation="Horizontal">
242                                              <Button
243                                                  x:Name="MoreButton"
244                                                  HorizontalAlignment="Right"
245                                                  Click="MoreButton_Click"
246                                                  Style="{StaticResource IconOnlyButtonStyle}">
247                                                  <TextBlock
248                                                      FontFamily="{DynamicResource SymbolThemeFontFamily}"
249                                                      Foreground="{DynamicResource PrimaryForegroundBrush}"
250                                                      Text="&#xE712;" />
251                                              </Button>
252                                              <Popup
253                                                  AllowsTransparency="True"
254                                                  Closed="PopupClosed"
255                                                  IsOpen="{Binding IsPopupVisible, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
256                                                  Placement="Left"
257                                                  PlacementTarget="{Binding ElementName=MoreButton}"
258                                                  StaysOpen="False">
259                                                  <Grid Background="{DynamicResource PrimaryBackgroundBrush}">
260                                                      <Grid.OpacityMask>
261                                                          <VisualBrush Visual="{Binding ElementName=OpacityBorder}" />
262                                                      </Grid.OpacityMask>
263                                                      <Border
264                                                          x:Name="OpacityBorder"
265                                                          HorizontalAlignment="Stretch"
266                                                          VerticalAlignment="Stretch"
267                                                          Background="Black"
268                                                          CornerRadius="5" />
269                                                      <StackPanel Background="{DynamicResource PrimaryBackgroundBrush}" Orientation="Vertical">
270                                                          <Button
271                                                              AutomationProperties.Name="{x:Static props:Resources.Edit}"
272                                                              Click="EditButtonClicked"
273                                                              Style="{StaticResource DeleteButtonStyle}">
274                                                              <StackPanel Orientation="Horizontal">
275                                                                  <TextBlock
276                                                                      AutomationProperties.Name="{x:Static props:Resources.Edit}"
277                                                                      FontFamily="{DynamicResource SymbolThemeFontFamily}"
278                                                                      Foreground="{DynamicResource PrimaryForegroundBrush}"
279                                                                      Text="&#xE70F;" />
280                                                                  <TextBlock
281                                                                      Margin="10,0,0,0"
282                                                                      AutomationProperties.Name="{x:Static props:Resources.Edit}"
283                                                                      Foreground="{DynamicResource PrimaryForegroundBrush}"
284                                                                      Text="{x:Static props:Resources.Edit}" />
285                                                              </StackPanel>
286                                                          </Button>
287                                                          <Button
288                                                              AutomationProperties.Name="{x:Static props:Resources.Delete}"
289                                                              Click="DeleteButtonClicked"
290                                                              Style="{StaticResource DeleteButtonStyle}">
291                                                              <StackPanel Orientation="Horizontal">
292                                                                  <TextBlock
293                                                                      AutomationProperties.Name="{x:Static props:Resources.Delete}"
294                                                                      FontFamily="{DynamicResource SymbolThemeFontFamily}"
295                                                                      Foreground="{DynamicResource PrimaryForegroundBrush}"
296                                                                      Text="&#xE74D;" />
297                                                                  <TextBlock
298                                                                      Margin="10,0,0,0"
299                                                                      AutomationProperties.Name="{x:Static props:Resources.Delete}"
300                                                                      Foreground="{DynamicResource PrimaryForegroundBrush}"
301                                                                      Text="{x:Static props:Resources.Delete}" />
302                                                              </StackPanel>
303                                                          </Button>
304                                                      </StackPanel>
305                                                  </Grid>
306                                              </Popup>
307                                          </StackPanel>
308                                          <Button
309                                              Margin="0,6,0,0"
310                                              Padding="20,4,20,4"
311                                              HorizontalAlignment="Right"
312                                              AutomationProperties.Name="{x:Static props:Resources.Launch}"
313                                              Background="{DynamicResource TertiaryBackgroundBrush}"
314                                              BorderBrush="{DynamicResource SecondaryBorderBrush}"
315                                              BorderThickness="2"
316                                              Click="LaunchButton_Click"
317                                              Content="{x:Static props:Resources.Launch}" />
318                                      </StackPanel>
319                                  </Grid>
320                              </Border>
321                          </Button>
322                      </DataTemplate>
323                  </ItemsControl.ItemTemplate>
324              </ItemsControl>
325          </ScrollViewer>
326      </Grid>
327  </Page>