Skip to content

appaKappaK/PanelMode

Repository files navigation

PanelMode logo

PanelMode

A Linux desktop app for building a clean multi-panel browser wall on the monitor you actually want.

Launch streams. Telemetry pages. Dashboards. Webcam feeds. One control console, one wall output, and no need to fullscreen your whole desktop just to watch one panel.


Overview

PanelMode is built for a practical multi-monitor workflow:

  • Keep the control console on your main display.
  • Target another monitor for a dedicated browser wall.
  • Deploy 2, 4, 6, 9, 12, or 16 panels to that display.
  • Load YouTube streams, dashboards, telemetry pages, and other browser feeds.
  • Focus a single panel without fullscreening your whole desktop.
  • Hide the console to tray while the wall keeps running.

This is not a generic media player. It is a Linux browser-wall app for mixed monitoring setups.

Screenshots

Loaded PanelMode control console with a four-panel layout
PanelMode layout preview overlay for a four-panel layout PanelMode wall window with a loaded four-panel layout

These screenshots are generated from the virtual-display smoke suite and exported into assets/examples/.

Highlights

  • Separate control console and wall window
  • Multi-monitor targeting with display identification overlays
  • Layout preview overlays before wall deployment
  • Click-to-rename feed titles right from each panel header
  • Per-panel Load, Refresh, Auto, and Focus controls
  • A cold-launch restore prompt so saved URLs can come back without hammering every feed at startup
  • Hide-all-chat support for supported YouTube feeds
  • Independent mute and fullscreen controls for the dashboard and deployed wall
  • A Linux audio-boost selector that can push PanelMode's own stream up to 200% when pactl is available
  • Audio activity meters so you can spot which feed is talking
  • A full-width source ribbon that mirrors the active layout
  • Saved wall layout, target display, feed URLs, and console window geometry
  • Native tray workflow that only appears when the console is actually hidden

Quick Start

PanelMode is currently tested with Node 20+ on Linux.

npm install
npm start

Validation

npm run lint
npm test
npm run smoke
npm run smoke:all
npm run probe:audio-boost
npm run examples

npm run verify runs lint, unit tests, and the basic Electron smoke. The richer screenshot suites stay manual so the repo can keep visual regression artifacts without slowing every quick check.

If you want to confirm that Linux stream boosting is really working, npm run probe:audio-boost launches a low-level audio probe, checks the live pactl sink-input volume, and writes artifacts under .output/audio-boost-probe/.

Linux AppImage

If you just want to run PanelMode on Linux, download the current AppImage from the GitHub Releases page:

Use the npm path only if you want to build the AppImage yourself from source.

npm install
npm run dist:appimage

Build it on a Linux machine. The artifact is written to release/ with a name like PanelMode-0.1.0-x86_64.AppImage. If your file manager does not mark it executable automatically:

chmod +x release/PanelMode-*.AppImage

GitHub Releases

GitHub will always attach source archives to a release automatically. The actual app download is the uploaded AppImage release asset, not the source .zip or .tar.gz.

For maintainers, pushing a version tag publishes that downloadable AppImage automatically:

git tag v0.1.0
git push origin v0.1.0

Pushing a v* tag triggers the Release workflow, which:

  • runs lint, unit tests, and the headless smoke test
  • builds the Linux AppImage
  • uploads the AppImage, latest-linux.yml, and SHA256SUMS.txt to the GitHub release page

The download page then lives at /releases.

Core Flow

  1. Launch the app with npm start.
  2. Pick the target display from Monitor.
  3. Click Identify if you want numbered monitor overlays first.
  4. Pick 2, 4, 6, 9, 12, or 16 panels.
  5. Click Preview to project the temporary grid overlay.
  6. Click Deploy Wall to open the dedicated wall window on that display.
  7. Paste a source URL into any panel and click Load.
  8. Use Auto if that panel should reload itself periodically.
  9. Double-click a panel, or click Focus, to expand it inside the app.
  10. Press Escape to restore the grid.

Control Surface

  • The console stays on your main monitor unless you move it manually.
  • Settings auto-save immediately.
  • Hide Console To Tray is opt-in.
  • Ask Before Restoring Sources keeps saved URLs visible on a fresh launch but waits for your approval before loading them.
  • Hide All YouTube Chats suppresses supported chat panes across the active layout.
  • Audio Boost can raise PanelMode's Linux audio stream up to 200% without touching the rest of the desktop mix.
  • Mute Dashboard and Mute Wall let you silence each surface independently.
  • Fullscreen can be toggled separately for the dashboard and the deployed wall.
  • The wall is its own window, separate from the console, and mirrors the current layout and feed state.
  • Empty panels keep Refresh, Auto, and Focus disabled until a source is loaded.
  • If you switch from a larger layout to a smaller one, extra panel URLs are preserved for later.

Notes

  • Regular YouTube links should work.
  • Some sites with DRM, unusual auth flows, or aggressive anti-embed behavior may still be unreliable.
  • Each panel uses an embedded browser view, so it behaves more like a mini browser than a simple iframe.
  • The current visual direction leans into a darker browser-wall interface with ongoing custom UI polish.
  • Preview Layout is a targeting aid. It does not change the live wall by itself.
  • The startup restore prompt only appears on a true relaunch after the app has fully exited, not while the console is just hidden to tray.
  • Generated smoke artifacts live under .output/, which is ignored by Git.
  • The audio-boost probe intentionally uses a very soft tone so it can validate the stream path without blasting a harsh test signal.
  • package.json stays private on purpose. This repo is set up for GitHub sharing and direct-release artifacts, not npm publishing.

Tooling

npm start               # Launch the control console
npm run dev             # Local dev alias
npm run lint            # ESLint
npm test                # Node unit tests
npm run smoke           # Electron boot smoke test
npm run smoke:screenshot   # Console screenshot artifact run
npm run smoke:fake-panels  # Screenshot run with synthetic loaded feeds
npm run smoke:layouts      # Console, wall, and preview captures for 2/4/6/9/12/16 layouts
npm run smoke:actions      # UI-driven action coverage for console, wall, and startup-restore flows
npm run smoke:all          # All screenshot suites
npm run probe:audio-boost  # Low-level Linux audio-boost verification against live pactl sink inputs
npm run probe:audio-boost:appimage  # Run the same audio-boost probe against the packaged AppImage
npm run examples           # Export stable README screenshots into assets/examples
npm run clean:output       # Remove generated artifacts
npm run check              # Lint + unit tests
npm run verify             # Lint + tests + smoke
npm run dist:appimage      # Build a Linux AppImage into release/

Repo Layout

  • index.html Console markup
  • styles.css Main visual system and console layout
  • wall.html Dedicated wall window markup
  • wall.css Wall-specific styling
  • src/main.js Electron main-process logic, window management, tray behavior, and overlays
  • src/renderer.js Control console behavior
  • src/wall.js Wall renderer behavior
  • scripts/smoke.js Screenshot and smoke harness entry point
  • scripts/audio-boost-probe.js Low-level Linux audio-boost probe that verifies live sink-input volume and writes diagnostics into .output/
  • assets/examples/ Stable README screenshots generated from the virtual-display smoke suite
  • docs/concepts/ Early concept renders and visual explorations kept out of the repo root
  • test/ Unit coverage for helpers, fixtures, output routing, tray logic, and app metadata

Releases

For a release pass, validate with npm run lint, npm test, npm run smoke, npm run smoke:all, npm run probe:audio-boost, npm run dist:appimage, and npm run probe:audio-boost:appimage. Run npm run examples too if the README screenshots changed.

Keep .output/, release/, and node_modules/ out of commits. When the build is ready, push a version tag like v0.1.0 and GitHub Actions will publish the AppImage to the Releases page automatically.

About

Functional Linux Electron app for multi-monitor browser walls, live feeds, dashboards, and focused panel viewing.

Topics

Resources

License

Stars

Watchers

Forks

Packages

 
 
 

Contributors