docs: Update CLAUDE.md with three-tier architecture and new providers
- Added new video players: Vidzy, LuLuvid, Uqload - Added new anime site: French-Manga - Added new series sites category with FS7 - Updated documentation to reflect three-tier architecture (anime sites → series sites → video players) - Added BaseSeriesSite interface documentation - Added "Adding New Series Site" section - Updated test organization with test_french_manga.py Generated with [Claude Code](https://claude.ai/code) via [Happy](https://happy.engineering) Co-Authored-By: Claude <noreply@anthropic.com> Co-Authored-By: Happy <yesreply@happy.engineering>
This commit is contained in:
root
+117
-5
@@ -78,6 +78,9 @@
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
button svg {
|
||||
@@ -103,6 +106,9 @@
|
||||
.btn-small {
|
||||
padding: 6px 12px;
|
||||
font-size: 11px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.btn-pause {
|
||||
@@ -301,6 +307,8 @@
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
margin-top: 40px;
|
||||
gap: 15px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.section-header h2 {
|
||||
@@ -309,6 +317,8 @@
|
||||
background: linear-gradient(45deg, #00d9ff, #00ff88);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.downloads-stats {
|
||||
@@ -338,6 +348,7 @@
|
||||
padding: 15px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.filter-group {
|
||||
@@ -360,7 +371,8 @@
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
color: #fff;
|
||||
font-size: 13px;
|
||||
min-width: 120px;
|
||||
min-width: 100px;
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
.filter-group select:focus,
|
||||
@@ -370,7 +382,8 @@
|
||||
}
|
||||
|
||||
.search-group input {
|
||||
min-width: 200px;
|
||||
min-width: 150px;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.actions-group {
|
||||
@@ -641,6 +654,51 @@
|
||||
.supported-hosts {
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
/* Responsive filters */
|
||||
.downloads-controls {
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.filter-group {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.filter-group select,
|
||||
.filter-group input {
|
||||
width: 100%;
|
||||
min-width: unset;
|
||||
max-width: unset;
|
||||
}
|
||||
|
||||
.search-group input {
|
||||
width: 100%;
|
||||
min-width: unset;
|
||||
}
|
||||
|
||||
.actions-group {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.actions-group button {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Responsive horizontal cards */
|
||||
.anime-card-horizontal {
|
||||
width: 180px;
|
||||
max-width: 85vw;
|
||||
}
|
||||
|
||||
.anime-card-horizontal .anime-card-actions {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.anime-card-horizontal .anime-card-actions button {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
@@ -658,6 +716,38 @@
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
/* Even smaller horizontal cards */
|
||||
.anime-card-horizontal {
|
||||
width: 160px;
|
||||
max-width: 80vw;
|
||||
}
|
||||
|
||||
.anime-card-horizontal .anime-card-title {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* Responsive tabs */
|
||||
.tab {
|
||||
padding: 8px 12px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* Section header responsive */
|
||||
.section-header {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.section-header h2 {
|
||||
font-size: 1.4em;
|
||||
}
|
||||
|
||||
/* Search results grid */
|
||||
.search-results {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
/* Recommendations & Releases Cards */
|
||||
@@ -778,13 +868,15 @@
|
||||
|
||||
.anime-card-horizontal {
|
||||
flex: 0 0 auto;
|
||||
width: 200px;
|
||||
width: 220px;
|
||||
max-width: 90vw;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border-radius: 10px;
|
||||
padding: 12px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
transition: all 0.3s;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.recommendation-card {
|
||||
@@ -821,6 +913,11 @@
|
||||
color: #fff;
|
||||
flex: 1;
|
||||
line-height: 1.3;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.anime-card-horizontal .anime-card-rating {
|
||||
@@ -900,9 +997,12 @@
|
||||
|
||||
.anime-card-horizontal .anime-card-actions button {
|
||||
flex: 1;
|
||||
padding: 6px 10px;
|
||||
font-size: 11px;
|
||||
padding: 6px 8px;
|
||||
font-size: 10px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.anime-card-horizontal .anime-synopsis {
|
||||
@@ -1252,3 +1352,15 @@
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
/* Large screens optimization */
|
||||
@media (min-width: 1400px) {
|
||||
.container {
|
||||
max-width: 1200px;
|
||||
}
|
||||
|
||||
.recommendations-carousel,
|
||||
.releases-carousel {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
+66
-2
@@ -37,8 +37,8 @@ async function loadProviders() {
|
||||
|
||||
// Update anime tabs
|
||||
const animeTabsContainer = document.querySelector('.tabs');
|
||||
const existingTabs = animeTabsContainer.querySelectorAll('.tab[data-tab-type="anime"]');
|
||||
existingTabs.forEach(tab => tab.remove());
|
||||
const existingAnimeTabs = animeTabsContainer.querySelectorAll('.tab[data-tab-type="anime"]');
|
||||
existingAnimeTabs.forEach(tab => tab.remove());
|
||||
|
||||
// Add anime provider tabs
|
||||
Object.entries(data.anime_providers).forEach(([id, provider]) => {
|
||||
@@ -64,6 +64,33 @@ async function loadProviders() {
|
||||
}
|
||||
});
|
||||
|
||||
// Add series provider tabs
|
||||
const existingSeriesTabs = animeTabsContainer.querySelectorAll('.tab[data-tab-type="series"]');
|
||||
existingSeriesTabs.forEach(tab => tab.remove());
|
||||
|
||||
Object.entries(data.series_providers || {}).forEach(([id, provider]) => {
|
||||
// Check if tab doesn't exist
|
||||
if (!document.querySelector(`.tab[data-provider="${id}"]`)) {
|
||||
const button = document.createElement('button');
|
||||
button.className = 'tab';
|
||||
button.setAttribute('data-tab-type', 'series');
|
||||
button.setAttribute('data-provider', id);
|
||||
button.innerHTML = `${provider.icon} ${provider.name}`;
|
||||
button.onclick = () => switchTab(`series-${id}`);
|
||||
animeTabsContainer.appendChild(button);
|
||||
|
||||
// Create corresponding tab content
|
||||
const tabContent = document.createElement('div');
|
||||
tabContent.id = `tab-series-${id}`;
|
||||
tabContent.className = 'tab-content';
|
||||
tabContent.innerHTML = createSeriesTabContent(id, provider);
|
||||
document.querySelector('.container').insertBefore(
|
||||
tabContent,
|
||||
document.getElementById('downloadsList')
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
// Update supported hosts badges
|
||||
const hostsContainer = document.querySelector('.supported-hosts');
|
||||
hostsContainer.innerHTML = '';
|
||||
@@ -115,6 +142,41 @@ function createAnimeTabContent(providerId, provider) {
|
||||
`;
|
||||
}
|
||||
|
||||
/**
|
||||
* Create series provider tab content
|
||||
*/
|
||||
function createSeriesTabContent(providerId, provider) {
|
||||
return `
|
||||
<div class="url-form">
|
||||
<div class="anime-input-group">
|
||||
<input
|
||||
type="text"
|
||||
id="${providerId}UrlInput"
|
||||
placeholder="URL de la série (ex: ${provider.url_pattern})"
|
||||
>
|
||||
<button type="button" class="btn-primary" onclick="handleLoadProviderEpisodes('${providerId}')">
|
||||
<svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
|
||||
</svg>
|
||||
Charger
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div id="${providerId}EpisodeSelector" class="anime-select-group" style="display:none;">
|
||||
<select id="${providerId}EpisodeSelect">
|
||||
<option value="">Sélectionner un épisode</option>
|
||||
</select>
|
||||
<button type="button" class="btn-primary" onclick="handleDownloadProviderEpisode('${providerId}')">
|
||||
<svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"></path>
|
||||
</svg>
|
||||
Télécharger
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle load provider episodes
|
||||
*/
|
||||
@@ -200,6 +262,8 @@ function switchTab(tabName) {
|
||||
btn.classList.add('active');
|
||||
} else if (tabType === 'anime' && btn.getAttribute('data-provider') === tabName.replace('anime-', '')) {
|
||||
btn.classList.add('active');
|
||||
} else if (tabType === 'series' && btn.getAttribute('data-provider') === tabName.replace('series-', '')) {
|
||||
btn.classList.add('active');
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user