Skip to content

feat(ui): Root Intelligence — modern UX/UI overhaul for CUPS WebAdmin - #1783

Closed
targino-tech wants to merge 2 commits into
OpenPrinting:masterfrom
targino-tech:feat/root-intelligence-ui
Closed

targino-tech wants to merge 2 commits into
OpenPrinting:masterfrom
targino-tech:feat/root-intelligence-ui

Conversation

@targino-tech

Copy link
Copy Markdown

Summary

This pull request introduces Root Intelligence, a progressive enhancement UX/UI overhaul for the CUPS Web Administration interface (templates/ and doc/).

The goal of this initiative is to provide a modern, accessible, and intuitive interface for both beginners and seasoned system administrators while preserving 100% compatibility with the existing CUPS daemon, CGI architecture, and IPP protocol.

Status: Draft / RFC. Feedback and discussion from OpenPrinting maintainers and contributors are warmly welcome!


Key Highlights

1. Modern Design System (doc/cups.css)

  • Dark Glassmorphism Theme: Uses CSS custom variables (--ri-*) with high-contrast text and subtle accents.
  • Fully Responsive: Layout adapts cleanly from mobile screens (360px) to ultra-wide monitors (1440px+).
  • Status Indicators: Animated pulse badges for printer states (Idle, Processing, Stopped).
  • Accessibility: Accessible focus rings, semantic tags, and full support for prefers-reduced-motion.

2. Lightweight Interactive Layer (doc/cups.js — New)

  • Zero External Dependencies: Built with pure vanilla JavaScript (ES2017). Completely offline and secure for air-gapped Linux environments.
  • Progressive Enhancement: If JavaScript is disabled, the entire administration interface remains 100% functional with upgraded CSS styling.
  • Command Palette (Ctrl+K / ⌘K): Fast launcher to jump to any printer, queue, admin action, or copy shell commands (such as lpstat -p -d, cupsenable, cancel -a).
  • User Mode Switch:
    • Beginner Mode: Hides clutter, displays friendly onboarding guides and contextual hints.
    • Advanced Mode: Surfaces real-time telemetry, terminal commands, and deep diagnostic actions.
  • Guided Onboarding & Tour: Walkthrough modal helping new users understand CUPS queues, test pages, and daemon management.

3. Template Modernization (templates/ & templates/pt_BR/)

  • Upgraded home.tmpl, printers.tmpl, printer.tmpl, jobs.tmpl, admin.tmpl, classes.tmpl, and error pages.
  • Maintained exact CUPS templating syntax ({variable}, {#array...}, {?cond}).
  • Preserved all org.cups.sid CSRF tokens, OP parameter routing, and form actions.
  • Full parity between default English templates and Portuguese (pt_BR) localization.

4. Developer Tooling & Documentation

  • Updated doc/Makefile to include cups.js in installation targets.
  • Added CHANGELOG.md and CONTRIBUTING.md documenting architecture, conventions, and design tokens.
  • Added offline preview tooling in tools/ for rapid UI testing without running a live daemon.

Backward Compatibility & Safety

  • No C backend changes: No daemon (cupsd), scheduler, IPP, or filter binaries were touched.
  • No external network calls: No CDNs, third-party fonts, or tracking libraries.
  • Graceful degradation: Functions properly with JavaScript disabled.
  • Translations preserved: Template variables and localized string conventions respected.

Feedback & Collaboration

We would love to hear feedback from the OpenPrinting community regarding:

  • Integration into future CUPS releases.
  • Additional language templates / localization guidelines.
  • Any accessibility or performance considerations for headless server environments.

Targino added 2 commits October 20, 2026 21:56
[REVIEW REQUEST] This commit implements a comprehensive UX/UI redesign of the
OpenPrinting CUPS web administration interface, codename 'Root Intelligence'.
The goal is to modernize the look and feel for Linux beginners and enthusiasts
while preserving 100% of the original backend contracts, CGI routing, template
variable syntax, and CSRF tokens.

## What changed

### Design System (doc/cups.css)
- Dark glassmorphism theme: backdrop-filter blur(14px), semi-transparent panels
- Cohesive color palette: deep navy (#0d1117) + sage green (#a8c686) accents
- Smooth CSS transitions (0.3s ease) on all interactive elements
- Subtle glow borders and hover states throughout
- Full mobile/tablet responsive layout (360px to 1440px+)
- CSS custom properties for easy theming

### JavaScript Layer (doc/cups.js — NEW FILE)
- Zero external dependencies; runs fully offline (air-gapped environments)
- User Mode Toggle (Beginner vs Advanced) persisted via localStorage
- Onboarding Checklist with animated progress bar for first-time users
- Interactive 3-step Guided Tour modal explaining CUPS architecture
- Raycast/Spotlight-style Command Palette (Ctrl+K):
  - Real-time fuzzy filter across quick actions, print queues, terminal commands
  - Keyboard navigation (up/down, Enter, Esc)
  - Copy-to-clipboard for lpstat, cupsenable, cancel -a commands

### Templates (templates/ + templates/pt_BR/)
- header.tmpl: Command Palette trigger button + Mode Switch toggle
- home.tmpl: Onboarding banner + Advanced telemetry bar
- All other templates: dark-mode cards, animated status badges,
  accessible focus rings, semantic HTML improvements

### Tooling (tools/)
- cups_preview_server.py: local Python preview server simulating CUPS routing
- cups_template.py: template engine helper for offline preview
- capture_step*.py: automated screenshot scripts for visual regression

## What was NOT changed
- CGI backend logic (scheduler, ppd, ipp handlers)
- Template variable interpolation syntax ({variable}, {?condition})
- Form OP routing and org.cups.sid CSRF tokens
- Build system core — only doc/Makefile updated to include cups.js

## Tested
Locale coverage: en (templates/) and pt_BR (templates/pt_BR/)
Viewports: Desktop 1440x900, Tablet 768x1024, Mobile 360x800
Tools: Python preview server (tools/cups_preview_server.py)

Reviewers: please evaluate whether this modernization is suitable for
upstream consideration or as a reference implementation for community forks.
Documents the complete UX/UI overhaul conventions, color palette tokens,
template rules, JS architecture, CSS section boundaries, and PR workflow.
@michaelrsweet

Copy link
Copy Markdown
Member

Sorry, but we really aren't looking to make more major changes to the CUPS web interface for 2.5, and 3.0 and later are based on PAPPL which has a completely different architecture.

@michaelrsweet michaelrsweet self-assigned this Oct 21, 2026
@michaelrsweet michaelrsweet added the wontfix This will not be worked on label Oct 21, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

wontfix This will not be worked on

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants