A modern web interface for the DE1 espresso machine via Streamline-Bridge.
The home screen shows real-time machine data and quick-access operation buttons.
- Status bar with connection status, clock, mix/group/steam temperatures, water level, and Scan button when no device is connected
- Operation buttons (Espresso, Steam, Hot Water, Flush) with two-step confirmation to prevent accidental starts
- Shot plan showing the active profile, dose, yield, ratio, and grinder setting
- Recipes for one-tap switching between saved brewing configurations (profile + coffee + grinder + steam/hot water settings)
- Last shot widget with mini graph, metrics, and Repeat button to reload the shot's workflow
Create and manage complete brewing recipes — profile, beans, grinder, dose, and operation settings — laid out for landscape tablets: a recipe rail on the left, a four-quadrant editor (Coffee, Grinder, Dose + Profile, Operations) on the right.
- Set profile, coffee, grinder, dose in/out, and ratio
- Steam, flush, and hot water each toggle on/off from the operations list and open in a focused popup for editing
- Recipes live in a vertical rail — tap to select, tap the pencil (or double-tap) to rename, + New to create one from the current state
- Field edits apply live to the running workflow (300 ms debounce); saved recipes only change when you explicitly tap Save or Save as New Recipe
- A small dot on the selected recipe marks any divergence between the live workflow and the saved recipe
- From the home screen: tap a recipe to load it, double-tap to open the editor — the Espresso button is the only way to start a shot
- Optional power-user fields — Settings → Brewing toggles "Show grinder RPM" and "Show basket data" surface RPM and basket size/type fields in the recipe editor and the shot review page. Per-grinder RPM range (Settings → Grinders) clamps the RPM input.
Browse, search, and manage espresso profiles.
- Search and filter profiles by name or author
- Visual profile graph showing pressure, flow, and temperature curves
- View step-by-step breakdown of each profile frame
- Apply profiles to the current workflow with a single tap
- Simple Profile Editor for classic 4-step pressure/flow profiles -- perfect for beginners
- Profile Editor with named phases (fill, bloom, rise, pour, hold, decline) for intermediate users
- Advanced Editor with full frame-by-frame control for power users
- Edit button automatically routes to the correct editor based on profile type
Review past shots with detailed metrics.
- Paginated list of all shots with profile, dose, duration, and rating
- Search across profile names, coffee, roaster, and grinder
- Load button restores the shot's full workflow (profile, coffee, grinder, dose)
- Edit button to edit shot notes and rating
- Compare up to 3 shots side-by-side with overlaid graphs
- Import shots from Visualizer
Rearrange the home screen to show what matters to you.
- Enter edit mode from Settings > Layout > "Edit Layout"
- Six configurable zones (top, center, bottom -- left and right)
- Drag to reorder, add, or remove widgets from each zone
- Changes apply in real time -- edit directly on the live home screen
- Available widgets: action buttons, shot plan, recipes, last shot, navigation, scale info, fullscreen toggle
- Device: Scan and connect to DE1 machines and scales
- Preferences: Water level units (mm/ml), post-shot linger, accessibility
- Layout: Launch the visual layout editor or reset to defaults
- Visualizer: Import shots from Decent Visualizer
- History: Shot history management
- Gateway: Configure Streamline-Bridge connection
- Screensaver: Choose between flip clock, last shot recap, ambient glow, or disabled
- Themes: Color scheme selection
- Beans: Manage your coffee bean library
- Grinders: Manage grinder profiles
- Phase Timeline showing real-time extraction progress (Preheat, Pre-infusion, Pouring, Ending) with profile tracking color feedback (green/amber/red)
- Cup Fill Visualization -- animated cup graphic tracking yield weight vs target during brewing
- Real-time shot graphs with pressure, flow, temperature, and weight curves
- Post-shot review with shot graph, notes, rating, TDS/EY
- Phase Summary Panel -- collapsible per-phase metrics table showing duration, avg pressure, avg flow, and weight gained per extraction phase
Analyzes your shot history to surface your best-performing bean, profile, and grinder combinations.
How it works: The page fetches all your shots, groups them by the criteria you choose, computes average metrics per group, and sorts by rating. This lets you quickly see which setups produce your best espresso and reload them with one tap.
- Group by: Bean, Profile, Bean + Profile, or Bean + Profile + Grinder
- Metrics per group: average rating, average dose, average yield, average duration, shot count
- Load: applies the group's profile, coffee, and grinder settings to your current workflow
- Show Shots: navigates to shot history filtered to that combination
- Accessible from the Shot History page via the "Favorites" link in the bottom bar
- Descaling wizard for guided machine maintenance
- Screensaver with four modes — Flip Clock, Last Shot recap (dial-in cheat sheet with grinder setting, dose, ratio, and relative age), Ambient Glow, or Disabled. Water-low warning overlays on all non-disabled modes.
- Ready-in estimate — when the machine is warming up, the status bar shows a "ready in mm:ss" chip sourced from the Streamline-Bridge
time-to-readyplugin - Power & sleep schedule management with keep-awake timers
- Keyboard shortcuts matching de1app — E/S/W/F for operations, GHC number keys (0=sleep, 1=flush, 2=espresso, 3=steam, 4=hot water), P for sleep, I/Space/Escape to stop, H/R/T for navigation, any key wakes screensaver
- Responsive design — mobile-ready layouts across all pages (single-column on phones, split panels on tablets+)
- Accessibility: WCAG AAA targets, comprehensive ARIA labels, keyboard navigation, 44px+ touch targets
Passione is a skin for Streamline-Bridge. You need Streamline-Bridge running on your DE1 tablet or local network.
- Open Streamline-Bridge settings on your tablet
- Go to Skins settings
- Install from URL using the latest release ZIP:
https://github.com/tadelv/passione/releases/latest/download/passione.zip
Or via the REST API:
curl -X POST http://<tablet-ip>:8080/api/v1/webui/skins/install/github-release \
-H "Content-Type: application/json" \
-d '{"repo": "tadelv/passione", "asset": "passione.zip"}'Every push to main triggers a GitHub Actions workflow that builds the project and pushes the output to the dist branch. This build installs as a separate skin (passione-dist) alongside the release skin so they don't overwrite each other:
curl -X POST http://<tablet-ip>:8080/api/v1/webui/skins/install/github-branch \
-H "Content-Type: application/json" \
-d '{"repo": "tadelv/passione", "branch": "dist"}'After installing, set Passione as the default skin:
curl -X PUT http://<tablet-ip>:8080/api/v1/webui/skins/default \
-H "Content-Type: application/json" \
-d '{"skinId": "passione"}'Then open http://<tablet-ip>:3000 in a browser.
- Node.js 20+
- A Streamline-Bridge instance (or use the mock server for testing)
npm installnpm run devThe dev server proxies API and WebSocket requests to Streamline-Bridge. Configure the gateway address in .env.local:
VITE_GATEWAY_URL=http://<tablet-ip>:8080
VITE_WS_URL=ws://<tablet-ip>:8080
npm run build # Output in dist/ (release skin: id=passione)
npm run preview # Preview the production build locallyTo build a dev skin that installs alongside the release (same as CI):
VITE_SKIN_ID=passione-dist VITE_APP_VERSION=0.9.3-dev.local npm run buildnpm run test:e2e # Playwright end-to-end tests (against mock server)- Vue 3 with Composition API and
<script setup> - Vite for build and dev server
- vue-router with hash-based routing
- vue-i18n for internationalization
- uPlot for real-time shot graphs
- Playwright for end-to-end testing
Contributions welcome — see CONTRIBUTING.md for setup, conventions, and the PR workflow.
GPL-3.0-or-later — see LICENSE.