📁 Anique Host Panel

A modern admin dashboard for the Anique Anime Streaming Platform.

This project allows administrators to create playlists, upload videos to Firebase Storage, manage streaming content, edit video titles, delete videos, and control age-restricted content from a single dashboard.

---

📑 Table of Contents

• Features
• Screenshots
• Live Demo
• Technologies
• Project Structure
• How It Works
• Installation
• Firebase Setup
• Future Improvements
• Contributing
• License
• Author

---

✨ Features

✅ Create Unlimited Playlists

✅ Upload MP4 & WebM Videos

✅ Firebase Storage Integration

✅ Firestore Database

✅ Edit Video Titles

✅ Delete Videos

✅ Playlist Management

✅ Adult Content Support (18+)

✅ Responsive Design

✅ Beautiful Modern UI

✅ Secure Firebase Storage

✅ Dynamic Content Management

---

📸 Screenshots

🏠 Dashboard

---

📂 Create Playlist

---

📤 Upload Video

---

🎞 Playlist Manager

---

🚀 Live Demo

https://hostpanel.vercel.app/

https://dhruvpandit46.github.io/Anime-Streaming-Admin-Panel

---

⚙ Technologies Used

• HTML5
• CSS3
• JavaScript (ES6)
• Firebase
• Firebase Firestore
• Firebase Storage
• Google Fonts

---

📂 Project Structure

hostpanel/
│
├── index.html
├── host.css
├── host.js
├── images/
└── README.md

---

🔥 How It Works

1️⃣ Create Playlist

Create a new playlist which is automatically stored inside Firebase Firestore.

---

2️⃣ Upload Videos

Upload MP4 or WebM videos directly to Firebase Storage.

---

3️⃣ Save Metadata

Video title, download URL, storage path, and restriction status are stored inside Firestore.

---

4️⃣ Playlist Manager

All playlists are loaded dynamically and displayed inside the dashboard.

---

5️⃣ Edit Video

Video titles can be updated without uploading the video again.

---

6️⃣ Delete Video

Deleting a video removes

• Firebase Storage File

• Firestore Metadata

keeping the database clean.

---

7️⃣ Adult Content

Administrators can mark uploaded videos as

🔞 Adult Content (18+)

which will automatically be protected inside the streaming website.

---

📦 Installation

Clone the repository

git clone https://github.com/dhruvpandit46/hostpanel.git

Go inside project

cd hostpanel

Open

index.html

or use

VS Code Live Server

---

🔧 Firebase Setup

Replace Firebase Configuration inside

host.js

Enable

• Firestore Database

• Firebase Storage

Create collection

playlists

Each document should follow

{
  "videos": [
    {
      "title":"Episode 1",
      "url":"Download URL",
      "path":"videos/video.mp4",
      "restricted":false
    }
  ]
}

---

🔒 Security Features

• Secure Firebase Storage
• CRUD Operations
• Storage File Cleanup
• Firestore Integration
• Adult Content Flag
• Dynamic Playlist Loading

---

🎯 Future Improvements

• Admin Authentication
• Drag & Drop Upload
• Upload Progress Bar
• Thumbnail Generator
• Video Compression
• Bulk Upload
• Analytics Dashboard
• User Management
• Category Management
• Scheduled Publishing
• Video Statistics
• Cloud Functions
• Multi Admin Support

---

🤝 Contributing

Contributions are welcome.

1. Fork the repository

2. Create a new branch

3. Commit your changes

4. Push your branch

5. Open a Pull Request

---

📜 License

Licensed under the MIT License.

MIT © 2025 Dhruv Pandit.

See the LICENSE file for full license details.

---

👨‍💻 Author

Dhruv Pandit

GitHub

https://github.com/dhruvpandit46

LinkedIn

https://linkedin.com/in/dhruv-pandit-755786326

Instagram

https://instagram.com/dhruv_pandit2007

---

⭐ Support

If you found this project useful,

please consider giving it a ⭐ on GitHub.

It helps support future development.