A modern, production-ready, full-stack MovieBox streaming web application and adaptive playback engine ported from MovieBox-Tui.

Features • Tech Stack • Quick Start • Architecture • Deployment • Documentation • Disclaimer

---

📽️ Overview

MovieBox Web transforms the terminal-based capabilities of MovieBox-Tui into a commercial-grade, fully browser-based streaming platform. It features a complete reverse-engineered MovieBox cryptographic signature engine, adaptive HLS & MPEG-DASH video playback, multi-segment background downloading with resume support, 9 switchable theme palettes, live TV IPTV channels, community Stremio addons, real-time WebSocket progress reporting, and user & admin operations dashboards.

---

✨ Features

• 🎬 Multi-Provider Streaming Engine:
  • MovieBox: Full HMAC-MD5 request signing, canonical parameter sorting, token generation, CloudFront auth forwarding, and host rotation.
  • 4KHDHub: Scrapes movies and series releases, resolving HubCloud and fast PixelDrain mirrors.
  • Live TV / IPTV: Built-in parser for #EXTINF M3U playlists, categorized channels, and live streams.
  • Stremio Addons: Support for external Stremio HTTP addons (e.g. Cinemeta catalog, OpenSubtitles, community streams).
  • BDIX Peering: CircleFTP and DhakaFlix FTP peering discovery.
  • TMDB Integration: Open-source metadata integration providing rich posters, high-res backdrops, and cast information.
• ⚡ In-Browser Adaptive Player:
  • Auto-switching between HLS (HLS.js), MPEG-DASH (DASH.js), and progressive MP4.
  • Resume playback prompt ("Continue from mm:ss") with synced watch progress reporting.
  • Multi-language subtitle tracks, quality switching, audio selection, playback speed controls, picture-in-picture, and keyboard shortcuts.
• 📥 Background Download Engine:
  • Single-item and batch season downloads organized into downloads/Movies/ and downloads/Series/.
  • Multi-segment parallel downloading with Range requests and resume from .part files.
  • Real-time download progress, transfer speed, and ETA broadcast via Socket.io.
• 📊 Advanced Dashboards:
  • User Dashboard: Watch history statistics (hours watched, movies finished), Continue Watching carousel, and saved library items.
  • Admin Operations Center: Real-time provider health & latency pings, cache statistics & flush, download queue monitor, system logs, and user management.
• 🎨 9 Stock Color Themes:
  • Catppuccin Mocha, Catppuccin Latte, Catppuccin Macchiato, Catppuccin Frappé, Nord, Tokyo Night, Dracula, Gruvbox, and Rosé Pine.
• 🔐 Secure Authentication & Storage:
  • JWT authentication with secure HTTP-only cookies, password hashing with bcrypt, and SQLite / PostgreSQL Prisma ORM.

---

📸 Screenshots

Home Cinema Feed	Video Player (HLS/DASH)
(Hero banner, trending rails, category carousels)	(Adaptive bitrates, subtitles, episode drawer)

User Dashboard & Continue Watching	Live TV IPTV Mode
(Watch statistics, library items, progress cards)	(Categorized channels, electronic program guide)

---

🛠️ Tech Stack

Layer	Technology
Backend API	Node.js 20+, Express, TypeScript, Socket.io, Cheerio, Prisma ORM
Frontend Web	React 18, TypeScript, Vite, Tailwind CSS, TanStack Query, Zustand, Lucide Icons
Video Player	HTML5 Video, HLS.js, DASH.js, Custom Fullscreen / Theater controls
Database	SQLite (default for zero-config local / single-server) / PostgreSQL
Caching	In-Memory LRU Cache + optional Redis
Infrastructure	Multi-stage Docker, Docker Compose, GitHub Actions CI

---

🚀 Quick Start

Prerequisites

• Node.js 20.x or higher
• npm 10+ or pnpm

1. Clone & Install

git clone https://github.com/frnAlt/MovieBox-Web.git
cd MovieBox-Web

# Install all monorepo dependencies
npm install

2. Configure Environment

cp .env.example .env

(The default .env is pre-configured to work immediately with SQLite and local ports).

3. Initialize Database & Seed

# Push Prisma schema to SQLite database and seed default accounts & channels
npm run db:push
npm run db:seed

Default accounts seeded:

• Admin: admin@moviebox.local / adminpassword123
• Demo User: user@moviebox.local / moviebox123

4. Run Development Server

# Concurrently launches backend API (:4000) and Vite frontend (:5173)
npm run dev

Open http://localhost:5173 in your browser.

5. Build for Production

npm run build
npm run start

In production mode, the Express server on port 4000 serves both the REST API and the optimized web frontend.

---

🏗️ Architecture

MovieBox-Web/
├── apps/
│   ├── api/             # Express + Socket.io + Prisma Backend
│   │   ├── prisma/      # schema.prisma, SQLite dev.db, seeders
│   │   └── src/
│   │       ├── crypto/  # MovieBox HMAC-MD5 signature generator
│   │       ├── providers/# MovieBox, 4KHDHub, Stremio, LiveTV, BDIX, TMDB
│   │       ├── proxy/   # Range-enabled SSRF-safe streaming proxy
│   │       ├── routes/  # REST endpoints (/auth, /stream, /download, etc.)
│   │       ├── services/# DownloadManager, SocketServer, TmdbService
│   │       └── index.ts # Production server & static SPA server
│   └── web/             # React 18 + Vite + Tailwind CSS Frontend
│       └── src/
│           ├── components/ # Navbar, MediaRail, HeroBanner, Footer
│           ├── pages/      # Home, Movies, TV, Details, Watch, Downloads, Dashboard, Admin
│           ├── player/     # HLS.js & DASH.js Adaptive Player
│           └── stores/     # Zustand themeStore & authStore
├── server -> apps/api   # Direct monorepo alias
├── client -> apps/web   # Direct monorepo alias
├── packages/
│   └── shared/          # Shared TypeScript models, schemas, and 9 themes
├── docker/              # Multi-stage production Dockerfile
├── docs/                # In-depth technical guides & API references
└── assets/              # SVG logo and vector branding

---

🚢 Deployment

MovieBox Web includes first-class deployment configurations for all major cloud providers:

Platform	Configuration	Deployment Instructions
Docker / VPS	docker/Dockerfile, docker-compose.yml	docker compose up -d --build
Render	render.yaml	Connect repo → Create Blueprint (includes 10GB disk)
Railway	railway.json	Connect repo → Mount persistent volume at /app/data
Fly.io	fly.toml	fly launch → fly deploy
Vercel	vercel.json	Connect repo → Deploy apps/web with API rewrites

For complete step-by-step instructions, see the Deployment Guide.

---

📖 Documentation

• REST & WebSocket API Reference
• Provider Architecture & Reverse Engineering
• Multi-Segment Download Engine
• Deployment & Production Hosting
• Player Controls & Keyboard Shortcuts

---

🧪 Testing

Run the automated test suite covering crypto signatures, validation schemas, M3U IPTV parsers, stream resolvers, and download utilities:

npm run test

---

🤝 Contributing

Contributions, bug reports, and feature requests are warmly welcomed! Please read our Contributing Guidelines and Code of Conduct before submitting pull requests.

---

⚖️ Disclaimer

This software is developed for educational, interoperability, and research purposes. MovieBox Web does not host, store, index, or distribute media files of any kind. All metadata, streams, and media are resolved directly from third-party networks, user-provided playlists, and publicly accessible web APIs. Users are responsible for complying with the copyright laws and regulations of their jurisdiction.

---

📄 License

Dual-licensed under either of:

• Apache License, Version 2.0 (LICENSE-APACHE or http://www.apache.org/licenses/LICENSE-2.0)
• MIT License (LICENSE-MIT or http://opensource.org/licenses/MIT)

at your option.

---

🙏 Acknowledgements

• MovieBox-Tui by @mesamirh for the original Rust terminal implementation and provider architecture.
• MovieBox-Web by @frnAlt for the web streaming vision.
• Catppuccin for the Mocha, Latte, Macchiato, and Frappé color palettes.