TASK 51 slice 5: webcam Background section in the Layers properties — Remove/Blur PillToggles (radio-exclusive) + Strength slider; strength changes never blank the webcam (new variant inherits the same-effect frame + bitmap). TASK 51 built (Unit: bg-effects UI)

2026-10-09 10:31:11 -07:00
parent de22983b36
commit 352f117cb2
11 changed files with 169 additions and 49 deletions
@@ -284,6 +284,37 @@
                                    <TextBlock Text="{Binding SelectedElement.BorderWidth}" Foreground="#a0a0b0" FontSize="11"
                                               VerticalAlignment="Center" Margin="8,0,0,0" Width="20"/>
                                </DockPanel>
+
+                                <!-- TASK 51: background effects — two pills acting as radio buttons
+                                     (one on turns the other off; both off = no effect). -->
+                                <TextBlock Text="Background" Foreground="#a0a0b0" FontSize="11" FontWeight="SemiBold" Margin="0,6,0,6"/>
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Remove" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="84"/>
+                                    <ToggleButton x:Name="RemoveBackgroundPill" Style="{StaticResource PillToggle}"
+                                                  IsChecked="{Binding SelectedElement.RemoveBackground, Mode=TwoWay}"
+                                                  AutomationProperties.Name="Remove background"
+                                                  ToolTip="Remove the background behind you — the layers below show through"
+                                                  HorizontalAlignment="Left"/>
+                                </DockPanel>
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Blur" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="84"/>
+                                    <ToggleButton x:Name="BlurBackgroundPill" Style="{StaticResource PillToggle}"
+                                                  IsChecked="{Binding SelectedElement.BlurBackground, Mode=TwoWay}"
+                                                  AutomationProperties.Name="Blur background"
+                                                  ToolTip="Blur the background behind you"
+                                                  HorizontalAlignment="Left"/>
+                                </DockPanel>
+                                <DockPanel Margin="0,0,0,6"
+                                           Visibility="{Binding SelectedElement.HasBackgroundEffect, Converter={StaticResource BoolToVis}}">
+                                    <TextBlock DockPanel.Dock="Left" Text="Strength" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="84"/>
+                                    <TextBlock DockPanel.Dock="Right" Text="{Binding SelectedElement.BackgroundStrength, StringFormat={}{0:P0}}"
+                                               Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Margin="8,0,0,0" Width="34"/>
+                                    <Slider x:Name="BackgroundStrengthSlider" Minimum="0" Maximum="1"
+                                            Value="{Binding SelectedElement.BackgroundStrength, Mode=TwoWay}"
+                                            TickFrequency="0.05" IsSnapToTickEnabled="True" VerticalAlignment="Center"
+                                            AutomationProperties.Name="Background effect strength"
+                                            ToolTip="Blur: how strong the blur is · Remove: how soft the edge is"/>
+                                </DockPanel>
                            </StackPanel>

                            <!-- Countdown config -->
@@ -12,7 +12,7 @@ See [`schema.md`](../schema.md) for the memory-map conventions.
 | `TopBar.xaml(.cs)` | Row 0 session surface (2026-09-22 redesign): brand + gear menu (left), one segmented REC|ON-AIR mode switch + world actions (Record: Start Recording · Stream: Go Live + Test) + reality line while running (dot/word/elapsed) + End (center), account zone — Sign In or avatar w/ Change Account/Logout context menu (right). `RefreshAvatar()`, `GearButton_Click` |
 | `PreviewPane.xaml(.cs)` | Row 1 Col 1 center: the 1920×1080 `OverlayCanvas`/`SelectionOverlay`/`BrandFlashLayer`/`SocialBarElement`, text pull-out drawer, and the live-controls row (TRAX / game / mic meters + sliders + speakers + socials) |
 | `SceneThumbnailStrip.xaml(.cs)` | Row 0 scene-picker strip (`ItemsControl` over `Scenes`), staged-red / live-green border highlight |
-| `LeftPanel.xaml(.cs)` | Row 1 Col 0 left panel: edit mode → layers+properties; live → YouTube chat. Source add/edit/remove, list drag-to-reorder, snapshot revert-accept |
+| `LeftPanel.xaml(.cs)` | Row 1 Col 0 left panel: edit mode → layers+properties; live → YouTube chat. Source add/edit/remove, list drag-to-reorder, snapshot revert-accept. **TASK 51:** the webcam properties carry the Background section — `RemoveBackgroundPill` / `BlurBackgroundPill` (`PillToggle`, radio-exclusive via `WebcamSceneConfig.RemoveBackground`/`BlurBackground`) + `BackgroundStrengthSlider` (0..1, 5% snaps, shown only while an effect is on) |
 | `OverlayHost.xaml(.cs)` | Root-grid overlay dialogs: Settings / Report Bug / Feature Request / About (+ licenses + license-key entry). `BackToAbout_Click` lives here |
 | `SceneThumbnailStrip.xaml.cs` | Code-behind for the strip above |
 | `LeftPanel.xaml.cs` | Code-behind for the panel above |