1233 lines
No EOL
70 KiB
HTML
1233 lines
No EOL
70 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
||
<title>Debrid Services Comparison - Compare Pricing & Hosts</title>
|
||
<meta name="description"
|
||
content="Compare pricing and supported hosts across AllDebrid, Real-Debrid, LinkSnappy, Premiumize, Debrid-Link, TorBox, Mega-Debrid & Deepbrid.">
|
||
<meta name="robots" content="index, follow">
|
||
<meta name="author" content="Fynks">
|
||
<meta name="google-site-verification" content="nlH9UKmiZsYOuMXXnRc9pKL-AW5rECWikqcUqzri-yQ">
|
||
<link rel="canonical" href="https://debridcompare.pages.dev/">
|
||
|
||
<!-- Theme color per scheme -->
|
||
<meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)">
|
||
<meta name="theme-color" content="#0f172a" media="(prefers-color-scheme: dark)">
|
||
|
||
<!-- Favicons -->
|
||
<link rel="apple-touch-icon" href="/images/apple-touch-icon.png">
|
||
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
||
<link rel="icon" href="/favicon.ico" sizes="any">
|
||
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32.png">
|
||
<link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16x16.png">
|
||
<link rel="manifest" href="/site.webmanifest">
|
||
|
||
<!-- Fonts -->
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link rel="preload" as="style"
|
||
href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap"
|
||
onload="this.rel='stylesheet'">
|
||
<noscript>
|
||
<link rel="stylesheet"
|
||
href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap">
|
||
</noscript>
|
||
|
||
<!-- Prefetch data for quick subsequent use (non-blocking) -->
|
||
<link rel="prefetch" as="fetch" href="/json/file-hosts-optimized.json" crossorigin>
|
||
<link rel="prefetch" as="fetch" href="/json/adult-hosts-optimized.json" crossorigin>
|
||
<link rel="prefetch" as="fetch" href="/json/pricing.json" crossorigin>
|
||
<link as="style" rel="preload" href="/css/styles-min.css">
|
||
|
||
<script>
|
||
(function () {
|
||
try {
|
||
const saved = localStorage.getItem('theme');
|
||
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||
const theme = saved || (prefersDark ? 'dark' : 'light');
|
||
document.documentElement.setAttribute('data-theme', theme);
|
||
document.documentElement.style.colorScheme = theme;
|
||
} catch (e) { }
|
||
})();
|
||
</script>
|
||
|
||
<!-- Open Graph -->
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:url" content="https://debridcompare.pages.dev/">
|
||
<meta property="og:title" content="Debrid Services Comparison">
|
||
<meta property="og:description"
|
||
content="Compare pricing and supported hosts across major debrid services. Find the best premium download service for your needs.">
|
||
<meta property="og:image" content="https://debridcompare.pages.dev/image.png">
|
||
<meta property="og:site_name" content="Debrid Services Comparison">
|
||
<meta property="og:locale" content="en_US">
|
||
|
||
<!-- Twitter -->
|
||
<meta name="twitter:card" content="summary_large_image">
|
||
<meta name="twitter:url" content="https://debridcompare.pages.dev/">
|
||
<meta name="twitter:title" content="Debrid Services Comparison">
|
||
<meta name="twitter:description"
|
||
content="Compare pricing and supported hosts across major debrid services. Find the best premium download service for your needs.">
|
||
<meta name="twitter:image" content="https://debridcompare.pages.dev/image.png">
|
||
|
||
|
||
<link rel="stylesheet" href="./css/styles.css">
|
||
|
||
<script src="js/app.js" defer></script>
|
||
|
||
<!-- Google Console Verification -->
|
||
<meta name="google-site-verification" content="yh6OZ9qZhOAVRs3tkFAwwBYIb3BKrveBy6C0QEVHpw0" />
|
||
|
||
</head>
|
||
|
||
<body>
|
||
<a class="skip-link" href="#main-content">Skip to main content</a>
|
||
<div class="page-wrapper">
|
||
<header class="site-header">
|
||
<div class="container">
|
||
<div class="header-content">
|
||
<a href="/" class="site-title">
|
||
<svg class="logo-icon" role="img" aria-label="Debrid Comparison Logo">
|
||
<use href="#icon-logo" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
Debrid Compare
|
||
</a>
|
||
<nav id="primary-navigation" class="header-nav" aria-label="Main navigation" aria-hidden="true"
|
||
role="navigation">
|
||
<a href="#what-are-debrid" class="nav-link">Intro</a>
|
||
<a href="#pricing" class="nav-link">Pricing</a>
|
||
<a href="#file-hosts" class="nav-link">Hosts</a>
|
||
<a href="#compare" class="nav-link">Compare</a>
|
||
<a href="#adult-hosts" class="nav-link">Adult Hosts</a>
|
||
<a href="#speed-test" class="nav-link">Speed Test</a>
|
||
<a href="#live-status" class="nav-link">Status</a>
|
||
<a href="#resources" class="nav-link">Resources</a>
|
||
</nav>
|
||
<div class="header-actions">
|
||
<button id="darkModeToggle" class="dark-mode-toggle" aria-label="Toggle dark mode"
|
||
type="button">
|
||
<svg class="sun-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-sun" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<svg class="moon-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-moon" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
</button>
|
||
<button class="nav-toggle" id="navToggle" aria-label="Open navigation menu"
|
||
aria-controls="primary-navigation" aria-expanded="false" type="button">
|
||
<span class="nav-toggle-bar"></span>
|
||
<span class="nav-toggle-bar"></span>
|
||
<span class="nav-toggle-bar"></span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
<div class="nav-overlay" id="navOverlay" hidden></div>
|
||
|
||
<main id="main-content" class="main-content" role="main">
|
||
<!-- Hero Section -->
|
||
<section class="hero-section" aria-labelledby="hero-title">
|
||
<div class="container">
|
||
<div class="hero-content">
|
||
<h1 id="hero-title" class="hero-title">
|
||
Compare Premium <span class="gradient-text">Debrid Services</span>
|
||
</h1>
|
||
<p class="hero-description">
|
||
A community-driven, up-to-date comparison of premium debrid services: pricing, host support,
|
||
refund policies, and performance.
|
||
</p>
|
||
<div class="hero-actions">
|
||
<a href="#pricing" class="btn btn-primary">View Pricing</a>
|
||
<a href="#compare" class="btn btn-secondary">Compare Services</a>
|
||
</div>
|
||
<div class="hero-stats" aria-label="Key stats">
|
||
<div class="stat-item">
|
||
<span class="stat-number">8</span>
|
||
<span class="stat-label">Services</span>
|
||
</div>
|
||
<div class="stat-item">
|
||
<span class="stat-number">300+</span>
|
||
<span class="stat-label">File Hosts</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- What are Debrid Services -->
|
||
<section id="what-are-debrid" class="section" aria-labelledby="what-title">
|
||
<div class="container">
|
||
<div class="content-container">
|
||
<div class="section-header">
|
||
<h2 id="what-title" class="section-title">What are Debrid Services?</h2>
|
||
<p class="section-description">
|
||
Debrid services (a.k.a. premium link generators) act as a high‑speed intermediary: they
|
||
fetch the file from a host, then serve you a fast, ad‑free direct link.
|
||
</p>
|
||
<div class="meta-chips" aria-label="Key traits">
|
||
<span class="chip">Premium link generator</span>
|
||
<span class="chip">Ad‑free</span>
|
||
<span class="chip">Multi‑host</span>
|
||
<span class="chip">Torrent‑to‑link</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="features-grid">
|
||
<article class="benefit-card" role="article">
|
||
<svg class="icon-badge" role="img" aria-hidden="true">
|
||
<use href="#icon-logo" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<h3>Maximum Speeds</h3>
|
||
<p>Bypass host throttling with direct links</p>
|
||
</article>
|
||
<article class="benefit-card" role="article">
|
||
<svg class="icon-badge" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||
stroke-width="2">
|
||
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" />
|
||
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" />
|
||
</svg>
|
||
<h3>Multi‑Host Access</h3>
|
||
<p>One subscription supports hundreds of hosts</p>
|
||
</article>
|
||
<article class="benefit-card" role="article">
|
||
<svg class="icon-badge" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||
stroke-width="2">
|
||
<path
|
||
d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z" />
|
||
<polyline points="7.5,4.21 12,6.81 16.5,4.21" />
|
||
<polyline points="7.5,19.79 7.5,14.6 3,12" />
|
||
<polyline points="21,12 16.5,14.6 16.5,19.79" />
|
||
</svg>
|
||
<h3>Torrent‑to‑Link</h3>
|
||
<p>Add magnet/torrent and get a direct URL</p>
|
||
</article>
|
||
<article class="benefit-card" role="article">
|
||
<svg class="icon-badge" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||
stroke-width="2">
|
||
<rect width="18" height="11" x="3" y="11" rx="2" ry="2" />
|
||
<path d="M7 11V7a5 5 0 0 1 10 0v4" />
|
||
</svg>
|
||
<h3>Ad‑Free</h3>
|
||
<p>No popups, countdowns, or captchas</p>
|
||
</article>
|
||
</div>
|
||
|
||
<div class="alert alert-info" role="alert">
|
||
<svg class="alert-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-alert" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div>Think of a debrid service as a "premium proxy" between you and hosts like Rapidgator,
|
||
Mega, or Uptobox.</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Pricing Section -->
|
||
<section id="pricing" class="section" aria-labelledby="pricing-title">
|
||
<div class="container">
|
||
<div class="content-container">
|
||
<div class="section-header">
|
||
<h2 id="pricing-title" class="section-title">Pricing Comparison</h2>
|
||
<p class="section-description">Compare subscription plans across all major debrid services
|
||
</p>
|
||
</div>
|
||
|
||
<div class="pricing-container">
|
||
<div id="pricing-table-container" class="data-table-container" role="region"
|
||
aria-live="polite" aria-label="Pricing table">
|
||
<div class="loading-state" aria-busy="true">
|
||
<div class="loading-spinner" aria-hidden="true"></div>
|
||
<p>Loading pricing data...</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="alert alert-info" role="alert">
|
||
<svg class="alert-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-alert" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div><strong>Important:</strong> Pricing can change frequently. Always verify current
|
||
pricing on official websites before purchasing.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="referral-section" aria-labelledby="referral-title">
|
||
<div class="referral-header">
|
||
<h3 id="referral-title">Support This Project</h3>
|
||
<p>Consider using our referral links - it helps maintain this project at no extra cost
|
||
to you!</p>
|
||
</div>
|
||
<div class="referral-grid">
|
||
<a href="https://alldebrid.com/?uid=3wvya&lang=en" class="referral-card" target="_blank"
|
||
rel="noopener noreferrer sponsored">
|
||
<span class="service-name">AllDebrid</span>
|
||
<span class="referral-badge">Referral Link</span>
|
||
</a>
|
||
<a href="https://real-debrid.com/?id=10990901" class="referral-card" target="_blank"
|
||
rel="noopener noreferrer sponsored">
|
||
<span class="service-name">Real-Debrid</span>
|
||
<span class="referral-badge">Referral Link</span>
|
||
</a>
|
||
|
||
<a href="https://linksnappy.com/?ref=774668" class="referral-card" target="_blank"
|
||
rel="noopener noreferrer sponsored">
|
||
<span class="service-name">LinkSnappy</span>
|
||
<span class="referral-badge">Referral Link</span>
|
||
</a>
|
||
<a href="https://debrid-link.com/id/7B3BO" class="referral-card" target="_blank"
|
||
rel="noopener noreferrer sponsored">
|
||
<span class="service-name">Debrid-Link</span>
|
||
<span class="referral-badge">Referral Link</span>
|
||
</a>
|
||
<a href="https://www.deepbrid.com/aff/go/upward1971" class="referral-card"
|
||
target="_blank" rel="noopener noreferrer sponsored">
|
||
<span class="service-name">Deepbrid</span>
|
||
<span class="referral-badge">Referral Link</span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- File Hosts Section -->
|
||
<section id="file-hosts" class="section" aria-labelledby="hosts-title">
|
||
<div class="container">
|
||
<div class="content-container">
|
||
<div class="section-header">
|
||
<h2 id="hosts-title" class="section-title">Supported File Hosts</h2>
|
||
<p class="section-description">Browse and search through 300+ supported file hosting
|
||
services</p>
|
||
</div>
|
||
|
||
<div class="search-section">
|
||
<form class="search-container" role="search" aria-label="Search file hosts"
|
||
onsubmit="return false">
|
||
<svg class="search-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-search" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<input type="search" id="host-search-input" class="search-input"
|
||
placeholder="Search file hosts (e.g., Mega, Rapidgator...)"
|
||
aria-label="Search file hosts" autocomplete="off" />
|
||
<button id="clear-host-search" class="clear-icon" aria-label="Clear search"
|
||
type="button">
|
||
<svg class="clear-icon-svg" role="img" aria-hidden="true">
|
||
<use href="#icon-close" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
</button>
|
||
</form>
|
||
</div>
|
||
|
||
<div id="file-hosts-table-container" class="data-table-container" role="region"
|
||
aria-live="polite">
|
||
<div class="loading-state" aria-busy="true">
|
||
<div class="loading-spinner"></div>
|
||
<p>Loading file hosts...</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Compare Section -->
|
||
<section id="compare" class="section comparison-section" aria-labelledby="compare-title">
|
||
<div class="container">
|
||
<div class="content-container">
|
||
<div class="section-header">
|
||
<h2 id="compare-title" class="section-title">Compare Services</h2>
|
||
<p class="section-description">Select two services to see a detailed side-by-side comparison
|
||
</p>
|
||
</div>
|
||
|
||
<div class="compare-controls">
|
||
<div class="compare-select-group">
|
||
<label for="provider1">First Service</label>
|
||
<div class="select-wrapper">
|
||
<select id="provider1" aria-label="Select first provider to compare">
|
||
<option value="">Choose a service...</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="compare-vs">VS</div>
|
||
<div class="compare-select-group">
|
||
<label for="provider2">Second Service</label>
|
||
<div class="select-wrapper">
|
||
<select id="provider2" aria-label="Select second provider to compare">
|
||
<option value="">Choose a service...</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="compare-table-container" class="data-table-container" role="region" aria-live="polite">
|
||
<div class="empty-state">
|
||
<svg class="empty-state-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M9 12l2 2 4-4"></path>
|
||
<path d="M21 12V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v7"></path>
|
||
<path d="M3 13v6a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-6"></path>
|
||
</svg>
|
||
<h3>Ready to Compare</h3>
|
||
<p>Select two services above to see a detailed comparison</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Adult Hosts Section -->
|
||
<section id="adult-hosts" class="section" aria-labelledby="adult-hosts-title">
|
||
<div class="container">
|
||
<div class="content-container">
|
||
<div class="section-header">
|
||
<h2 id="adult-hosts-title" class="section-title">Adult Content Hosts</h2>
|
||
<p class="section-description">
|
||
Support for adult content varies significantly across debrid services. Some platforms
|
||
actively support major adult file hosts, while others exclude them entirely due to
|
||
policy or legal considerations.
|
||
</p>
|
||
</div>
|
||
|
||
<div class="search-section">
|
||
<form class="search-container" role="search" aria-label="Search adult hosts"
|
||
onsubmit="return false">
|
||
<svg class="search-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||
stroke-width="2">
|
||
<circle cx="11" cy="11" r="8" />
|
||
<path d="M21 21l-4.35-4.35" />
|
||
</svg>
|
||
<input type="search" id="adult-host-search-input" class="search-input"
|
||
placeholder="Search adult hosts..." aria-label="Search adult hosts"
|
||
autocomplete="off" />
|
||
<button id="clear-adult-host-search" class="clear-icon" aria-label="Clear search"
|
||
type="button">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<line x1="18" y1="6" x2="6" y2="18" />
|
||
<line x1="6" y1="6" x2="18" y2="18" />
|
||
</svg>
|
||
</button>
|
||
</form>
|
||
</div>
|
||
|
||
<div id="adult-hosts-table-container" class="data-table-container" role="region"
|
||
aria-live="polite">
|
||
<div class="loading-state" aria-busy="true">
|
||
<div class="loading-spinner"></div>
|
||
<p>Loading adult hosts...</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Speed Test Section -->
|
||
<section id="speed-test" class="section" aria-labelledby="speed-title">
|
||
<div class="container">
|
||
<div class="content-container">
|
||
<div class="section-header">
|
||
<h2 id="speed-title" class="section-title">Speed Test</h2>
|
||
<p class="section-description">
|
||
Actual speeds vary by location, time of day, host performance, and load. Test before
|
||
committing to a long plan.
|
||
</p>
|
||
</div>
|
||
|
||
<div class="speed-section">
|
||
<div class="speed-header">
|
||
<h3>Official Speed Tools</h3>
|
||
<p>Test download speeds directly from service providers</p>
|
||
</div>
|
||
<div class="speed-grid">
|
||
<a href="https://real-debrid.com/speedtest" class="speed-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<span class="service-name">Real‑Debrid</span>
|
||
<span class="speed-test-label">Speed Test</span>
|
||
</a>
|
||
<a href="https://www.premiumize.me/speedtest" class="speed-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<span class="service-name">Premiumize</span>
|
||
<span class="speed-test-label">Speed Test</span>
|
||
</a>
|
||
<a href="https://www.torbox.app/speedtest" class="speed-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<span class="service-name">TorBox</span>
|
||
<span class="speed-test-label">Speed Test</span>
|
||
</a>
|
||
<a href="https://debrid-link.com/webapp/speedtest" class="speed-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<span class="service-name">Debrid‑Link</span>
|
||
<span class="speed-test-label">Speed Test</span>
|
||
</a>
|
||
<a href="https://www.mega-debrid.eu/index.php?page=network" class="speed-card"
|
||
target="_blank" rel="noopener noreferrer">
|
||
<span class="service-name">Mega‑Debrid</span>
|
||
<span class="speed-test-label">Network Test</span>
|
||
</a>
|
||
</div>
|
||
|
||
<div class="alert alert-info" role="alert">
|
||
<svg class="alert-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-alert" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
|
||
<div>These tests are best‑case scenarios from the provider's own network.</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Service Status Section -->
|
||
<section id="live-status" class="section" aria-labelledby="status-title">
|
||
<div class="container">
|
||
<div class="content-container">
|
||
<div class="section-header">
|
||
<h2 id="status-title" class="section-title">Service Status</h2>
|
||
<p class="section-description">Check real-time status and official host lists</p>
|
||
</div>
|
||
|
||
<div class="status-grid">
|
||
<a href="https://alldebrid.com/status/" class="status-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<div class="status-header">
|
||
<span class="service-name">AllDebrid</span>
|
||
<span class="service-status-indicator online" aria-label="Online"></span>
|
||
</div>
|
||
<p>View live status and supported hosts</p>
|
||
</a>
|
||
<a href="https://real-debrid.com/compare" class="status-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<div class="status-header">
|
||
<span class="service-name">Real-Debrid</span>
|
||
<span class="service-status-indicator online" aria-label="Online"></span>
|
||
</div>
|
||
<p>Check service status and host comparison</p>
|
||
</a>
|
||
<a href="https://torbox.app/hosters" class="status-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<div class="status-header">
|
||
<span class="service-name">TorBox</span>
|
||
<span class="service-status-indicator online" aria-label="Online"></span>
|
||
</div>
|
||
<p>View supported hosters and status</p>
|
||
</a>
|
||
<a href="https://www.premiumize.me/services" class="status-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<div class="status-header">
|
||
<span class="service-name">Premiumize</span>
|
||
<span class="service-status-indicator online" aria-label="Online"></span>
|
||
</div>
|
||
<p>Check service availability and features</p>
|
||
</a>
|
||
<a href="https://linksnappy.com/myaccount/status" class="status-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<div class="status-header">
|
||
<span class="service-name">LinkSnappy</span>
|
||
<span class="service-status-indicator online" aria-label="Online"></span>
|
||
</div>
|
||
<p>Monitor service status and hosts</p>
|
||
</a>
|
||
<a href="https://debrid-link.com/webapp/status" class="status-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<div class="status-header">
|
||
<span class="service-name">Debrid-Link</span>
|
||
<span class="service-status-indicator online" aria-label="Online"></span>
|
||
</div>
|
||
<p>View current status and host list</p>
|
||
</a>
|
||
<a href="https://www.mega-debrid.eu/index.php?page=hebergeurs" class="status-card"
|
||
target="_blank" rel="noopener noreferrer">
|
||
<div class="status-header">
|
||
<span class="service-name">Mega-Debrid</span>
|
||
<span class="service-status-indicator online" aria-label="Online"></span>
|
||
</div>
|
||
<p>Check supported file hosts</p>
|
||
</a>
|
||
<a href="https://www.deepbrid.com/status" class="status-card" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<div class="status-header">
|
||
<span class="service-name">Deepbrid</span>
|
||
<span class="service-status-indicator online" aria-label="Online"></span>
|
||
</div>
|
||
<p>Check supported file hosts</p>
|
||
</a>
|
||
</div>
|
||
|
||
<div class="alert alert-info" role="alert">
|
||
<svg class="alert-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-alert" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div><strong>💡 Tip:</strong> Bookmark these pages to verify if a failed link is due to a
|
||
temporary host outage rather than a service limitation.</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<!-- Important Notes Section -->
|
||
<section id="important-notes" class="section" aria-labelledby="notes-title">
|
||
<div class="container">
|
||
<div class="content-container">
|
||
<div class="section-header">
|
||
<h2 id="notes-title" class="section-title">Important Notes</h2>
|
||
<p class="section-description">
|
||
This project aims to provide accurate and up-to-date information, but the debrid service
|
||
landscape is dynamic.
|
||
</p>
|
||
</div>
|
||
|
||
<div class="important-notes-grid">
|
||
<div class="note-card note-card">
|
||
<svg class="note-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-note" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
|
||
<div class="note-content">
|
||
<h3>Services change frequently</h3>
|
||
<p>Pricing, host support, refund policies, and features may be updated without
|
||
notice. Always verify details on the <strong>official service websites</strong>
|
||
before purchasing.</p>
|
||
</div>
|
||
</div>
|
||
<div class="note-card note-card">
|
||
<svg class="note-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-money" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div class="note-content">
|
||
<h3>Final cost may vary</h3>
|
||
<p>Displayed prices are subject to exchange rates, regional taxes, or payment
|
||
processing fees. Your actual charge may differ slightly.</p>
|
||
</div>
|
||
</div>
|
||
<div class="note-card note-card">
|
||
<svg class="note-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-document" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div class="note-content">
|
||
<h3>Data accuracy</h3>
|
||
<p>While we strive for completeness, this comparison reflects community reports and
|
||
public information. We do <strong>not guarantee</strong> uptime, speed, download
|
||
success, or feature availability.</p>
|
||
</div>
|
||
</div>
|
||
<div class="note-card note-card">
|
||
<svg class="note-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-user" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div class="note-content">
|
||
<h3>No affiliation</h3>
|
||
<p>This project is independent and <strong>not affiliated</strong> with any listed
|
||
service.</p>
|
||
</div>
|
||
</div>
|
||
<div class="note-card note-card">
|
||
<svg class="note-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-check" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div class="note-content">
|
||
<h3>Use at your own discretion</h3>
|
||
<p>Choosing a debrid service involves personal judgment. Test short-term plans first
|
||
and review terms carefully.</p>
|
||
</div>
|
||
</div>
|
||
<div class="note-card note-card">
|
||
<svg class="note-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-lock" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div class="note-content">
|
||
<h3>Legal responsibility</h3>
|
||
<p>Debrid services are tools. You are responsible for complying with copyright laws
|
||
and terms of use when accessing content.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="alert alert-warning" role="alert">
|
||
<svg class="alert-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-alert" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div><strong>This is an open-source, community-maintained guide. It does not endorse or
|
||
promote unauthorized file sharing.</strong></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Resources Section -->
|
||
<section id="resources" class="section" aria-labelledby="resources-title">
|
||
<div class="container">
|
||
<div class="content-container">
|
||
<div class="section-header">
|
||
<h2 id="resources-title" class="section-title">Useful Resources and Community</h2>
|
||
<p class="section-description">Enhance your debrid experience with these trusted tools,
|
||
guides, and communities</p>
|
||
</div>
|
||
|
||
<div class="resources-categories enhanced-resources">
|
||
<div class="resource-category elevated">
|
||
<h3>
|
||
<svg class="resource-category-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-tools" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
Tools and Integrations
|
||
</h3>
|
||
<div class="resource-list cards-3">
|
||
<a href="https://github.com/debridmediamanager/awesome-debrid"
|
||
class="resource-item accent-hover external" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<strong>Awesome-Debrid</strong>
|
||
<span>Curated list of debrid-compatible apps, browser extensions, and automation
|
||
tools</span>
|
||
<div class="meta-tags">
|
||
<span class="tag">Curated</span>
|
||
<span class="tag">Open‑source</span>
|
||
</div>
|
||
</a>
|
||
<a href="https://github.com/debridmediamanager/debrid-media-manager"
|
||
class="resource-item accent-hover external" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<strong>Debrid Media Manager</strong>
|
||
<span>Easily download movies and TV shows directly to your Debrid library</span>
|
||
<div class="meta-tags">
|
||
<span class="tag">App</span>
|
||
<span class="tag">Open‑source</span>
|
||
</div>
|
||
</a>
|
||
<a href="https://github.com/rogerfar/rdt-client"
|
||
class="resource-item accent-hover external" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<strong>Real-Debrid Torrent Client</strong>
|
||
<span>Web interface to manage your torrents on Real-Debrid, AllDebrid,
|
||
Premiumize TorBox or DebridLink</span>
|
||
<div class="meta-tags">
|
||
<span class="tag">Web UI</span>
|
||
<span class="tag">Open‑source</span>
|
||
</div>
|
||
</a>
|
||
<a href="https://github.com/g0ldyy/comet"
|
||
class="resource-item accent-hover external" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<strong>Comet</strong>
|
||
<span>Stremio's torrent/debrid search add-on</span>
|
||
<div class="meta-tags">
|
||
<span class="tag">Addon</span>
|
||
<span class="tag">Open‑source</span>
|
||
</div>
|
||
</a>
|
||
<a href="https://github.com/jackett/jackett"
|
||
class="resource-item accent-hover external" target="_blank"
|
||
rel="noopener noreferrer">
|
||
<strong>Jackett + Prowlarr</strong>
|
||
<span>Indexer proxies that work seamlessly with debrid services for
|
||
automation</span>
|
||
<div class="meta-tags">
|
||
<span class="tag">Indexers</span>
|
||
<span class="tag">Automation</span>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="resource-category elevated">
|
||
<h3>
|
||
<svg class="resource-category-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-user" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
Community and Support
|
||
</h3>
|
||
<div class="resource-list cards-3">
|
||
<div class="resource-item static">
|
||
<a href="https://www.reddit.com/r/RealDebrid/">
|
||
<strong>r/Real-Debrid</strong>
|
||
<span>Active discussions on various debrid services and usage tips.</span>
|
||
<div class="meta-tags">
|
||
<span class="tag">sub-reddit</span>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
<div class="resource-item static">
|
||
<a href="https://www.reddit.com/r/debridmediamanager/">
|
||
<strong>r/DebridMediaManager</strong>
|
||
<span>Active discussions on various debrid services and usage tips.</span>
|
||
<div class="meta-tags">
|
||
<span class="tag">sub-reddit</span>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
<div class="resource-item static">
|
||
<a href="https://www.reddit.com/r/AllDebrid/">
|
||
<strong>r/Alldebrid</strong>
|
||
<span>Active discussions on various debrid services and usage tips.</span>
|
||
<div class="meta-tags">
|
||
<span class="tag">sub-reddit</span>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
<div class="resource-item static">
|
||
<strong>Discord</strong>
|
||
<span>Many services offer official Discord servers for real-time support and
|
||
status updates</span>
|
||
</div>
|
||
<div class="resource-item static">
|
||
<a
|
||
href="https://github.com/fynks/debrid-services-comparison/issues?q=sort%3Aupdated-desc+is%3Aissue+is%3Aopen">
|
||
<strong>GitHub Issues</strong>
|
||
<span>Report inaccuracies or suggest improvements here — this project
|
||
thrives on
|
||
community input!</span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="alert alert-info" role="alert">
|
||
<svg class="alert-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-alert" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div><strong>💡 Pro Tip:</strong> Combine your debrid service with automation tools like
|
||
<strong>Debrid Media Manager (DMM)</strong> or <strong>Overseerr</strong> for a seamless
|
||
media experience.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<!-- Footer -->
|
||
<footer class="site-footer" role="contentinfo">
|
||
<div class="container">
|
||
<div class="content-container">
|
||
<div class="footer-content improved">
|
||
<div class="footer-section">
|
||
<div class="footer-brand">
|
||
<svg class="footer-logo" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||
stroke-width="2">
|
||
<path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z" />
|
||
</svg>
|
||
<h4>Debrid Compare</h4>
|
||
</div>
|
||
<p class="footer-description">
|
||
A comprehensive, community-driven comparison of premium debrid services.
|
||
Compare pricing, features, and host support to find the best service for your needs.
|
||
</p>
|
||
<div class="footer-stats">
|
||
<span class="footer-stat">8 Services</span>
|
||
<span class="footer-stat">300+ Hosts</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="footer-section">
|
||
<h5>Quick Links</h5>
|
||
<ul class="footer-links">
|
||
<li><a href="#pricing">Pricing Comparison</a></li>
|
||
<li><a href="#file-hosts">File Hosts</a></li>
|
||
<li><a href="#compare">Compare Services</a></li>
|
||
<li><a href="#speed-test">Speed Tests</a></li>
|
||
<li><a href="#live-status">Service Status</a></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="footer-section">
|
||
<h5>Resources</h5>
|
||
<ul class="footer-links">
|
||
<li><a href="https://github.com/debridmediamanager/awesome-debrid" target="_blank"
|
||
rel="noopener noreferrer">Awesome Debrid</a></li>
|
||
<li><a href="https://github.com/debridmediamanager/debrid-media-manager" target="_blank"
|
||
rel="noopener noreferrer">DMM Tool</a></li>
|
||
<li><a href="https://github.com/rogerfar/rdt-client" target="_blank"
|
||
rel="noopener noreferrer">RDT Client</a></li>
|
||
<li><a href="https://github.com/g0ldyy/comet" target="_blank"
|
||
rel="noopener noreferrer">Comet Addon</a></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="footer-section">
|
||
<h5>Project</h5>
|
||
<ul class="footer-links">
|
||
<li><a href="https://github.com/fynks/debrid-services-comparison" target="_blank"
|
||
rel="noopener noreferrer">Source Code</a></li>
|
||
<li><a href="https://github.com/fynks/debrid-services-comparison/issues" target="_blank"
|
||
rel="noopener noreferrer">Report Issues</a></li>
|
||
<li><a href="https://github.com/fynks/debrid-services-comparison/blob/main/CONTRIBUTING.md"
|
||
target="_blank" rel="noopener noreferrer">Contribute</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="footer-bottom">
|
||
<div class="footer-bottom-content">
|
||
<div class="footer-left">
|
||
<p>© 2025 Debrid Services Comparison. <span class="made-with">Made with ❤️</span>
|
||
by <a href="https://github.com/fynks" target="_blank"
|
||
rel="noopener noreferrer">Fynks</a></p>
|
||
<p class="footer-disclaimer">This is an independent, open-source project not affiliated
|
||
with any debrid service.</p>
|
||
</div>
|
||
<div class="footer-right">
|
||
<div class="footer-meta">
|
||
<span class="last-updated">Last updated: <time datetime="2025-08-22">August 22,
|
||
2025</time></span>
|
||
<a href="https://github.com/fynks/debrid-services-comparison" target="_blank"
|
||
rel="noopener noreferrer" class="github-link"
|
||
aria-label="View source on GitHub">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
|
||
<path
|
||
d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" />
|
||
</svg>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<!-- Back to Top Button -->
|
||
<button id="backToTop" class="back-to-top" aria-label="Back to top" type="button">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<path d="M18 15l-6-6-6 6" />
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
|
||
<!-- JavaScript -->
|
||
<script>
|
||
// Dark mode toggle
|
||
document.addEventListener('DOMContentLoaded', () => {
|
||
const btn = document.getElementById('darkModeToggle');
|
||
const bodyEl = document.body;
|
||
const navToggle = document.getElementById('navToggle');
|
||
const nav = document.getElementById('primary-navigation');
|
||
const navOverlay = document.getElementById('navOverlay');
|
||
const focusableSelectors = 'a[href], button:not([disabled]), select, textarea, input, [tabindex]:not([tabindex="-1"])';
|
||
let lastFocusedBeforeMenu = null;
|
||
|
||
// Mark JS ready to enable transitions after initial paint (prevents slide-in glitch)
|
||
requestAnimationFrame(() => bodyEl.classList.add('js-ready'));
|
||
|
||
function trapFocus(container) {
|
||
const focusables = Array.from(container.querySelectorAll(focusableSelectors));
|
||
if (!focusables.length) return;
|
||
let first = focusables[0];
|
||
let last = focusables[focusables.length - 1];
|
||
function handle(e) {
|
||
if (e.key === 'Tab') {
|
||
if (e.shiftKey && document.activeElement === first) { e.preventDefault(); last.focus(); }
|
||
else if (!e.shiftKey && document.activeElement === last) { e.preventDefault(); first.focus(); }
|
||
}
|
||
}
|
||
container.addEventListener('keydown', handle);
|
||
}
|
||
|
||
function updateNavAria() {
|
||
if (!nav) return;
|
||
if (window.innerWidth <= 900) {
|
||
nav.setAttribute('aria-hidden', bodyEl.classList.contains('nav-open') ? 'false' : 'true');
|
||
} else {
|
||
nav.removeAttribute('aria-hidden');
|
||
}
|
||
}
|
||
|
||
function openMenu() {
|
||
lastFocusedBeforeMenu = document.activeElement;
|
||
bodyEl.classList.add('nav-open');
|
||
navToggle.setAttribute('aria-expanded', 'true');
|
||
navOverlay.hidden = false;
|
||
nav.setAttribute('data-open', 'true');
|
||
const firstLink = nav.querySelector('a');
|
||
firstLink && firstLink.focus();
|
||
trapFocus(nav);
|
||
updateNavAria();
|
||
}
|
||
function closeMenu() {
|
||
bodyEl.classList.remove('nav-open');
|
||
navToggle.setAttribute('aria-expanded', 'false');
|
||
navOverlay.hidden = true;
|
||
nav.removeAttribute('data-open');
|
||
lastFocusedBeforeMenu && lastFocusedBeforeMenu.focus();
|
||
updateNavAria();
|
||
}
|
||
if (navToggle) {
|
||
navToggle.addEventListener('click', () => {
|
||
if (bodyEl.classList.contains('nav-open')) closeMenu(); else openMenu();
|
||
});
|
||
}
|
||
if (navOverlay) {
|
||
navOverlay.addEventListener('click', closeMenu);
|
||
}
|
||
window.addEventListener('keydown', (e) => {
|
||
if (e.key === 'Escape' && bodyEl.classList.contains('nav-open')) closeMenu();
|
||
});
|
||
|
||
// Handle resize (debounced via rAF)
|
||
let resizeRaf;
|
||
window.addEventListener('resize', () => {
|
||
if (resizeRaf) cancelAnimationFrame(resizeRaf);
|
||
resizeRaf = requestAnimationFrame(updateNavAria);
|
||
});
|
||
updateNavAria();
|
||
|
||
// Scrollspy for active nav link
|
||
const sectionIds = Array.from(nav?.querySelectorAll('a[href^="#"]') || []).map(a => a.getAttribute('href')).filter(Boolean);
|
||
const sections = sectionIds.map(id => document.querySelector(id)).filter(Boolean);
|
||
if ('IntersectionObserver' in window && sections.length) {
|
||
const observer = new IntersectionObserver(entries => {
|
||
entries.forEach(entry => {
|
||
const id = '#' + entry.target.id;
|
||
const link = nav.querySelector(`a[href="${id}"]`);
|
||
if (link) {
|
||
if (entry.isIntersecting) {
|
||
nav.querySelectorAll('.nav-link.active').forEach(l => { l.classList.remove('active'); l.removeAttribute('aria-current'); });
|
||
link.classList.add('active');
|
||
link.setAttribute('aria-current', 'page');
|
||
}
|
||
}
|
||
});
|
||
}, { rootMargin: '-40% 0px -50% 0px', threshold: [0, 0.25, 0.5, 1] });
|
||
sections.forEach(sec => observer.observe(sec));
|
||
}
|
||
if (btn) {
|
||
const getTheme = () => document.documentElement.getAttribute('data-theme') || 'light';
|
||
const setTheme = (theme) => {
|
||
document.documentElement.setAttribute('data-theme', theme);
|
||
document.documentElement.style.colorScheme = theme;
|
||
localStorage.setItem('theme', theme);
|
||
btn.setAttribute('aria-pressed', String(theme === 'dark'));
|
||
};
|
||
|
||
btn.setAttribute('aria-pressed', String(getTheme() === 'dark'));
|
||
btn.addEventListener('click', () => {
|
||
setTheme(getTheme() === 'dark' ? 'light' : 'dark');
|
||
});
|
||
}
|
||
|
||
// Smooth scroll for anchor links
|
||
const prefersReduced = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||
anchor.addEventListener('click', (e) => {
|
||
const id = anchor.getAttribute('href');
|
||
const target = id && document.querySelector(id);
|
||
if (!target) return;
|
||
|
||
e.preventDefault();
|
||
if (bodyEl.classList.contains('nav-open')) closeMenu();
|
||
target.scrollIntoView({
|
||
behavior: prefersReduced ? 'auto' : 'smooth',
|
||
block: 'start'
|
||
});
|
||
|
||
const focusEl = target.querySelector('h1,h2,h3,h4,h5,h6') || target;
|
||
focusEl.setAttribute('tabindex', '-1');
|
||
focusEl.focus({ preventScroll: true });
|
||
setTimeout(() => focusEl.removeAttribute('tabindex'), 400);
|
||
});
|
||
});
|
||
|
||
// Back to top button
|
||
const backToTop = document.getElementById('backToTop');
|
||
if (backToTop) {
|
||
window.addEventListener('scroll', () => {
|
||
if (window.pageYOffset > 300) {
|
||
backToTop.classList.add('visible');
|
||
} else {
|
||
backToTop.classList.remove('visible');
|
||
}
|
||
}, { passive: true });
|
||
|
||
backToTop.addEventListener('click', () => {
|
||
window.scrollTo({
|
||
top: 0,
|
||
behavior: prefersReduced ? 'auto' : 'smooth'
|
||
});
|
||
});
|
||
}
|
||
|
||
// Search functionality for file hosts
|
||
const hostSearchInput = document.getElementById('host-search-input');
|
||
const clearHostSearch = document.getElementById('clear-host-search');
|
||
|
||
if (clearHostSearch) {
|
||
clearHostSearch.addEventListener('click', () => {
|
||
hostSearchInput.value = '';
|
||
hostSearchInput.focus();
|
||
// Trigger search clear event if needed
|
||
});
|
||
}
|
||
|
||
// Search functionality for adult hosts
|
||
const adultHostSearchInput = document.getElementById('adult-host-search-input');
|
||
const clearAdultHostSearch = document.getElementById('clear-adult-host-search');
|
||
|
||
if (clearAdultHostSearch) {
|
||
clearAdultHostSearch.addEventListener('click', () => {
|
||
adultHostSearchInput.value = '';
|
||
adultHostSearchInput.focus();
|
||
// Trigger search clear event if needed
|
||
});
|
||
}
|
||
|
||
// Mock data loading simulation (replace with actual API calls)
|
||
setTimeout(() => {
|
||
// Simulate loading completion
|
||
const loadingStates = document.querySelectorAll('.loading-state');
|
||
loadingStates.forEach(state => {
|
||
state.innerHTML = '<p style="text-align: center; color: var(--text-secondary); padding: var(--space-xl);">Data would be loaded here via API calls</p>';
|
||
});
|
||
}, 2000);
|
||
|
||
// Compare functionality
|
||
const provider1Select = document.getElementById('provider1');
|
||
const provider2Select = document.getElementById('provider2');
|
||
const compareContainer = document.getElementById('compare-table-container');
|
||
|
||
if (provider1Select && provider2Select) {
|
||
// Populate select options (mock data)
|
||
const services = ['AllDebrid', 'Real-Debrid', 'TorBox', 'Premiumize', 'LinkSnappy', 'Debrid-Link', 'Mega-Debrid', 'Deepbrid'];
|
||
|
||
services.forEach(service => {
|
||
const option1 = new Option(service, service.toLowerCase());
|
||
const option2 = new Option(service, service.toLowerCase());
|
||
provider1Select.appendChild(option1);
|
||
provider2Select.appendChild(option2);
|
||
});
|
||
|
||
// Handle comparison
|
||
const updateComparison = () => {
|
||
const service1 = provider1Select.value;
|
||
const service2 = provider2Select.value;
|
||
|
||
if (service1 && service2 && service1 !== service2) {
|
||
compareContainer.style.display = 'block';
|
||
compareContainer.classList.add('comparison-visible');
|
||
compareContainer.innerHTML = `
|
||
<div style="padding: var(--space-4xl); text-align: center;">
|
||
<h3 style="margin: 0 0 var(--space-lg); color: var(--text-primary);">
|
||
${service1} vs ${service2}
|
||
</h3>
|
||
<p style="color: var(--text-secondary); margin: 0;">
|
||
Detailed comparison would be shown here
|
||
</p>
|
||
</div>
|
||
`;
|
||
} else {
|
||
compareContainer.style.display = 'none';
|
||
compareContainer.classList.remove('comparison-visible');
|
||
}
|
||
};
|
||
|
||
provider1Select.addEventListener('change', updateComparison);
|
||
provider2Select.addEventListener('change', updateComparison);
|
||
}
|
||
});
|
||
</script>
|
||
|
||
<!-- Noscript warning for core interactive features -->
|
||
<noscript>
|
||
<div class="alert alert-warning"
|
||
style="margin: 20px; position: fixed; top: 60px; left: 50%; transform: translateX(-50%); z-index: 1000;">
|
||
<svg class="alert-icon" role="img" aria-hidden="true">
|
||
<use href="#icon-alert" stroke="currentColor" stroke-width="2" fill="none" />
|
||
</svg>
|
||
<div>JavaScript is disabled. Interactive comparison and filtering won't work.</div>
|
||
</div>
|
||
</noscript>
|
||
<!-- SVG Symbol Sprite (Reusable Icons) -->
|
||
<svg style="display: none;" aria-hidden="true" xmlns="http://www.w3.org/2000/svg">
|
||
<!-- Logo Icon -->
|
||
<symbol id="icon-logo" viewBox="0 0 24 24" aria-label="Logo">
|
||
<path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z" />
|
||
</symbol>
|
||
|
||
<!-- Sun Icon (Light Mode) -->
|
||
<symbol id="icon-sun" viewBox="0 0 24 24" aria-label="Sun">
|
||
<circle cx="12" cy="12" r="5" />
|
||
<path
|
||
d="M12 1v2m0 18v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2m20 0h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42" />
|
||
</symbol>
|
||
|
||
<!-- Moon Icon (Dark Mode) -->
|
||
<symbol id="icon-moon" viewBox="0 0 24 24" aria-label="Moon">
|
||
<path d="M21 12.79A9 9 0 1 1 11.21 3a7 7 0 0 0 9.79 9.79z" />
|
||
</symbol>
|
||
|
||
<!-- Search Icon -->
|
||
<symbol id="icon-search" viewBox="0 0 24 24" aria-label="Search">
|
||
<circle cx="11" cy="11" r="8" />
|
||
<path d="M21 21l-4.35-4.35" />
|
||
</symbol>
|
||
|
||
<!-- Close/Clear Icon -->
|
||
<symbol id="icon-close" viewBox="0 0 24 24" aria-label="Close">
|
||
<line x1="18" y1="6" x2="6" y2="18" />
|
||
<line x1="6" y1="6" x2="18" y2="18" />
|
||
</symbol>
|
||
|
||
<!-- Alert Info Icon -->
|
||
<symbol id="icon-alert" viewBox="0 0 24 24" aria-label="Alert">
|
||
<circle cx="12" cy="12" r="10" />
|
||
<path d="M12 16v-4M12 8h.01" />
|
||
</symbol>
|
||
|
||
<!-- Warning Icon -->
|
||
<symbol id="icon-warning" viewBox="0 0 24 24" aria-label="Warning">
|
||
<path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" />
|
||
<line x1="12" y1="9" x2="12" y2="13" />
|
||
<line x1="12" y1="17" x2="12.01" y2="17" />
|
||
</symbol>
|
||
|
||
<!-- Check Icon (Used in empty state, notes) -->
|
||
<symbol id="icon-check" viewBox="0 0 24 24" aria-label="Check">
|
||
<path d="M9 12l2 2 4-4" />
|
||
<path d="M21 12V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v7" />
|
||
<path d="M3 13v6a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-6" />
|
||
</symbol>
|
||
|
||
<!-- Lock Icon -->
|
||
<symbol id="icon-lock" viewBox="0 0 24 24" aria-label="Lock">
|
||
<rect width="18" height="11" x="3" y="11" rx="2" ry="2" />
|
||
<path d="M7 11V7a5 5 0 0 1 10 0v4" />
|
||
</symbol>
|
||
|
||
<!-- Tools/Settings Icon -->
|
||
<symbol id="icon-tools" viewBox="0 0 24 24" aria-label="Tools">
|
||
<path
|
||
d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" />
|
||
</symbol>
|
||
|
||
<!-- User/Community Icon -->
|
||
<symbol id="icon-user" viewBox="0 0 24 24" aria-label="User">
|
||
<path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" />
|
||
<circle cx="9" cy="7" r="4" />
|
||
<path d="M22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75" />
|
||
</symbol>
|
||
|
||
<!-- Note/Info Icon -->
|
||
<symbol id="icon-note" viewBox="0 0 24 24" aria-label="Note">
|
||
<path d="M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z" />
|
||
</symbol>
|
||
|
||
<!-- Money/Finance Icon -->
|
||
<symbol id="icon-money" viewBox="0 0 24 24" aria-label="Money">
|
||
<path d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6" />
|
||
</symbol>
|
||
|
||
<!-- Document Icon -->
|
||
<symbol id="icon-document" viewBox="0 0 24 24" aria-label="Document">
|
||
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
|
||
<polyline points="14,2 14,8 20,8" />
|
||
<line x1="16" y1="13" x2="8" y2="13" />
|
||
<line x1="16" y1="17" x2="8" y2="17" />
|
||
</symbol>
|
||
|
||
</svg>
|
||
|
||
</body>
|
||
|
||
</html> |