Skip to content

Wookiee-/tagflix

Repository files navigation

TagFlix Logo

TagFlix

⚠️ Under Active Development — This project is a work in progress. Expect breaking changes, incomplete features, and bugs.

An open-source, community-driven media aggregator with a Netflix/Stremio-style interface. Built with Tauri v2 + React + Vite, featuring an embedded libmpv player with a fully wired control HUD.

Heavily inspired by Stremio — TagFlix reimagines the streaming experience with a native desktop player, but is not a fork and does not use any Stremio code.

License: GPL v3

Features

  • Netflix-style UI — Hero billboard, horizontal carousels, detail pages with episode carousels and cast rows
  • Embedded libmpv player — In-process hardware-accelerated video via tauri-plugin-libmpv with transparent window overlay
  • Stremio-inspired playback HUD — Two-tier controls: timeline row + button row with:
    • Play/Pause, Volume (hover-reveal slider), Mute
    • Subtitle track selection (live track-list detection, drop-up menu)
    • Playback speed selection (drop-up menu: 0.5x → 2.0x)
    • Audio track selection (live track-list detection, drop-up menu)
    • Aspect ratio selection (drop-up menu: Auto, 16:9, 4:3, Stretch Fill)
    • Native Tauri fullscreen toggle
    • More options (HW acceleration, Clear cache)
    • Auto-fade controls overlay after 3s of inactivity
    • Toast notifications for all actions
  • Torrentio integration — Streams via Stremio addon with TorBox & Real-Debrid support
  • GPU hardware decoding — HW accelerated via libmpv (gpu-next vo, auto-safe hwdec)
  • Debrid support — TorBox, Real-Debrid
  • Customizable — 12 accent colors, 6 theme skins, persisted via localStorage
  • TV remote navigation — D-pad keyboard navigation with focus rings
  • Favourites — Save media locally with localStorage persistence

Architecture

┌───────────────────────────────────────────────┐
│               Tauri v2 Desktop App             │
│  ┌─────────────────────────────────────────┐  │
│  │   React SPA (Vite) — WebView overlay    │  │
│  │   Port 5173 (dev) / dist/ (production)  │  │
│  │                                          │  │
│  │   ┌─── StremioPlayer (React HUD) ───┐   │  │
│  │   │  Timeline + Button controls     │   │  │
│  │   │  Subtitles · Speed · Audio · AR  │   │  │
│  │   │  Fullscreen · More · Toast · Auto-fade│   │  │
│  │   └──────────────────────────────────┘   │  │
│  └─────────────────────────────────────────┘  │
│                         │ transparent overlay  │
│  ┌─────────────────────────────────────────┐  │
│  │   libmpv (embedded in HWND)             │  │
│  │   gpu-next · auto-safe hwdec            │  │
│  │   H.264/H.265/HEVC/VP9/EAC3/AC3/DTS   │  │
│  └─────────────────────────────────────────┘  │
│                         ▲                      │
│              tauri-plugin-libmpv-api            │
└───────────────────────────────────────────────┘
  • Frontend SPA (src/) — Vite-powered React application with Tailwind CSS. No embedded <video> tag — playback happens via libmpv rendering behind a transparent WebView.
  • Native playertauri-plugin-libmpv initializes mpv in-process, embedded in the Tauri window HWND. The WebView background is transparent, so libmpv renders underneath while the React HUD overlays on top.
  • Property observation — Individual per-property Tauri event listeners (listenEvents) for time-pos, duration, pause, mute, volume, speed, track-list, and idle-active. Each listener is individually cleaned up on unmount to prevent memory leaks during HMR.
  • Auto-fade controls — The HUD overlay automatically hides after 3 seconds of inactivity (mousemove/keydown), and locks visible when menus are open or video is paused.
  • Mutual-exclusion menus — Subtitle, Speed, Audio, Aspect, and More menus are mutually exclusive: opening one closes any others.

Tech Stack

Layer Technology
Desktop shell Tauri v2 (WebView2, transparent window)
UI framework React 18 + Vite 5
Styling Tailwind CSS
Video engine libmpv (embedded via tauri-plugin-libmpv)
Player HUD Custom StremioPlayer React component (drop-up menus, auto-fade overlay)
Media metadata TVmaze API, OMDb API, Trakt API
Streaming Torrentio (Stremio addon)
Debrid TorBox API, Real-Debrid API

Getting Started

Prerequisites

  • Node.js 18+
  • Rust (latest stable)
  • mpv — required at build time for libmpv DLLs
  • npm

Install

git clone https://github.com/Wookiee-/tagflix.git
cd tagflix
npm install

Setup libmpv libraries

npx tauri-plugin-libmpv-api setup-lib

Development

npm run tauri dev

This starts both the Vite dev server and the Tauri desktop app with hot-reload.

Build for Production

npm run tauri build

Output will be in src-tauri/target/release/.

Configuration

API Keys

Copy .env.example to .env and fill in your API keys:

cp .env.example .env

Edit .env with your API keys:

VITE_OMDB_API_KEY=your_omdb_api_key
VITE_TRAKT_CLIENT_ID=your_trakt_client_id

Torrentio Addon

Configure your Torrentio URL in Settings > Addons. URL format:

https://torrentio.strem.fun/{providers}/{options}|torbox={api_key}/manifest.json

Debrid Services

Configure your preferred debrid service in Settings. Supported providers:

Provider Cache Check Unrestrict
TorBox Yes Yes
Real-Debrid Yes Yes

Project Structure

tagflix/
  src-tauri/                Tauri v2 Rust backend + libmpv integration
    src/
      lib.rs                Main library with IPC commands
      main.rs               Entry point
      debrid.rs             Debrid service integrations (TorBox, RD)
      scraper.rs            Web scraper for free streams
      trakt.rs              Trakt API integration
      stremio.rs            Stremio addon stream resolution
      mpv_ipc.rs            MPV IPC helpers
    capabilities/
      default.json          Tauri permissions (window, libmpv, fullscreen)
    binaries/               Downloaded libmpv DLLs
  src/                      React SPA frontend
    components/
      StremioPlayer.jsx     Full embedded player HUD (drop-up menus, auto-fade overlay, subtitles, speed, audio, aspect, fullscreen, more)
      MediaCard.jsx         Media card with hover effects
      MediaGrid.jsx         Grid layout for media items
      SourceModal.jsx       Stream source picker modal
      Navbar.jsx            Top navigation bar
      Sidebar.jsx           Side navigation
      SettingsModal.jsx     Settings modal
      ErrorBoundary.jsx     React error boundary
    hooks/
      useTagflix.js         Main app state hook
      useTVNavigation.jsx   D-pad navigation for TV remotes
    pages/
      Home.jsx              Main landing page
      Detail.jsx            Media detail page
      Player.jsx            Route wrapper for StremioPlayer
      Movies.jsx            Movies browse page
      TVShows.jsx           TV shows browse page
      Search.jsx            Search results page
      Favourites.jsx        Saved favourites
      Settings.jsx          App settings
    services/
      api.js                Tauri IPC bridge + libmpv player API
      stremioProvider.js    Torrentio addon stream resolution
      tvmazeApi.js          TVmaze API client
    utils/
      imageResolver.js      Image URL resolution
  public/                   Static assets

Keyboard Shortcuts

Key Action
Space / K Play/Pause
Arrow Left Skip back 10 seconds
Arrow Right Skip forward 10 seconds
Arrow Up Volume up
Arrow Down Volume down
M Toggle mute
F Toggle fullscreen

License

This project is licensed under the GNU General Public License v3.0.

About

Netflix/Stremio-style desktop media aggregator with a native libmpv player built with Tauri + React

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages