xiboplayerxiboplayer
EN

PWA Player

The PWA (Progressive Web App) is the rendering engine that powers all xiboplayer platforms. It can also run standalone in any modern browser.

Features

  • Runs anywhere — Chrome, Firefox, Edge, or any Chromium-based browser
  • Offline-first — Service Worker caches all media for offline playback
  • All widget types — video (MP4, HLS), images, PDF, text/tickers, web pages, clock, calendar
  • Interactive actions — touch/click triggers, keyboard navigation, layout jumps
  • Proof of play — per-layout and per-widget duration tracking
  • Zero install — just open a URL

Deployment

The PWA must be served from the same origin as the CMS (same-origin policy for API calls). Two options:

Option A: Deploy to CMS container

# Build from source
git clone https://github.com/xibo-players/xiboplayer.git
cd xiboplayer && pnpm install
pnpm --filter @xiboplayer/pwa build

# Copy to CMS web root
podman cp packages/pwa/dist/. xibo-cms-web:/var/www/cms/web/chromeos/

Access at: https://your-cms.example.com/player/

Option B: Via Ansible

ansible-playbook playbooks/services/deploy-pwa.yml -e target_host=h1.example.com

Option C: Electron / Chromium wrapper

The Electron and Chromium players serve the PWA via a built-in Express proxy, avoiding the same-origin constraint. This is the recommended approach for kiosk deployments.

Keyboard shortcuts

KeyAction
DToggle download overlay (shows download progress)
TToggle timeline overlay (shows schedule)
SToggle setup overlay (CMS configuration)

How it works with Electron / Chromium

Player wrapper
  └── Express proxy (localhost:8765)
        ├── /player/         → serves PWA dist files
        ├── /xmds-proxy     → forwards SOAP to CMS
        ├── /api/*           → forwards REST to CMS
        └── /store/*         → ContentStore filesystem
              ↓
        PWA loads from localhost
        Service Worker caches everything
        Offline playback from local store

Limitations (standalone browser mode)

  • Same-origin required — must be hosted on CMS domain
  • No kiosk mode — browser controls remain visible
  • No GPU detection — uses browser defaults
  • No system integration — no auto-start, no power management
  • Storage limits — browser storage quotas apply (typically 50% of disk)

For production kiosk deployments, use the Electron or Chromium wrapper instead.

Source