Public Access
jaap-jan
208443b932
Four asks in one pass over the desktop head, and two of them are furniture moving rather than anything new. THE STRIP IS THE WINDOW'S NOW, not the terminal's. Vaults, SFTP and S3 sit at its head and cannot be closed, and open terminals follow them. SFTP and S3 left the nav rail to get there, which is the one semantic change: they are the two destinations you stay in while something runs, and a rail entry is for somewhere you go and come back from. So the rail belongs to the Vaults tab and collapses with it, which also means SFTP, S3 and a terminal each get the full 1016 rather than the 826 a page gets. The tab is expressed as "a page, and not one of the two the strip took" rather than as a fourth ShellSurface. Both are still ShellScreen members and have to be — that is what they are on the phone, where they are two rows in a hub — so a surface each would have been a second way to say a thing Screen already says. IsTransfersShowing and IsBucketsShowing light the other two tabs unchanged. What is new is one field: the page Vaults comes back to, because it is the one tab with sub-navigation and therefore the one that can return to the wrong place. That is not the hidden field ShellSurface argues against — that one would be a second copy of "which page"; this is a tab remembering its own. THE HOSTS SCREEN IS A GRID, and the 268-pixel sidebar is gone. That column was choosing among forty machines and editing one of them at two-thirds width, and it was narrow so the editor beneath it could be a column at all. Cards took the first job at full width; a 304-pixel drawer took the second and collapses when nothing is selected. Pressing a group card narrows the grid; SHOW ALL is the way back. The group editor moved into the drawer as well, which finally makes IsEditingGroup mean the same thing on both heads — it was the phone's alone, because the desktop's editor was a bar that was always on screen. AreHostsExpanded and ToggleHosts went with the control that used them. They folded the whole list away under one heading, an affordance that existed because the column was narrow. Folding a single group is a different thing and is still here. THE TYPE SCALE IS A POINT LARGER and the text ramp is white. The base size was never stated anywhere — a bare TextBlock took TextElement's default of 12 — so raising the scale meant naming it, on Window and on UserControl. The second selector is not redundancy: the layout harness hosts a UserControl in a window it builds itself, and without it the suite would measure every screen a point smaller than it ships, silently. A selector on TextBlock would have been the obvious way and is wrong, because a style setter beats an inherited value and would collapse every deliberate step back to one number. #E3E7F4 is a blue-tinted white on blue-black surfaces, which costs contrast twice — once for being darker than white and once for sharing a hue with what it is drawn on. Pure white is 18.3:1 against the canvas where that was 15.5:1. Every step below moved with the top, so the intervals the design chose are kept and TextDim clears 9:1 against 6.4:1. The palette is shared, so the phone has both changes too. TWO DEFECTS THE HARNESS STRUCTURALLY CANNOT SEE, found by rendering the screen rather than by measuring it, and both now covered. The tile was 232 and was first written as 248, from arithmetic that left out the scrolling stack's own margins. Every layout test passed — the harness asks whether a control is inside the window, never how many fit on a line — so the grid quietly became one column wide at exactly the minimum this application guarantees, which is the shape cards exist to avoid. TheHostsGridKeepsTwoColumnsAtTheMinimumWithTheDrawerOpen counts columns instead, and fails at 248. And a card's text ran past its own border, because a horizontal StackPanel measures children with infinite width: a TextBlock inside one never learns it is short of room, so TextTrimming never fires. Both card rows are grids with a star column that gives way and an Auto column that does not — a hostname with its tail cut is still the machine you were looking for, where a badge or the word naming an auth method is not. The keychain header changed shape for the same class of reason. It was Auto,Auto,*,Auto with the buttons last, so the slack column was the only thing absorbing a change of width and five buttons fell off the right edge the moment the type grew. That is how GENERATE lost the word KEY once already. The summary sits in the star column and trims now, so the buttons always get their width. HostSidebarTests became HostGridTests and moved to the grid with the gestures it drives. docs/design-import-gaps.md gains a v3 section naming the five toolbar controls in the design with nothing behind them — a view-mode switch, a tag filter, a calendar, a share control and Serial — and manual-checks.md and the README follow the controls that moved.
175 lines
9.8 KiB
XML
175 lines
9.8 KiB
XML
<UserControl xmlns="https://github.com/avaloniaui"
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
|
xmlns:vm="using:DodoSSH.Client.Shell.ViewModels"
|
|
x:Class="DodoSSH.Client.App.Views.SnippetsScreen"
|
|
x:DataType="vm:SnippetsViewModel">
|
|
|
|
<!--
|
|
Commands somebody has saved, and how to get one into a terminal.
|
|
|
|
The list and the writing belong to the vault, as every other item kind's do; this screen is the filter,
|
|
the editor and the insert over the top. See SnippetsViewModel.
|
|
|
|
The two buttons at the bottom right are the whole safety design, and their wording is load-bearing.
|
|
A terminal is one input stream with no notion of being at a prompt — the remote may be inside vi, or at
|
|
a sudo password prompt with echo off — so this application cannot say "run this command", only "type
|
|
this into whatever is there". RUN appears solely for a snippet whose own flag says it runs, which makes
|
|
that a decision taken once while writing it rather than a button beside every one of them.
|
|
-->
|
|
|
|
<Grid ColumnDefinitions="*,300">
|
|
|
|
<Grid Grid.Column="0" RowDefinitions="Auto,*,Auto">
|
|
|
|
<Border Grid.Row="0" Padding="14,0" Height="44"
|
|
BorderBrush="{StaticResource Border}" BorderThickness="0,0,0,1">
|
|
<Grid ColumnDefinitions="Auto,*,Auto" VerticalAlignment="Center">
|
|
<TextBlock Grid.Column="0" Classes="mono" Text="SNIPPETS" FontSize="12"
|
|
FontWeight="SemiBold" LetterSpacing="1" Foreground="{StaticResource Text}"
|
|
VerticalAlignment="Center" />
|
|
<TextBlock Grid.Column="1" Classes="mono" Text="{Binding Status}" FontSize="10.5"
|
|
Foreground="{StaticResource TextFaint}" Margin="10,0,0,0"
|
|
TextTrimming="CharacterEllipsis" VerticalAlignment="Center" />
|
|
|
|
<!--
|
|
The command is searched as well as the name: half of what anybody remembers about a saved
|
|
command is a word that was inside it.
|
|
-->
|
|
<TextBox Grid.Column="2" x:Name="SnippetFilter" Text="{Binding Filter}" Width="240"
|
|
PlaceholderText="filter by name or command" VerticalAlignment="Center" />
|
|
</Grid>
|
|
</Border>
|
|
|
|
<ListBox Grid.Row="1" x:Name="SnippetList" Focusable="True"
|
|
ItemsSource="{Binding Visible}"
|
|
SelectedItem="{Binding Selected}">
|
|
<ListBox.ItemTemplate>
|
|
<DataTemplate x:DataType="vm:SnippetRowViewModel">
|
|
<Grid ColumnDefinitions="2,*" Margin="0,7,14,7">
|
|
<Border Grid.Column="0" Classes="rowmark" />
|
|
<StackPanel Grid.Column="1" Margin="12,0,0,0" Spacing="2">
|
|
<StackPanel Orientation="Horizontal" Spacing="6">
|
|
<TextBlock Classes="mono" Text="{Binding Label}" FontSize="12" FontWeight="Medium"
|
|
Foreground="{StaticResource Text}" TextTrimming="CharacterEllipsis" />
|
|
<!--
|
|
The flag, where the decision is made. A snippet that presses Enter for you is not the
|
|
same kind of thing as one that does not, and the list is where somebody chooses between
|
|
them.
|
|
-->
|
|
<Border Classes="chip warn" Padding="4,0" IsVisible="{Binding RunsOnInsert}">
|
|
<TextBlock Text="runs immediately" FontSize="9.5" />
|
|
</Border>
|
|
<Border Classes="chip warn" Padding="4,0"
|
|
IsVisible="{Binding Badge, Converter={x:Static StringConverters.IsNotNullOrEmpty}}">
|
|
<TextBlock Text="{Binding Badge}" FontSize="9.5" />
|
|
</Border>
|
|
</StackPanel>
|
|
<!--
|
|
Newlines shown as ⏎ rather than dropped. A three-line snippet flattened into one run of
|
|
text reads as a single command, which is the thing being decided about on this row.
|
|
-->
|
|
<TextBlock Classes="mono" Text="{Binding Preview}" FontSize="10.5"
|
|
Foreground="{StaticResource TextFaint}" TextTrimming="CharacterEllipsis" />
|
|
</StackPanel>
|
|
</Grid>
|
|
</DataTemplate>
|
|
</ListBox.ItemTemplate>
|
|
</ListBox>
|
|
|
|
<TextBlock Grid.Row="1" Classes="hint" Text="{Binding EmptyMessage}" FontSize="12"
|
|
Margin="24" HorizontalAlignment="Center" VerticalAlignment="Center"
|
|
TextAlignment="Center" MaxWidth="360"
|
|
IsVisible="{Binding !HasVisible}" />
|
|
|
|
<Border Grid.Row="2" Padding="14,8" BorderBrush="{StaticResource BorderSubtle}"
|
|
BorderThickness="0,1,0,0">
|
|
<StackPanel Orientation="Horizontal" Spacing="6">
|
|
<Button Classes="ghost" Content="+ NEW SNIPPET" Command="{Binding NewCommand}" />
|
|
<Button Classes="ghost" Content="EDIT" Command="{Binding EditCommand}"
|
|
IsEnabled="{Binding HasSelection}" />
|
|
<Button Classes="ghost" Content="DELETE" Command="{Binding DeleteCommand}"
|
|
IsEnabled="{Binding HasSelection}" />
|
|
</StackPanel>
|
|
</Border>
|
|
|
|
</Grid>
|
|
|
|
<Border Grid.Column="1" Background="{StaticResource Sidebar}"
|
|
BorderBrush="{StaticResource Border}" BorderThickness="1,0,0,0">
|
|
<ScrollViewer>
|
|
<StackPanel Margin="14,16" Spacing="8">
|
|
|
|
<!-- ============ The editor ============ -->
|
|
<StackPanel Spacing="6" IsVisible="{Binding IsEditing}">
|
|
<TextBox Text="{Binding EditorLabel}" PlaceholderText="name" />
|
|
<!--
|
|
Stored exactly as typed — no trimming, no newline normalisation. A here-document's terminator
|
|
has to arrive on a line of its own, and tidying the trailing newline off it leaves the shell
|
|
waiting for one that never comes.
|
|
-->
|
|
<TextBox Text="{Binding EditorCommand}" PlaceholderText="the command" AcceptsReturn="True"
|
|
Height="140" TextWrapping="NoWrap" FontFamily="{StaticResource MonoFont}"
|
|
FontSize="12" />
|
|
<TextBox Text="{Binding EditorNotes}" PlaceholderText="notes" AcceptsReturn="True"
|
|
Height="48" TextWrapping="Wrap" />
|
|
<CheckBox IsChecked="{Binding EditorRunsOnInsert}"
|
|
Content="Press Enter after inserting this" />
|
|
<TextBlock Classes="hint" FontSize="11" TextWrapping="Wrap"
|
|
Text="Off means the command is typed at the prompt and waits for you. That single Enter is the only thing standing between a saved command and a running one, so leave it off unless you meant it." />
|
|
<StackPanel Orientation="Horizontal" Spacing="6">
|
|
<Button Classes="accent" Content="SAVE" Command="{Binding SaveCommand}" />
|
|
<Button Classes="ghost" Content="CANCEL" Command="{Binding CancelCommand}" />
|
|
</StackPanel>
|
|
</StackPanel>
|
|
|
|
<!-- ============ The selected snippet ============ -->
|
|
<StackPanel Spacing="6" IsVisible="{Binding !IsEditing}">
|
|
|
|
<TextBlock Classes="hint" FontSize="12"
|
|
Text="Choose a snippet to see it in full and put it into a terminal."
|
|
IsVisible="{Binding !HasSelection}" />
|
|
|
|
<StackPanel Spacing="6" IsVisible="{Binding HasSelection}">
|
|
<TextBlock Classes="mono" Text="{Binding Selected.Label}" FontSize="13"
|
|
FontWeight="SemiBold" Foreground="{StaticResource Text}" TextWrapping="Wrap" />
|
|
|
|
<TextBlock Classes="label" Text="COMMAND" Margin="0,10,0,4" />
|
|
<Border Background="{StaticResource Raised}" BorderBrush="{StaticResource Border}"
|
|
BorderThickness="1" CornerRadius="4" Padding="8">
|
|
<SelectableTextBlock Classes="mono" Text="{Binding Selected.Snippet.Command}"
|
|
FontSize="10.5" Foreground="{StaticResource TextDim}"
|
|
TextWrapping="Wrap" />
|
|
</Border>
|
|
|
|
<TextBlock Classes="mono" Text="{Binding Selected.Snippet.Notes}" FontSize="11"
|
|
Foreground="{StaticResource TextFaint}" TextWrapping="Wrap" Margin="0,6,0,0"
|
|
IsVisible="{Binding Selected.Snippet.Notes, Converter={x:Static StringConverters.IsNotNullOrEmpty}}" />
|
|
|
|
<!--
|
|
The button names the tab it will type into. This screen is not the terminal — the strip
|
|
above it is — so "INSERT" alone would leave somebody working out which of six open tabs is
|
|
about to receive a command, at the moment that is worst to be wrong about.
|
|
-->
|
|
<Button Classes="accent" Content="{Binding InsertLabel}" Margin="0,14,0,0"
|
|
HorizontalAlignment="Left"
|
|
Command="{Binding InsertCommand}" IsEnabled="{Binding CanInsert}"
|
|
ToolTip.Tip="Types the command at the prompt and stops. Nothing runs until you press Enter there." />
|
|
|
|
<Button Classes="danger" Content="{Binding RunLabel}" HorizontalAlignment="Left"
|
|
Command="{Binding RunCommand}"
|
|
IsVisible="{Binding SelectionRuns}" IsEnabled="{Binding CanInsert}"
|
|
ToolTip.Tip="Types the command and presses Enter. Offered because this snippet is marked as one that runs." />
|
|
|
|
<TextBlock Classes="hint" FontSize="11" TextWrapping="Wrap" Margin="0,10,0,0"
|
|
Text="Whatever is in the terminal receives this. Nothing here can tell whether that is a shell prompt, an editor, or a password prompt with the echo off — so check the tab before you insert." />
|
|
</StackPanel>
|
|
</StackPanel>
|
|
|
|
</StackPanel>
|
|
</ScrollViewer>
|
|
</Border>
|
|
|
|
</Grid>
|
|
|
|
</UserControl>
|