Skip to content

madireis/vidsrc-wrapper

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

12 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

🍿 CinePulse: The Future of Cinematic Discovery

React Tailwind CSS License: MIT

CinePulse isn't just another movie trackerβ€”it's a premium, high-performance streaming discovery engine. Designed with a sleek, dark-mode glassmorphic aesthetic, it brings a cinematic experience directly to your browser.


πŸ“½οΈ Visual Tour

Home Dashboard Deep Discovery
Home Detail
Immersive horizontal scrolling and dynamic hero sections. Comprehensive metadata and cast details.
Cinematic Player Viewer Analytics
Player Stats
Seamless streaming with integrated controls. Data-driven insights into your viewing habits.

✨ Why CinePulse?

  • πŸ’Ž Premium Design: A state-of-the-art UI utilizing glassmorphism, fluid micro-animations, and a curated dark-mode palette.
  • 🧠 Intelligent Pickers: Can't decide? Use Decision Mode (mood-based) or Quick Pick to find your next favorite movie in seconds.
  • πŸ“Š Personal Insights: A dedicated stats dashboard tracks your total watch time, favorite genres, and viewing frequency.
  • πŸ“± Mobile-First Native Feel: Experience smooth, 60fps transitions and gesture-friendly navigation on any device.
  • πŸ” Global Search: Lightning-fast search functionality powered by the TMDB ecosystem.

πŸ› οΈ Built With

  • Frontend: React 19, Vite, Tailwind CSS 4.0
  • Animations: motion/react (Framer Motion)
  • Icons: Lucide React
  • API: TMDB (The Movie Database)
  • Backend: Express (Vite Proxy Middleware)

πŸš€ Get Started in 60 Seconds

1. Clone & Install

git clone https://github.com/madireis/cinepulse.git
cd cinepulse
npm install

2. Configure API

Create a .env file and add your TMDB API Key:

TMDB_API_KEY=your_api_key_here

3. Launch

npm run dev

Navigate to http://localhost:3000 and start your journey.


⚠️ Disclaimer

This project is for educational purposes only. CinePulse is a frontend demonstration of modern web engineering.

  • No Content Hosting: This application does not host or distribute copyrighted material.
  • Metadata: All content info is provided via the TMDB API.
  • Legal Compliance: Users are responsible for ensuring their usage aligns with local streaming laws.

πŸ—ΊοΈ Roadmap

CinePulse is actively evolving. Here's what's shipped and what's coming next.

βœ… Shipped

Feature
βœ… Premium dark-mode UI with glassmorphism & micro-animations
βœ… TMDB integration β€” trending, popular, top-rated, upcoming
βœ… Full Movie & TV Show detail pages with trailers
βœ… Streaming player via embedded backend provider
βœ… TV episode picker β€” season/episode navigation
βœ… Decision Mode β€” mood-based movie picker
βœ… Quick Pick β€” instant random suggestion
βœ… Watchlist β€” save movies & shows locally
βœ… Watch history tracking
βœ… Personal Analytics dashboard β€” genre heatmap, watch time, streaks
βœ… Global search β€” movies, TV shows, and actors
βœ… Actor pages β€” full filmography with movie/TV filter
βœ… Cast cards linked to actor profiles across all pages
βœ… Dynamic episode headers β€” title & doc tab update on episode change
βœ… Hard-reload episode switching to bypass provider cache
βœ… SEO meta tags, keywords, and dynamic document titles
βœ… Mobile-first responsive layout with slide-out nav
βœ… Removed auth/sign-in β€” fully open, no account needed

πŸ”œ Coming Soon

Feature Priority
πŸ”² Multi-provider support β€” fallback between VidSrc, VidSrc2, SuperEmbed, 2Embed πŸ”₯ High
πŸ”² Provider selector UI β€” let user pick their preferred source πŸ”₯ High
πŸ”² Continue Watching row on home dashboard πŸ”₯ High
πŸ”² Trailer auto-play in hero section on hover ⚑ Medium
πŸ”² Advanced filters β€” runtime, year range, quality, language ⚑ Medium
πŸ”² Collections & franchises β€” view full MCU, Star Wars etc. ⚑ Medium
πŸ”² Keyboard shortcuts β€” space to pause, arrow keys for episodes ⚑ Medium
πŸ”² Director & crew pages (similar to actor pages) ⚑ Medium
πŸ”² Progressive Web App (PWA) β€” install on mobile 🧊 Low
πŸ”² Dark/light theme toggle 🧊 Low
πŸ”² Export watch history as CSV 🧊 Low

πŸ“ License

Licensed under the MIT License.

Built with ❀️ for the cinematic community.

About

🍿 CinePulse | Next-gen cinematic discovery platform. Built with React 19, Tailwind CSS 4, and Framer Motion. Features intelligent mood-based discovery, real-time TMDB integration, and deep viewing analytics.

Topics

Resources

Stars

Watchers

Forks

Packages

 
 
 

Contributors