Skip to content

bozkurtemre/epson-l220-cups-frontend

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

3 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

EPSON Printer Panel

A modern, touch-friendly web-based control panel for EPSON printers with Go backend integration for CUPS printing and SANE scanning. Optimized for small mobile devices and kiosk mode operation.

EPSON Theme Mobile Ready Go Backend

Printer Panel

Features

  • πŸ–¨οΈ Print - Upload and print documents via CUPS
  • πŸ“  Scan - Scan documents using SANE integration
  • πŸ“‹ Copy - Quick copy functionality
  • πŸ“Š Print Queue - Real-time job monitoring with SSE (Server-Sent Events)
  • 🎨 EPSON-themed UI - Professional dark theme with EPSON brand colors
  • πŸ“± Mobile-first design - Touch-friendly interface optimized for small screens (Galaxy A3 2015 and similar)
  • πŸ“΄ Smart Demo Mode - Automatic fallback with background reconnection
  • πŸ”„ Auto-reconnect - Seamlessly returns to live mode when API becomes available

Project Structure

printer-panel/
β”œβ”€β”€ index.html          # EPSON-themed touch panel UI
β”œβ”€β”€ style.css           # Responsive design, optimized for small screens
β”œβ”€β”€ app.js              # Frontend logic, API integration, Demo mode
β”œβ”€β”€ Makefile            # Build commands
β”œβ”€β”€ README.md           # This file
└── api/
    β”œβ”€β”€ go.mod          # Go module definition
    β”œβ”€β”€ print_service.go # Go backend for CUPS/SANE
    └── printer-service  # Compiled binary

Backend API Endpoints

The Go backend (api/print_service.go) provides the following REST API:

Method Endpoint Description
GET /printers Get printer status
GET /jobs Get all jobs (completed + active with correct state)
POST /jobs/cancel?id=<job-id> Cancel a print job
GET /jobs/stream SSE stream for real-time job updates
POST /print Print a file
POST /scan Scan a document
POST /copy Copy a document

Quick Start

1. Build and Run the Backend

cd api
go build -o printer-service print_service.go
./printer-service

Or using Make:

make build
make run

The backend will start on port 8081 by default.

2. Serve the Frontend

Using Python:

python -m http.server 8080

Using Node.js:

npx serve -p 8080

3. Access the Panel

Open in browser: http://localhost:8080

Key Features Explained

Demo Mode with Background Reconnection

The panel includes intelligent connectivity handling:

  1. Automatic Demo Mode - When the API is unreachable, the panel automatically switches to Demo Mode with simulated data
  2. Background Reconnection - While in Demo Mode, the panel attempts to reconnect to the API every 10 seconds
  3. Automatic Live Mode Recovery - When the API becomes available again, the panel seamlessly switches back to Live Mode

This ensures the UI remains functional and responsive even during network issues or backend restarts.

Print Queue Filtering

The Print Queue displays only active jobs (pending, processing, held). Completed jobs are automatically filtered out to keep the queue clean and focused on actionable items.

Job states are correctly determined:

  • queued - Job is waiting to be processed
  • processing - Job is currently printing
  • held - Job is on hold
  • completed - Job finished (filtered from active queue view)
  • canceled - Job was canceled
  • error - Job encountered an error

Responsive Design

The UI is optimized for small mobile devices including:

  • Galaxy A3 2015 (540x960, 245 PPI)
  • iPhone SE (320px width)
  • Android small (360px width)
  • And other compact screens

Features include:

  • Touch-friendly button sizes (minimum 44x44px)
  • Optimized font sizes and spacing
  • Safe area support for notched devices
  • Disabled pinch-zoom and double-tap zoom for kiosk use

Configuration

Edit app.js to configure the API endpoint:

const API_BASE = 'http://localhost:8081';

Keyboard Shortcuts

Shortcut Action
Ctrl+D Toggle Demo Mode
Ctrl+J Add Demo Job (Demo Mode only)

Requirements

Backend

  • Go 1.19+
  • CUPS (for printing)
  • SANE (for scanning)

Frontend

  • Modern web browser with JavaScript enabled
  • No build tools required (uses Tailwind CDN)

Installation on Raspberry Pi

Install CUPS and SANE

sudo apt update
sudo apt install cups sane-utils libsane
sudo usermod -a -G lpadmin $USER
sudo systemctl enable cups
sudo systemctl start cups

Install EPSON Driver

sudo apt install printer-driver-escpr

Auto-Start Kiosk Mode

Add to /etc/xdg/lxsession/LXDE-pi/autostart:

@xset s off
@xset -dpms
@xset s noblank
@chromium --kiosk --app=http://localhost:8080

Troubleshooting

Panel shows "Demo Mode"

  1. Check backend is running: curl http://localhost:8081/printers
  2. Verify CUPS is running: systemctl status cups
  3. Check network connectivity
  4. Wait for background reconnection (every 10 seconds)

Print jobs not appearing

  1. Check CUPS queue: lpstat -o
  2. Verify printer name in backend configuration
  3. Check SSE connection in browser developer tools

Scan not working

  1. Verify SANE is installed: scanimage -L
  2. Check scanner permissions
  3. Ensure user is in scanner group

License

MIT License - Free for personal and commercial use.

Credits

  • UI Design: EPSON-inspired dark theme
  • Icons: Tailwind CSS Heroicons
  • Font: Inter (Google Fonts)
  • Backend: Go with CUPS/SANE integration