`7e78855`

add display panel, toggle widget, and cursor changes

Authored by mfwolffe <wolffemf@dukes.jmu.edu> 3 months ago

SHA: 7e7885577d391886aca4784652aca52b73c86578
Parents: 980e94b
Tree: a13da29

6 changed files

Status	File	+	-
M	`gardisplay/src/app.rs`	128	20
A	`gardisplay/src/ui/display_panel.rs`	434	0
M	`gardisplay/src/ui/mod.rs`	3	1
M	`gardisplay/src/ui/monitor_view.rs`	52	1
M	`gardisplay/src/ui/widgets/mod.rs`	2	0
A	`gardisplay/src/ui/widgets/toggle.rs`	119	0

gardisplay/src/app.rsmodified

  use gartk_core::{Color, InputEvent, Key, Rect, Size, Theme};
  use gartk_render::{copy_surface_to_window, Renderer};
  use gartk_x11::{
 -    detect_monitors, primary_monitor, Connection, EventLoop, EventLoopConfig, Monitor, Window,
 -    WindowConfig,
 +    detect_monitors, primary_monitor, Connection, CursorManager, CursorShape, EventLoop,
 +    EventLoopConfig, Monitor, Window, WindowConfig,
  };
  use x11rb::protocol::xproto::ConnectionExt;
  use crate::config::{Config, MonitorConfig, Profile};
 -use crate::randr::RandrManager;
 -use crate::ui::{Button, Dropdown, DropdownAction, EventResult, MonitorView, TextInput};
 +use crate::randr::{OutputInfo, RandrManager};
 +use crate::ui::{
 +    Button, DisplayPanel, DisplayPanelResult, Dropdown, DropdownAction, EventResult, MonitorView,
 +    TextInput,
 +};
  /// Window dimensions.
  const WINDOW_WIDTH: u32 = 800;
  const WINDOW_HEIGHT: u32 = 600;
 +/// Footer height in pixels.
 +const FOOTER_HEIGHT: u32 = 100;
++
  /// Main application.
  pub struct App {
      #[allow(dead_code)] // Connection kept alive for X11 resources
      original_monitors: Vec<Monitor>,
      demo_mode: bool,
      status_message: Option<(String, std::time::Instant)>,
 +    // Display panel
 +    display_panel: DisplayPanel,
 +    randr_outputs: Vec<OutputInfo>,
 +    last_selected: Option<usize>,
 +    // Cursor management
 +    cursor_manager: CursorManager,
 +    current_cursor: CursorShape,
      // UI widgets
      current_profile: String,
      dropdown_profiles: Dropdown,
          let theme = Theme::dark();
          let renderer = Renderer::with_theme(WINDOW_WIDTH, WINDOW_HEIGHT, theme.clone())?;
 -        // Create monitor view
 -        let view_rect = Rect::new(0, 0, WINDOW_WIDTH, WINDOW_HEIGHT - 100); // Leave room for controls
 +        // Create cursor manager
 +        let cursor_manager = CursorManager::new(conn.clone())?;
++
 +        // Calculate layout: monitor view (2/3) + display panel (1/3) + footer
 +        let view_area = WINDOW_HEIGHT - FOOTER_HEIGHT;
 +        let panel_height = view_area / 3;
 +        let monitor_view_height = view_area - panel_height;
++
 +        // Create monitor view (top 2/3)
 +        let view_rect = Rect::new(0, 0, WINDOW_WIDTH, monitor_view_height);
          let mut monitor_view = MonitorView::new(view_rect);
 +        // Create display panel (bottom 1/3 of view area)
 +        let panel_rect = Rect::new(0, monitor_view_height as i32, WINDOW_WIDTH, panel_height);
 +        let display_panel = DisplayPanel::new(panel_rect);
++
          // Create RandR manager (only in non-demo mode)
 -        let randr = if demo {
 -            None
 +        let (randr, randr_outputs) = if demo {
 +            (None, Vec::new())
          } else {
              match RandrManager::new(conn.clone()) {
 -                Ok(r) => Some(r),
 +                Ok(r) => {
 +                    let outputs = r.get_outputs().unwrap_or_default();
 +                    (Some(r), outputs)
 +                }
                  Err(e) => {
                      tracing::warn!("failed to create RandR manager: {}", e);
 -                    None
 +                    (None, Vec::new())
+                 }
+             }
          };
+         }
          // Create UI widgets (positioned in controls area)
 -        let controls_y = (WINDOW_HEIGHT - 100) as i32;
 +        let controls_y = (WINDOW_HEIGHT - FOOTER_HEIGHT) as i32;
          // Buttons on the left
          let btn_apply = Button::new(10, controls_y + 60, 70, 32, "Apply");
              original_monitors,
              demo_mode: demo,
              status_message: None,
 +            display_panel,
 +            randr_outputs,
 +            last_selected: None,
 +            cursor_manager,
 +            current_cursor: CursorShape::Default,
              current_profile,
              dropdown_profiles,
              btn_apply,
          if self.btn_save_as.handle_event(event) {
              // Show save-as input (appears above the dropdown)
              let size = self.renderer.size();
 -            let controls_y = size.height.saturating_sub(100) as i32;
 +            let controls_y = size.height.saturating_sub(FOOTER_HEIGHT) as i32;
              let mut input = TextInput::new(size.width as i32 - 260, controls_y + 25, 150, 32);
              input.set_placeholder("Profile name");
              input.set_active(true);
              return EventResult::Redraw;
+         }
 +        // Handle display panel events
 +        match self.display_panel.handle_event(event) {
 +            DisplayPanelResult::ConfigChanged(config) => {
 +                if let Some(name) = self.display_panel.selected_output() {
 +                    self.monitor_view.update_monitor_config(
 +                        name,
 +                        config.width,
 +                        config.height,
 +                        config.refresh,
 +                        config.rotation,
 +                        config.scale,
 +                        config.enabled,
 +                    );
 +                }
 +                return EventResult::Redraw;
 +            }
 +            DisplayPanelResult::Redraw => return EventResult::Redraw,
 +            DisplayPanelResult::None => {}
 +        }
++
          match event {
              InputEvent::CloseRequested => EventResult::Quit,
              InputEvent::Key(e) if e.pressed && e.key == Key::Escape => EventResult::Quit,
                  EventResult::Redraw
+             }
              InputEvent::Expose => EventResult::Redraw,
 -            _ => self.monitor_view.handle_event(event),
 +            _ => {
 +                let result = self.monitor_view.handle_event(event);
 +                // Check if selection changed and sync with display panel
 +                let current_selected = self.monitor_view.selected();
 +                if current_selected != self.last_selected {
 +                    self.last_selected = current_selected;
 +                    self.sync_panel_selection();
 +                }
 +                // Update cursor based on hover/drag state
 +                self.update_cursor();
 +                result
 +            }
 +        }
 +    }
++
 +    /// Update the cursor based on monitor view state.
 +    fn update_cursor(&mut self) {
 +        let shape = self.monitor_view.cursor_shape();
 +        if shape != self.current_cursor {
 +            self.current_cursor = shape;
 +            if let Err(e) = self.cursor_manager.set_window_cursor(self.window.id(), shape) {
 +                tracing::debug!("failed to set cursor: {}", e);
 +            }
 +        }
 +    }
++
 +    /// Sync the display panel with the selected monitor.
 +    fn sync_panel_selection(&mut self) {
 +        if let Some(state) = self.monitor_view.selected_monitor() {
 +            // Find matching RandR output
 +            let output = self.randr_outputs.iter().find(|o| o.name == state.info.name);
++
 +            self.display_panel.set_selected_monitor(
 +                output,
 +                state.info.rect.width,
 +                state.info.rect.height,
 +                state.refresh,
 +                state.rotation,
 +                state.scale,
 +                state.enabled,
 +            );
 +        } else {
 +            self.display_panel
 +                .set_selected_monitor(None, 0, 0, 60.0, 0, 1.0, true);
+         }
+     }
              return;
+         }
 -        // Update monitor view rect
 -        let view_rect = Rect::new(0, 0, size.width, size.height.saturating_sub(100));
 +        // Calculate new layout
 +        let view_area = size.height.saturating_sub(FOOTER_HEIGHT);
 +        let panel_height = view_area / 3;
 +        let monitor_view_height = view_area - panel_height;
++
 +        // Update monitor view rect (top 2/3)
 +        let view_rect = Rect::new(0, 0, size.width, monitor_view_height);
          self.monitor_view.set_view_rect(view_rect);
 -        // Reposition widgets
 -        let controls_y = size.height.saturating_sub(100) as i32;
 +        // Update display panel rect (bottom 1/3 of view area)
 +        let panel_rect = Rect::new(0, monitor_view_height as i32, size.width, panel_height);
 +        self.display_panel.set_rect(panel_rect);
++
 +        // Reposition footer widgets
 +        let controls_y = size.height.saturating_sub(FOOTER_HEIGHT) as i32;
          // Buttons on the left
          self.btn_apply.set_position(10, controls_y + 60);
          // Render monitor view
          self.monitor_view.render(&mut self.renderer, &self.theme)?;
 -        // Render bottom controls area
 +        // Render display panel
 +        self.display_panel.render(&self.renderer, &self.theme)?;
++
 +        // Render bottom controls area (footer)
          let size = self.renderer.size();
 -        let controls_y = size.height.saturating_sub(100) as i32;
 -        let controls_rect = Rect::new(0, controls_y, size.width, 100);
 +        let controls_y = size.height.saturating_sub(FOOTER_HEIGHT) as i32;
 +        let controls_rect = Rect::new(0, controls_y, size.width, FOOTER_HEIGHT);
          self.renderer
              .fill_rect(controls_rect, self.theme.background)?;

gardisplay/src/ui/display_panel.rsadded

 +//! Display settings panel for selected monitor.
++
 +use std::collections::HashSet;
++
 +use gartk_core::{InputEvent, Rect, Theme};
 +use gartk_render::{Renderer, TextAlign, TextStyle};
++
 +use crate::randr::{ModeInfo, OutputInfo};
 +use crate::ui::widgets::{Dropdown, Toggle};
++
 +/// Configuration values from the display panel.
 +#[derive(Debug, Clone)]
 +pub struct DisplayPanelConfig {
 +    pub width: u32,
 +    pub height: u32,
 +    pub refresh: f64,
 +    pub rotation: u32,
 +    pub scale: f64,
 +    pub enabled: bool,
 +}
++
 +/// Result of handling a panel event.
 +#[derive(Debug)]
 +pub enum DisplayPanelResult {
 +    /// No action needed.
 +    None,
 +    /// Redraw the UI.
 +    Redraw,
 +    /// Configuration changed.
 +    ConfigChanged(DisplayPanelConfig),
 +}
++
 +/// Display settings panel for the selected monitor.
 +pub struct DisplayPanel {
 +    rect: Rect,
 +    // Widgets
 +    resolution_dropdown: Dropdown,
 +    refresh_dropdown: Dropdown,
 +    rotation_dropdown: Dropdown,
 +    scale_dropdown: Dropdown,
 +    enabled_toggle: Toggle,
 +    // State
 +    selected_output: Option<String>,
 +    available_modes: Vec<ModeInfo>,
 +    // Current values
 +    current_width: u32,
 +    current_height: u32,
 +    current_refresh: f64,
 +    current_rotation: u32,
 +    current_scale: f64,
 +    current_enabled: bool,
 +}
++
 +impl DisplayPanel {
 +    /// Create a new display panel.
 +    pub fn new(rect: Rect) -> Self {
 +        // Calculate widget positions based on panel rect
 +        let row1_y = rect.y + 40;
 +        let row2_y = rect.y + 80;
 +        let col1_x = rect.x + 100;
 +        let col2_x = rect.x + (rect.width as i32 / 2) + 80;
 +        let dropdown_width = 120;
 +        let dropdown_height = 28;
++
 +        let resolution_dropdown = Dropdown::new(col1_x, row1_y, dropdown_width, dropdown_height);
 +        let refresh_dropdown = Dropdown::new(col2_x, row1_y, 80, dropdown_height);
 +        let rotation_dropdown = Dropdown::new(col1_x, row2_y, 80, dropdown_height);
 +        let scale_dropdown = Dropdown::new(col2_x, row2_y, 80, dropdown_height);
 +        let enabled_toggle = Toggle::new(
 +            rect.x + rect.width as i32 - 150,
 +            rect.y + 8,
 +            140,
 +            28,
 +            "Enabled",
 +        );
++
 +        Self {
 +            rect,
 +            resolution_dropdown,
 +            refresh_dropdown,
 +            rotation_dropdown,
 +            scale_dropdown,
 +            enabled_toggle,
 +            selected_output: None,
 +            available_modes: Vec::new(),
 +            current_width: 0,
 +            current_height: 0,
 +            current_refresh: 60.0,
 +            current_rotation: 0,
 +            current_scale: 1.0,
 +            current_enabled: true,
 +        }
 +    }
++
 +    /// Update panel to show settings for the selected monitor.
 +    pub fn set_selected_monitor(
 +        &mut self,
 +        output: Option<&OutputInfo>,
 +        width: u32,
 +        height: u32,
 +        refresh: f64,
 +        rotation: u32,
 +        scale: f64,
 +        enabled: bool,
 +    ) {
 +        if let Some(output) = output {
 +            self.selected_output = Some(output.name.clone());
 +            self.available_modes = output.modes.clone();
++
 +            // Populate resolution dropdown with unique resolutions
 +            let resolutions: Vec<String> = output
 +                .modes
 +                .iter()
 +                .map(|m| format!("{}x{}", m.width, m.height))
 +                .collect::<HashSet<_>>()
 +                .into_iter()
 +                .collect();
 +            let mut sorted_resolutions: Vec<String> = resolutions;
 +            sorted_resolutions.sort_by(|a, b| {
 +                // Sort by resolution (width * height) descending
 +                let parse_res = |s: &str| -> u64 {
 +                    let parts: Vec<&str> = s.split('x').collect();
 +                    if parts.len() == 2 {
 +                        parts[0].parse::<u64>().unwrap_or(0)
 +                            * parts[1].parse::<u64>().unwrap_or(0)
 +                    } else {
 +                        0
 +                    }
 +                };
 +                parse_res(b).cmp(&parse_res(a))
 +            });
 +            self.resolution_dropdown.set_items(sorted_resolutions);
++
 +            // Set current resolution
 +            let current_res = format!("{}x{}", width, height);
 +            self.resolution_dropdown.set_selected_by_name(&current_res);
 +            self.current_width = width;
 +            self.current_height = height;
++
 +            // Populate refresh rates for current resolution
 +            self.update_refresh_dropdown(width, height);
++
 +            // Set current refresh
 +            let current_refresh_str = format!("{:.0}Hz", refresh);
 +            self.refresh_dropdown.set_selected_by_name(&current_refresh_str);
 +            self.current_refresh = refresh;
++
 +            // Rotation options
 +            self.rotation_dropdown
 +                .set_items(vec!["0".to_string(), "90".to_string(), "180".to_string(), "270".to_string()]);
 +            self.rotation_dropdown
 +                .set_selected_by_name(&rotation.to_string());
 +            self.current_rotation = rotation;
++
 +            // Scale options
 +            self.scale_dropdown.set_items(vec![
 +                "1x".to_string(),
 +                "1.25x".to_string(),
 +                "1.5x".to_string(),
 +                "1.75x".to_string(),
 +                "2x".to_string(),
 +            ]);
 +            let scale_str = format!("{}x", scale);
 +            self.scale_dropdown.set_selected_by_name(&scale_str);
 +            self.current_scale = scale;
++
 +            // Enable toggle
 +            self.enabled_toggle.set_value(enabled);
 +            self.current_enabled = enabled;
 +        } else {
 +            self.selected_output = None;
 +            self.available_modes.clear();
 +            self.resolution_dropdown.set_items(Vec::new());
 +            self.refresh_dropdown.set_items(Vec::new());
 +        }
 +    }
++
 +    /// Update refresh rate dropdown for the given resolution.
 +    fn update_refresh_dropdown(&mut self, width: u32, height: u32) {
 +        let refreshes: Vec<String> = self
 +            .available_modes
 +            .iter()
 +            .filter(|m| m.width as u32 == width && m.height as u32 == height)
 +            .map(|m| format!("{:.0}Hz", m.refresh))
 +            .collect::<HashSet<_>>()
 +            .into_iter()
 +            .collect();
 +        let mut sorted_refreshes: Vec<String> = refreshes;
 +        sorted_refreshes.sort_by(|a, b| {
 +            let parse_hz = |s: &str| -> f64 {
 +                s.trim_end_matches("Hz").parse::<f64>().unwrap_or(0.0)
 +            };
 +            parse_hz(b).partial_cmp(&parse_hz(a)).unwrap_or(std::cmp::Ordering::Equal)
 +        });
 +        self.refresh_dropdown.set_items(sorted_refreshes);
 +    }
++
 +    /// Get the current configuration.
 +    pub fn get_config(&self) -> Option<DisplayPanelConfig> {
 +        if self.selected_output.is_some() {
 +            Some(DisplayPanelConfig {
 +                width: self.current_width,
 +                height: self.current_height,
 +                refresh: self.current_refresh,
 +                rotation: self.current_rotation,
 +                scale: self.current_scale,
 +                enabled: self.current_enabled,
 +            })
 +        } else {
 +            None
 +        }
 +    }
++
 +    /// Get the selected output name.
 +    pub fn selected_output(&self) -> Option<&str> {
 +        self.selected_output.as_deref()
 +    }
++
 +    /// Set the panel rect.
 +    pub fn set_rect(&mut self, rect: Rect) {
 +        self.rect = rect;
++
 +        // Recalculate widget positions
 +        let row1_y = rect.y + 40;
 +        let row2_y = rect.y + 80;
 +        let col1_x = rect.x + 100;
 +        let col2_x = rect.x + (rect.width as i32 / 2) + 80;
++
 +        self.resolution_dropdown.set_position(col1_x, row1_y);
 +        self.refresh_dropdown.set_position(col2_x, row1_y);
 +        self.rotation_dropdown.set_position(col1_x, row2_y);
 +        self.scale_dropdown.set_position(col2_x, row2_y);
 +        self.enabled_toggle
 +            .set_position(rect.x + rect.width as i32 - 150, rect.y + 8);
 +    }
++
 +    /// Handle an input event.
 +    pub fn handle_event(&mut self, event: &InputEvent) -> DisplayPanelResult {
 +        // Only handle events if we have a selected output
 +        if self.selected_output.is_none() {
 +            return DisplayPanelResult::None;
 +        }
++
 +        let mut config_changed = false;
++
 +        // Handle enable toggle
 +        if self.enabled_toggle.handle_event(event) {
 +            self.current_enabled = self.enabled_toggle.value();
 +            config_changed = true;
 +        }
++
 +        // Handle resolution dropdown
 +        if let Some(action) = self.resolution_dropdown.handle_event(event) {
 +            if let crate::ui::widgets::DropdownAction::Select(_) = action {
 +                if let Some(res) = self.resolution_dropdown.selected_item() {
 +                    // Parse resolution
 +                    let parts: Vec<&str> = res.split('x').collect();
 +                    if parts.len() == 2 {
 +                        if let (Ok(w), Ok(h)) = (parts[0].parse::<u32>(), parts[1].parse::<u32>()) {
 +                            self.current_width = w;
 +                            self.current_height = h;
 +                            // Update refresh rates for new resolution
 +                            self.update_refresh_dropdown(w, h);
 +                            // Select first available refresh rate
 +                            if let Some(first_refresh) = self.refresh_dropdown.selected_item() {
 +                                let hz_str = first_refresh.trim_end_matches("Hz");
 +                                if let Ok(hz) = hz_str.parse::<f64>() {
 +                                    self.current_refresh = hz;
 +                                }
 +                            }
 +                            config_changed = true;
 +                        }
 +                    }
 +                }
 +            }
 +            return if config_changed {
 +                DisplayPanelResult::ConfigChanged(self.get_config().unwrap())
 +            } else {
 +                DisplayPanelResult::Redraw
 +            };
 +        }
++
 +        // Handle refresh dropdown
 +        if let Some(action) = self.refresh_dropdown.handle_event(event) {
 +            if let crate::ui::widgets::DropdownAction::Select(_) = action {
 +                if let Some(refresh) = self.refresh_dropdown.selected_item() {
 +                    let hz_str = refresh.trim_end_matches("Hz");
 +                    if let Ok(hz) = hz_str.parse::<f64>() {
 +                        self.current_refresh = hz;
 +                        config_changed = true;
 +                    }
 +                }
 +            }
 +            return if config_changed {
 +                DisplayPanelResult::ConfigChanged(self.get_config().unwrap())
 +            } else {
 +                DisplayPanelResult::Redraw
 +            };
 +        }
++
 +        // Handle rotation dropdown
 +        if let Some(action) = self.rotation_dropdown.handle_event(event) {
 +            if let crate::ui::widgets::DropdownAction::Select(_) = action {
 +                if let Some(rot) = self.rotation_dropdown.selected_item() {
 +                    if let Ok(r) = rot.parse::<u32>() {
 +                        self.current_rotation = r;
 +                        config_changed = true;
 +                    }
 +                }
 +            }
 +            return if config_changed {
 +                DisplayPanelResult::ConfigChanged(self.get_config().unwrap())
 +            } else {
 +                DisplayPanelResult::Redraw
 +            };
 +        }
++
 +        // Handle scale dropdown
 +        if let Some(action) = self.scale_dropdown.handle_event(event) {
 +            if let crate::ui::widgets::DropdownAction::Select(_) = action {
 +                if let Some(scale) = self.scale_dropdown.selected_item() {
 +                    let scale_str = scale.trim_end_matches('x');
 +                    if let Ok(s) = scale_str.parse::<f64>() {
 +                        self.current_scale = s;
 +                        config_changed = true;
 +                    }
 +                }
 +            }
 +            return if config_changed {
 +                DisplayPanelResult::ConfigChanged(self.get_config().unwrap())
 +            } else {
 +                DisplayPanelResult::Redraw
 +            };
 +        }
++
 +        // Check dropdown expand/collapse state changes
 +        if self.resolution_dropdown.is_expanded()
 +            || self.refresh_dropdown.is_expanded()
 +            || self.rotation_dropdown.is_expanded()
 +            || self.scale_dropdown.is_expanded()
 +        {
 +            return DisplayPanelResult::Redraw;
 +        }
++
 +        if config_changed {
 +            DisplayPanelResult::ConfigChanged(self.get_config().unwrap())
 +        } else {
 +            DisplayPanelResult::None
 +        }
 +    }
++
 +    /// Render the panel.
 +    pub fn render(&self, renderer: &Renderer, theme: &Theme) -> anyhow::Result<()> {
 +        // Panel background
 +        renderer.fill_rect(self.rect, theme.background)?;
++
 +        // Top border
 +        renderer.line(
 +            self.rect.x as f64,
 +            self.rect.y as f64,
 +            (self.rect.x + self.rect.width as i32) as f64,
 +            self.rect.y as f64,
 +            theme.border,
 +            1.0,
 +        )?;
++
 +        let label_style = TextStyle::new()
 +            .font_family(&theme.font_family)
 +            .font_size(theme.font_size)
 +            .color(theme.item_description)
 +            .align(TextAlign::Left);
++
 +        let title_style = TextStyle::new()
 +            .font_family(&theme.font_family)
 +            .font_size(theme.font_size + 2.0)
 +            .color(theme.foreground)
 +            .align(TextAlign::Left);
++
 +        if let Some(ref name) = self.selected_output {
 +            // Title: Monitor name
 +            let title_rect = Rect::new(self.rect.x + 10, self.rect.y + 8, 200, 28);
 +            renderer.text_in_rect(name, title_rect, &title_style)?;
++
 +            // Enable toggle
 +            self.enabled_toggle.render(renderer, theme)?;
++
 +            // Row 1: Resolution and Refresh
 +            let row1_y = self.rect.y + 45;
 +            renderer.text_in_rect(
 +                "Resolution:",
 +                Rect::new(self.rect.x + 10, row1_y, 90, 28),
 +                &label_style,
 +            )?;
 +            self.resolution_dropdown.render(renderer, theme)?;
++
 +            renderer.text_in_rect(
 +                "Refresh:",
 +                Rect::new(self.rect.x + (self.rect.width as i32 / 2) + 10, row1_y, 70, 28),
 +                &label_style,
 +            )?;
 +            self.refresh_dropdown.render(renderer, theme)?;
++
 +            // Row 2: Rotation and Scale
 +            let row2_y = self.rect.y + 85;
 +            renderer.text_in_rect(
 +                "Rotation:",
 +                Rect::new(self.rect.x + 10, row2_y, 90, 28),
 +                &label_style,
 +            )?;
 +            self.rotation_dropdown.render(renderer, theme)?;
++
 +            renderer.text_in_rect(
 +                "Scale:",
 +                Rect::new(self.rect.x + (self.rect.width as i32 / 2) + 10, row2_y, 70, 28),
 +                &label_style,
 +            )?;
 +            self.scale_dropdown.render(renderer, theme)?;
 +        } else {
 +            // No monitor selected
 +            let hint_style = TextStyle::new()
 +                .font_family(&theme.font_family)
 +                .font_size(theme.font_size)
 +                .color(theme.item_description)
 +                .align(TextAlign::Center);
 +            renderer.text_in_rect(
 +                "Select a monitor to configure",
 +                self.rect,
 +                &hint_style,
 +            )?;
 +        }
++
 +        Ok(())
 +    }
 +}

gardisplay/src/ui/mod.rsmodified

  //! UI components for gardisplay.
 +mod display_panel;
  mod monitor_view;
  pub mod widgets;
 +pub use display_panel::{DisplayPanel, DisplayPanelConfig, DisplayPanelResult};
  pub use monitor_view::MonitorView;
 -pub use widgets::{Button, Dropdown, DropdownAction, TextInput};
 +pub use widgets::{Button, Dropdown, DropdownAction, TextInput, Toggle};
  /// Result of handling an event.
  #[derive(Debug, Clone, Copy, PartialEq, Eq)]

gardisplay/src/ui/monitor_view.rsmodified

  use gartk_core::{Color, InputEvent, MouseButton, Point, Rect, Theme};
  use gartk_render::Renderer;
 -use gartk_x11::Monitor;
 +use gartk_x11::{CursorShape, Monitor};
  use std::time::Instant;
  use super::EventResult;
      pub scaled_rect: Rect,
      /// Real-world position (in actual pixels, updated after drag).
      pub real_position: Point,
 +    /// Whether the monitor is enabled.
 +    pub enabled: bool,
 +    /// Refresh rate in Hz.
 +    pub refresh: f64,
 +    /// Rotation in degrees (0, 90, 180, 270).
 +    pub rotation: u32,
 +    /// Scale factor.
 +    pub scale: f64,
+ }
  /// State for an active drag operation.
                      info,
                      scaled_rect,
                      real_position,
 +                    enabled: true,
 +                    refresh: 60.0, // Default, will be updated from RandR
 +                    rotation: 0,
 +                    scale: 1.0,
+                 }
              })
              .collect();
          self.selected
+     }
 +    /// Get the selected monitor state.
 +    pub fn selected_monitor(&self) -> Option<&MonitorState> {
 +        self.selected.and_then(|idx| self.monitors.get(idx))
 +    }
++
      /// Get monitors.
      #[allow(dead_code)] // Used in Sprint 3 for RandR application
      pub fn monitors(&self) -> &[MonitorState] {
          &self.monitors
+     }
 +    /// Update a monitor's configuration by name.
 +    pub fn update_monitor_config(
 +        &mut self,
 +        name: &str,
 +        width: u32,
 +        height: u32,
 +        refresh: f64,
 +        rotation: u32,
 +        scale: f64,
 +        enabled: bool,
 +    ) {
 +        if let Some(state) = self.monitors.iter_mut().find(|m| m.info.name == name) {
 +            state.info.rect.width = width;
 +            state.info.rect.height = height;
 +            state.refresh = refresh;
 +            state.rotation = rotation;
 +            state.scale = scale;
 +            state.enabled = enabled;
 +            self.dirty = true;
 +            self.recalculate_layout();
 +        }
 +    }
++
      /// Get mutable monitors.
      pub fn monitors_mut(&mut self) -> &mut [MonitorState] {
          &mut self.monitors
              );
+         }
+     }
++
 +    /// Get the cursor shape based on current state.
 +    pub fn cursor_shape(&self) -> CursorShape {
 +        if self.dragging.is_some() {
 +            CursorShape::Move // Grabbing - four-arrow move cursor
 +        } else if self.hovered.is_some() {
 +            CursorShape::Pointer // Grab - hand cursor
 +        } else {
 +            CursorShape::Default
 +        }
 +    }
+ }

gardisplay/src/ui/widgets/mod.rsmodified

  mod button;
  mod dropdown;
  mod text_input;
 +mod toggle;
  pub use button::Button;
  pub use dropdown::{Dropdown, DropdownAction};
  pub use text_input::TextInput;
 +pub use toggle::Toggle;

gardisplay/src/ui/widgets/toggle.rsadded

 +//! Toggle switch widget.
++
 +use gartk_core::{Color, InputEvent, MouseButton, Point, Rect, Theme};
 +use gartk_render::{Renderer, TextAlign, TextStyle};
++
 +/// A toggle switch (on/off).
 +pub struct Toggle {
 +    rect: Rect,
 +    label: String,
 +    value: bool,
 +    hovered: bool,
 +}
++
 +impl Toggle {
 +    /// Create a new toggle.
 +    pub fn new(x: i32, y: i32, width: u32, height: u32, label: &str) -> Self {
 +        Self {
 +            rect: Rect::new(x, y, width, height),
 +            label: label.to_string(),
 +            value: true,
 +            hovered: false,
 +        }
 +    }
++
 +    /// Set toggle position.
 +    pub fn set_position(&mut self, x: i32, y: i32) {
 +        self.rect.x = x;
 +        self.rect.y = y;
 +    }
++
 +    /// Get current value.
 +    pub fn value(&self) -> bool {
 +        self.value
 +    }
++
 +    /// Set toggle value.
 +    pub fn set_value(&mut self, value: bool) {
 +        self.value = value;
 +    }
++
 +    /// Check if a point is inside the toggle.
 +    fn contains(&self, point: Point) -> bool {
 +        self.rect.contains_point(point)
 +    }
++
 +    /// Handle input event. Returns true if toggled.
 +    pub fn handle_event(&mut self, event: &InputEvent) -> bool {
 +        match event {
 +            InputEvent::MouseMove(e) => {
 +                self.hovered = self.contains(e.position);
 +                false
 +            }
 +            InputEvent::MousePress(e) if e.button == Some(MouseButton::Left) => {
 +                if self.contains(e.position) {
 +                    self.value = !self.value;
 +                    return true;
 +                }
 +                false
 +            }
 +            _ => false,
 +        }
 +    }
++
 +    /// Render the toggle.
 +    pub fn render(&self, renderer: &Renderer, theme: &Theme) -> anyhow::Result<()> {
 +        // Layout: [Label] [==O] or [Label] [O==]
 +        let track_width = 40u32;
 +        let track_height = 20u32;
 +        let knob_radius = 8.0;
++
 +        // Label on the left
 +        let label_rect = Rect::new(
 +            self.rect.x,
 +            self.rect.y,
 +            self.rect.width.saturating_sub(track_width + 8),
 +            self.rect.height,
 +        );
 +        let style = TextStyle::new()
 +            .font_family(&theme.font_family)
 +            .font_size(theme.font_size)
 +            .color(theme.foreground)
 +            .align(TextAlign::Left);
 +        renderer.text_in_rect(&self.label, label_rect, &style)?;
++
 +        // Track on the right
 +        let track_x = self.rect.x + self.rect.width as i32 - track_width as i32;
 +        let track_y = self.rect.y + (self.rect.height as i32 - track_height as i32) / 2;
 +        let track_rect = Rect::new(track_x, track_y, track_width, track_height);
++
 +        // Track color based on value
 +        let track_color = if self.value {
 +            Color::new(0.2, 0.7, 0.4, 1.0) // Green when on
 +        } else {
 +            theme.item_background
 +        };
++
 +        renderer.fill_rounded_rect(track_rect, (track_height / 2) as f64, track_color)?;
++
 +        // Border
 +        let border_color = if self.hovered {
 +            theme.selection_background
 +        } else {
 +            theme.border
 +        };
 +        renderer.stroke_rounded_rect(track_rect, (track_height / 2) as f64, border_color, 1.0)?;
++
 +        // Knob
 +        let knob_x = if self.value {
 +            track_x as f64 + track_width as f64 - knob_radius - 4.0
 +        } else {
 +            track_x as f64 + knob_radius + 4.0
 +        };
 +        let knob_y = track_y as f64 + track_height as f64 / 2.0;
++
 +        renderer.fill_circle(knob_x, knob_y, knob_radius, theme.foreground)?;
++
 +        Ok(())
 +    }
 +}