klubhaus/sideline
2
0
Fork 0
forked from genewildish/Mainline
Code Issues 5 Pull Requests Projects 1 Releases Wiki Activity

Epic: User-Friendly Preset Editor GUI #52

New Issue
Open
opened 2026-03-21 22:39:06 +00:00 by david · 0 comments
david commented 2026-03-21 22:39:06 +00:00
Owner
Copy Link

Summary

Create a comprehensive, user-friendly GUI editor for Mainline presets that enables visual editing of pipeline configurations, effects, and parameters.

Problem Statement

The current preset system uses TOML files that require manual editing. A visual GUI editor would:

  1. Improve accessibility for non-technical users
  2. Enable real-time preview of preset changes
  3. Simplify complex configurations through visual interfaces
  4. Reduce errors through validation and visual feedback

Proposed Architecture

Display Options

  1. Native Desktop App (Pygame)

    • Uses existing PygameDisplay backend
    • Full window management and native controls
    • Local file system access for preset management

  2. Web-Based Editor (WebSocket)

    • Uses existing WebSocketDisplay backend
    • Browser-based UI (React/Vue/Svelte)
    • Remote control of Mainline instance

Core Features

  1. Pipeline Visualization

    • DAG visualization of pipeline stages
    • Drag-and-drop stage reordering
    • Visual dependency highlighting

  2. Preset Management

    • Load/save TOML presets
    • Create new presets from templates
    • Preset validation and error checking

  3. Effect Configuration

    • Visual parameter controls (sliders, color pickers)
    • Real-time preview of effect changes
    • Preset parameter binding (sensor integration)

  4. Stage Management

    • Add/remove/enable/disable stages
    • Configure stage parameters
    • Visual pipeline execution order

Implementation Phases

Phase 1: Foundation (Spike)

  • SPIKE: Evaluate GUI frameworks (Dear PyGui, PyQt, web-based)
  • SPIKE: Design UI/UX wireframes
  • SPIKE: Prototype basic preset loading/saving

Phase 2: Core Editor

  • Implement preset list and selection
  • Implement stage list with enable/disable toggles
  • Implement parameter controls (sliders, inputs)
  • Integrate with pipeline mutation API

Phase 3: Advanced Features

  • Pipeline DAG visualization
  • Drag-and-drop stage reordering
  • Real-time preview with live updates
  • Preset validation and error reporting

Phase 4: Polish & Documentation

  • Keyboard shortcuts and accessibility
  • User documentation and tutorials
  • Export/import preset functionality

Technical Considerations

Backend Requirements

  • Pipeline Mutation API: Already implemented (issue #35)
  • Display Backend: Pygame for desktop, WebSocket for web
  • UI Components: Extend existing UI panel or create new editor-specific UI

Data Flow

  1. User edits preset in GUI
  2. GUI validates changes
  3. GUI sends mutation commands to pipeline
  4. Pipeline updates in real-time
  5. GUI reflects pipeline state

File Format

  • Input: presets.toml (existing TOML format)
  • Output: presets.toml (serialized back to TOML)

Related Issues

  • Dependent on: Pipeline Mutation API (closed #35)
  • Related to: ModernGL display backend (#42), Message Overlay (#50), Displays and Keybindings (#51)
  • Skills: mainline-presets, mainline-architecture, mainline-display

Success Criteria

  1. Users can load, edit, and save presets without editing TOML files
  2. Real-time preview shows visual changes as parameters are adjusted
  3. Validation prevents invalid pipeline configurations
  4. Presets can be shared and imported easily
## Summary Create a comprehensive, user-friendly GUI editor for Mainline presets that enables visual editing of pipeline configurations, effects, and parameters. ## Problem Statement The current preset system uses TOML files that require manual editing. A visual GUI editor would: 1. **Improve accessibility** for non-technical users 2. **Enable real-time preview** of preset changes 3. **Simplify complex configurations** through visual interfaces 4. **Reduce errors** through validation and visual feedback ## Proposed Architecture ### Display Options 1. **Native Desktop App** (Pygame) - Uses existing PygameDisplay backend - Full window management and native controls - Local file system access for preset management 2. **Web-Based Editor** (WebSocket) - Uses existing WebSocketDisplay backend - Browser-based UI (React/Vue/Svelte) - Remote control of Mainline instance ### Core Features 1. **Pipeline Visualization** - DAG visualization of pipeline stages - Drag-and-drop stage reordering - Visual dependency highlighting 2. **Preset Management** - Load/save TOML presets - Create new presets from templates - Preset validation and error checking 3. **Effect Configuration** - Visual parameter controls (sliders, color pickers) - Real-time preview of effect changes - Preset parameter binding (sensor integration) 4. **Stage Management** - Add/remove/enable/disable stages - Configure stage parameters - Visual pipeline execution order ## Implementation Phases ### Phase 1: Foundation (Spike) - [ ] **SPIKE**: Evaluate GUI frameworks (Dear PyGui, PyQt, web-based) - [ ] **SPIKE**: Design UI/UX wireframes - [ ] **SPIKE**: Prototype basic preset loading/saving ### Phase 2: Core Editor - [ ] Implement preset list and selection - [ ] Implement stage list with enable/disable toggles - [ ] Implement parameter controls (sliders, inputs) - [ ] Integrate with pipeline mutation API ### Phase 3: Advanced Features - [ ] Pipeline DAG visualization - [ ] Drag-and-drop stage reordering - [ ] Real-time preview with live updates - [ ] Preset validation and error reporting ### Phase 4: Polish & Documentation - [ ] Keyboard shortcuts and accessibility - [ ] User documentation and tutorials - [ ] Export/import preset functionality ## Technical Considerations ### Backend Requirements - **Pipeline Mutation API**: Already implemented (issue #35) - **Display Backend**: Pygame for desktop, WebSocket for web - **UI Components**: Extend existing UI panel or create new editor-specific UI ### Data Flow 1. User edits preset in GUI 2. GUI validates changes 3. GUI sends mutation commands to pipeline 4. Pipeline updates in real-time 5. GUI reflects pipeline state ### File Format - Input: presets.toml (existing TOML format) - Output: presets.toml (serialized back to TOML) ## Related Issues - **Dependent on**: Pipeline Mutation API (closed #35) - **Related to**: ModernGL display backend (#42), Message Overlay (#50), Displays and Keybindings (#51) - **Skills**: mainline-presets, mainline-architecture, mainline-display ## Success Criteria 1. Users can load, edit, and save presets without editing TOML files 2. Real-time preview shows visual changes as parameters are adjusted 3. Validation prevents invalid pipeline configurations 4. Presets can be shared and imported easily
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
epic:#2
epic:#20
epic:#3
epic:#4
epic:#5
epic:#6
epic:Data Source
epic:Display Backend
epic:Display Tools
epic:Effects
epic:Pipeline Architecture
epic:Sensors
status:feature-complete
status:in-progress
status:released
status:tested
type:epic
type:epic
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
david genewildish
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: klubhaus/sideline#52
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?