Added:
- manga import - read from cbz - save cbz from scrapping - menu interactions
This commit is contained in:
Jérémy Guillot
@@ -16,40 +16,50 @@
|
||||
</div>
|
||||
{% endblock %}
|
||||
{% block body %}
|
||||
{# TODO styliser cette page #}
|
||||
<table class="min-w-full bg-white">
|
||||
<thead class="bg-gray-800 text-white">
|
||||
<tr>
|
||||
<th class="w-1/12 py-2 px-4">
|
||||
<input type="checkbox">
|
||||
</th>
|
||||
<th class="w-2/12 py-2 px-4 text-left">Manga</th>
|
||||
<th class="w-1/12 py-2 px-4 text-left">Volume</th>
|
||||
<th class="w-4/12 py-2 px-4 text-left">Chapter</th>
|
||||
<th class="w-1/12 py-2 px-4 text-left">Title</th>
|
||||
<th class="w-1/12 py-2 px-4 text-left">Actions</th>
|
||||
<div class="container mx-auto mt-2">
|
||||
<div class="bg-white overflow-hidden">
|
||||
<div class="overflow-x-auto">
|
||||
<table class="min-w-full bg-white">
|
||||
<thead>
|
||||
<tr class="bg-gray-800 text-white">
|
||||
<th class="w-1/12 py-3 px-4 text-left">
|
||||
<input type="checkbox" class="form-checkbox h-5 w-5 text-green-600">
|
||||
</th>
|
||||
<th class="w-2/12 py-3 px-4 text-left">Manga</th>
|
||||
<th class="w-1/12 py-3 px-4 text-left">Volume</th>
|
||||
<th class="w-3/12 py-3 px-4 text-left">Chapitre</th>
|
||||
<th class="w-3/12 py-3 px-4 text-left">Titre</th>
|
||||
<th class="w-2/12 py-3 px-4 text-left">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-700">
|
||||
{% for manga in status %}
|
||||
<tr class="border-b border-gray-200 hover:bg-gray-50 transition duration-150 ease-in-out">
|
||||
<td class="py-4 px-4 text-center">
|
||||
<input type="checkbox" class="form-checkbox h-5 w-5 text-green-600">
|
||||
</td>
|
||||
<td class="py-4 px-4 font-medium">{{ manga.manga }}</td>
|
||||
<td class="py-4 px-4">{{ manga.volume }}</td>
|
||||
<td class="py-4 px-4">{{ manga.chapter }}</td>
|
||||
<td class="py-4 px-4">{{ manga.title }}</td>
|
||||
<td class="py-4 px-4">
|
||||
<button class="text-red-500 hover:text-red-700 transition duration-150 ease-in-out">
|
||||
<i class="fas fa-trash-alt"></i>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr>
|
||||
<td colspan="6" class="py-4 px-4 text-center text-gray-500">Aucune activité en cours.</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<th class="w-1/12 py-2 px-4"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-700">
|
||||
{% for manga in status %}
|
||||
<tr class="border-b">
|
||||
<td class="py-2 px-4 text-center">
|
||||
<input type="checkbox">
|
||||
</td>
|
||||
<td class="py-2 px-4">{{ manga.manga }}</td>
|
||||
<td class="py-2 px-4">{{ manga.volume }}</td>
|
||||
<td class="py-2 px-4">{{ manga.chapter }}</td>
|
||||
<td class="py-2 px-4">{{ manga.title }}</td>
|
||||
<td class="py-2 px-4 text-center">
|
||||
<button class="text-red-500 hover:text-red-700">×</button>
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="mt-4">
|
||||
<span>Total records: {{ status|length }}</span>
|
||||
{# <div class="mt-6 ml-4 flex justify-between items-center">#}
|
||||
{# <span class="text-sm text-gray-600">Total des enregistrements: {{ status|length }}</span>#}
|
||||
{# </div>#}
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
{{ encore_entry_script_tags('app') }}
|
||||
{% endblock %}
|
||||
</head>
|
||||
<body class="bg-gray-50 h-full overflow-hidden">
|
||||
<body class="bg-gray-50 h-full overflow-hidden" data-controller="menu">
|
||||
<div data-controller="mercure" data-mercure-topic="notification"></div>
|
||||
|
||||
<div data-controller="alert" class="fixed right-0 z-50 flex justify-center w-full">
|
||||
@@ -25,6 +25,9 @@
|
||||
|
||||
<!-- Header -->
|
||||
<header class="bg-green-600 h-16 flex items-center fixed w-full z-30">
|
||||
<button data-action="click->menu#toggleMenu" class="text-white p-2 md:hidden">
|
||||
<i class="fas fa-bars"></i>
|
||||
</button>
|
||||
<div class="flex justify-center ml-10">
|
||||
<a class="flex flex-row justify-start" href="{{ path('app_manga') }}">
|
||||
{# <div class="flex items-center"> #}
|
||||
@@ -55,12 +58,12 @@
|
||||
<!-- Main content area -->
|
||||
<div class="flex h-full pt-16">
|
||||
<!-- Sidebar -->
|
||||
<nav class="w-60 bg-white h-full overflow-y-auto fixed left-0">
|
||||
<nav data-menu-target="sidebar" class="w-60 bg-white h-full overflow-y-auto fixed left-0 transform -translate-x-full transition-transform duration-200 ease-in-out md:translate-x-0 z-40">
|
||||
{% include 'menu/menu.html.twig' %}
|
||||
</nav>
|
||||
|
||||
<!-- Main content -->
|
||||
<main class="flex-1 flex flex-col overflow-hidden ml-60 w-full">
|
||||
<main class="flex-1 flex flex-col overflow-hidden md:ml-60 w-full">
|
||||
<!-- Toolbar -->
|
||||
<div class="bg-white shadow z-20 w-full">
|
||||
{% block toolbar %}
|
||||
|
||||
20
templates/calendar/index.html.twig
Normal file
20
templates/calendar/index.html.twig
Normal file
@@ -0,0 +1,20 @@
|
||||
{% extends 'base.html.twig' %}
|
||||
|
||||
{% block title %}Hello CalendarController!{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<style>
|
||||
.example-wrapper { margin: 1em auto; max-width: 800px; width: 95%; font: 18px/1.5 sans-serif; }
|
||||
.example-wrapper code { background: #F5F5F5; padding: 2px 6px; }
|
||||
</style>
|
||||
|
||||
<div class="example-wrapper">
|
||||
<h1>Hello {{ controller_name }}! ✅</h1>
|
||||
|
||||
This friendly message is coming from:
|
||||
<ul>
|
||||
<li>Your controller at <code><a href="{{ '/app/src/Controller/CalendarController.php'|file_link(0) }}">src/Controller/CalendarController.php</a></code></li>
|
||||
<li>Your template at <code><a href="{{ '/app/templates/calendar/index.html.twig'|file_link(0) }}">templates/calendar/index.html.twig</a></code></li>
|
||||
</ul>
|
||||
</div>
|
||||
{% endblock %}
|
||||
13
templates/import/confirm.html.twig
Normal file
13
templates/import/confirm.html.twig
Normal file
@@ -0,0 +1,13 @@
|
||||
{% extends 'base.html.twig' %}
|
||||
|
||||
{% block body %}
|
||||
<div class="container mx-auto p-4">
|
||||
<h1 class="text-2xl font-bold mb-4">Confirmer l'Importation</h1>
|
||||
<p><strong>Titre:</strong> {{ title }}</p>
|
||||
<p><strong>Volume:</strong> {{ volume }}</p>
|
||||
<form method="post">
|
||||
<button type="submit" class="mt-2 btn btn-primary">Importer</button>
|
||||
</form>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
43
templates/import/index.html.twig
Normal file
43
templates/import/index.html.twig
Normal file
@@ -0,0 +1,43 @@
|
||||
{% extends 'base.html.twig' %}
|
||||
|
||||
{% block body %}
|
||||
<div class="container mx-auto p-4">
|
||||
<div class="bg-white shadow-lg rounded-sm overflow-hidden">
|
||||
<div class="bg-gray-800 text-white p-4">
|
||||
<h1 class="text-2xl font-bold">
|
||||
<i class="fas fa-file-import mr-2"></i>Importer un Manga
|
||||
</h1>
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<form method="post" enctype="multipart/form-data">
|
||||
<div class="mb-4">
|
||||
<label for="file-upload" class="block text-sm font-medium text-gray-700 mb-2">
|
||||
Choisir un fichier CBZ
|
||||
</label>
|
||||
<div class="mt-1 flex justify-center px-6 pt-5 pb-6 border-2 border-gray-300 border-dashed rounded-md">
|
||||
<div class="space-y-1 text-center">
|
||||
<i class="fas fa-file-archive text-4xl text-gray-400 mb-3"></i>
|
||||
<div class="flex text-sm text-gray-600">
|
||||
<label for="file-upload" class="relative cursor-pointer bg-white rounded-md font-medium text-green-600 hover:text-green-500">
|
||||
<span>Sélectionner un fichier</span>
|
||||
<input id="file-upload" name="file" type="file" class="sr-only" accept=".cbz" required>
|
||||
</label>
|
||||
<p class="pl-1">ou glisser-déposer</p>
|
||||
</div>
|
||||
<p class="text-xs text-gray-500">
|
||||
CBZ jusqu'à 100MB
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-6">
|
||||
<button type="submit" class="w-full flex items-center justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500">
|
||||
<span class="mr-2">Suivant</span>
|
||||
<i class="fas fa-arrow-right"></i>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
81
templates/import/match.html.twig
Normal file
81
templates/import/match.html.twig
Normal file
@@ -0,0 +1,81 @@
|
||||
{% extends 'base.html.twig' %}
|
||||
|
||||
{% block body %}
|
||||
<div class="container mx-auto p-4">
|
||||
<h1 class="text-2xl font-bold mb-6">Correspondances trouvées :</h1>
|
||||
|
||||
{% if mangas %}
|
||||
{% for manga in mangas %}
|
||||
<div class="bg-white shadow-lg rounded-lg overflow-hidden mb-8">
|
||||
<div class="flex bg-gray-100 p-4">
|
||||
<div class="flex-none w-48">
|
||||
<img src="{{ manga.imageUrl ?? 'https://placehold.co/150x220' }}" alt="{{ manga.title }}"
|
||||
class="w-full h-full object-cover rounded" style="width: 150px; height: 220px;">
|
||||
</div>
|
||||
<div class="flex-grow ml-4">
|
||||
<h2 class="text-xl font-bold text-gray-900">{{ manga.title }} <span class="text-gray-500">({{ manga.publicationYear }})</span></h2>
|
||||
<div class="mt-2">
|
||||
{% for genre in manga.genres %}
|
||||
<span class="inline-block bg-gray-200 text-gray-800 text-xs font-semibold mr-2 mb-2 px-2.5 py-0.5 rounded">
|
||||
{{ genre }}
|
||||
</span>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<p class="text-gray-700 text-sm mt-2">{{ manga.description|truncate(150) }}</p>
|
||||
<div class="mt-2">
|
||||
<span class="text-gray-600 text-sm">
|
||||
<i class="fas fa-star text-yellow-500"></i>
|
||||
{{ manga.rating }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if chapters[manga.slug] is iterable %}
|
||||
{% for volume, volumeChapters in chapters[manga.slug] %}
|
||||
{% set is_first = loop.first %}
|
||||
<div data-controller="table">
|
||||
<div class="border-t border-gray-200">
|
||||
<div class="bg-gray-50 px-4 py-3 flex justify-between items-center cursor-pointer" data-action="click->table#toggle">
|
||||
<h3 class="text-lg font-semibold">Volume {{ '%02d'|format(volume) }}</h3>
|
||||
<div class="flex items-center">
|
||||
<span class="text-gray-600 mr-2">{{ volumeChapters|length }} Chapitres</span>
|
||||
<i data-table-target="toggleIcon" class="fas fa-chevron-down"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div data-table-target="body" class="" style="display: none;">
|
||||
<table class="min-w-full divide-y divide-gray-200">
|
||||
<tbody class="bg-white divide-y divide-gray-200">
|
||||
{% for chapter in volumeChapters %}
|
||||
<tr>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">{{ chapter.number }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ chapter.title ?? 'Sans titre' }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
<div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
|
||||
<form method="post" action="{{ path('import_confirm') }}" class="mt-4 sm:mt-0">
|
||||
<input type="hidden" name="manga_slug" value="{{ manga.slug }}">
|
||||
<input type="hidden" name="volume" value="{{ volume }}">
|
||||
<button type="submit" name="action" value="confirm" class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-green-600 text-base font-medium text-white hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
Confirmer
|
||||
</button>
|
||||
<button type="submit" name="action" value="refuse" class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
Refuser
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<p class="text-gray-700">Aucune correspondance trouvée.</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
@@ -22,21 +22,19 @@
|
||||
</div>
|
||||
{% endblock %}
|
||||
{% block body %}
|
||||
<div
|
||||
class="w-full p-4 grid sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-8 2xl:grid-cols-12 gap-4">
|
||||
<div class="w-full p-4 grid sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-8 2xl:grid-cols-12 gap-4">
|
||||
{% for manga in mangas %}
|
||||
<div
|
||||
class="bg-white overflow-hidden border-gray-300 hover:shadow-2xl hover:border transition-shadow duration-300">
|
||||
<a href="{{ path('manga_show', { 'mangaSlug': manga.slug }) }}">
|
||||
<div class="bg-white overflow-hidden border border-gray-200 hover:shadow-2xl hover:border-gray-400 transition-all duration-300 flex flex-col">
|
||||
<a href="{{ path('app_manga_show', { 'mangaSlug': manga.slug }) }}" class="block relative w-full pb-[150%] overflow-hidden">
|
||||
<img src="{{ manga.imageUrl ?? 'https://placehold.co/150x220' }}" alt="{{ manga.title }}"
|
||||
class="w-full">
|
||||
class="absolute top-0 left-0 w-full h-full object-cover">
|
||||
</a>
|
||||
<div class="p-4">
|
||||
<div class="flex justify-between text-xl">
|
||||
<span>{{ manga.title }}</span>
|
||||
<span class="text-md text-gray-500 ml-2">({{ manga.publicationYear }})</span>
|
||||
<div class="p-2 flex flex-col justify-between flex-grow">
|
||||
<div>
|
||||
<h3 class="text-sm font-semibold truncate">{{ manga.title }}</h3>
|
||||
<p class="text-xs text-gray-500">{{ manga.publicationYear }}</p>
|
||||
</div>
|
||||
<p class="text-gray-500">Added: {{ manga.createdAt|date('M d, Y') }}</p>
|
||||
<p class="text-xs text-gray-400 mt-1">Added: {{ manga.createdAt|date('M d, Y') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
|
||||
@@ -6,37 +6,56 @@
|
||||
<div class="w-full mx-auto p-4">
|
||||
<h1 class="text-center text-3xl my-4">{{ manga.title }} - Chapitre {{ chapter.number }}</h1>
|
||||
|
||||
{% set isCbz = chapter.cbzPath is not null %}
|
||||
{% set totalPages = isCbz ? totalPages : pages|length %}
|
||||
{% set currentPageNumber = isCbz ? currentPage : currentPage.number %}
|
||||
|
||||
<div class="flex justify-center my-4">
|
||||
{% if currentPage.number > 1 %}
|
||||
<a href="{{ path('read_chapter_page', { 'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPage.number - 1 }) }}"
|
||||
{% if currentPageNumber > 1 %}
|
||||
<a href="{{ path('app_manga_read', { 'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPageNumber - 1 }) }}"
|
||||
class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600 mr-4">« Précédent</a>
|
||||
{% endif %}
|
||||
{% if currentPage.number < pages|length %}
|
||||
<a href="{{ path('read_chapter_page', { 'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPage.number + 1 }) }}"
|
||||
{% if currentPageNumber < totalPages %}
|
||||
<a href="{{ path('app_manga_read', { 'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPageNumber + 1 }) }}"
|
||||
class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Suivant »</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="page-container flex justify-center">
|
||||
{% if currentPage.number < pages|length %}
|
||||
<a href="{{ path('read_chapter_page', {'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPage.number + 1}) }}">
|
||||
<img src="{{ asset(currentPage.imageLocalUrl) }}" alt="Page {{ currentPage.number }}"
|
||||
class="shadow-lg">
|
||||
</a>
|
||||
{% if isCbz %}
|
||||
{% if currentPageNumber < totalPages %}
|
||||
<a href="{{ path('app_manga_read', {'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPageNumber + 1}) }}">
|
||||
<img src="data:image/jpeg;base64,{{ pageContent }}" alt="Page {{ currentPageNumber }}"
|
||||
class="shadow-lg">
|
||||
</a>
|
||||
{% else %}
|
||||
<img src="data:image/jpeg;base64,{{ pageContent }}" alt="Page {{ currentPageNumber }}" class="shadow-lg">
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<img src="{{ asset(currentPage.imageLocalUrl) }}" alt="Page {{ currentPage.number }}" class="shadow-lg">
|
||||
{% if currentPageNumber < totalPages %}
|
||||
<a href="{{ path('app_manga_read', {'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPageNumber + 1}) }}">
|
||||
<img src="{{ asset(currentPage.imageLocalUrl) }}" alt="Page {{ currentPageNumber }}"
|
||||
class="shadow-lg">
|
||||
</a>
|
||||
{% else %}
|
||||
<img src="{{ asset(currentPage.imageLocalUrl) }}" alt="Page {{ currentPageNumber }}" class="shadow-lg">
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="flex justify-center my-4">
|
||||
{% if currentPage.number > 1 %}
|
||||
<a href="{{ path('read_chapter_page', { 'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPage.number - 1 }) }}"
|
||||
{% if currentPageNumber > 1 %}
|
||||
<a href="{{ path('app_manga_read', { 'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPageNumber - 1 }) }}"
|
||||
class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600 mr-4">« Précédent</a>
|
||||
{% endif %}
|
||||
{% if currentPage.number < pages|length %}
|
||||
<a href="{{ path('read_chapter_page', { 'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPage.number + 1 }) }}"
|
||||
{% if currentPageNumber < totalPages %}
|
||||
<a href="{{ path('app_manga_read', { 'mangaSlug': manga.slug, 'chapterNumber': chapter.number, 'pageNumber': currentPageNumber + 1 }) }}"
|
||||
class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Suivant »</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="text-center mt-4">
|
||||
Page {{ currentPageNumber }} sur {{ totalPages }}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
@@ -65,27 +65,31 @@
|
||||
|
||||
<div class="p-4">
|
||||
{% for volume, chapters in chapters_by_volume %}
|
||||
{% set non_null_chapters = chapters|filter(chapter => chapter.localPath is not null) %}
|
||||
{% set is_first = loop.first %}
|
||||
{% set volume_cbz_path = chapters|first.cbzPath %}
|
||||
{% set all_chapters_same_cbz = chapters|reduce((carry, chapter) => carry and chapter.cbzPath == volume_cbz_path, true) %}
|
||||
{% set available_chapters = chapters|filter(chapter => chapter.cbzPath is not null) %}
|
||||
{% set total_chapters = chapters|length %}
|
||||
<div data-controller="table">
|
||||
|
||||
<div data-controller="table" data-table-open-value="{{ is_first ? 'true' : 'false' }}">
|
||||
<div class="bg-white rounded-sm shadow mb-4">
|
||||
<div class="flex items-center justify-between bg-white p-4 rounded-t-sm">
|
||||
<div class="flex flex-row gap-4">
|
||||
<i class="fas fa-bookmark text-gray-500 text-3xl"></i>
|
||||
<h2 class="text-xl font-semibold">Volume {{ volume }}</h2>
|
||||
<h2 class="text-xl font-semibold">Volume {{ '%02d'|format(volume) }}</h2>
|
||||
<div class="flex items-center">
|
||||
<span
|
||||
class="px-2 py-1 text-sm rounded {{ non_null_chapters|length > 0 ? 'bg-green-500 text-white' : 'bg-red-500 text-white' }}">
|
||||
{{ non_null_chapters|length }} / {{ total_chapters }}
|
||||
</span>
|
||||
<span class="px-2 py-1 text-sm rounded {{ available_chapters|length > 0 ? 'bg-green-500 text-white' : 'bg-red-500 text-white' }}">
|
||||
{{ available_chapters|length }} / {{ total_chapters }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center">
|
||||
<span class="text-gray-600 mr-2">{{ chapters|length }} Chapters</span>
|
||||
<i data-action="click->table#collapse" class="fas fa-chevron-down cursor-pointer"></i>
|
||||
<i data-table-target="toggleIcon" data-action="click->table#toggle" class="fas fa-chevron-{{ is_first ? 'up' : 'down' }} cursor-pointer"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div data-table-target="body" class="p-4 border-t">
|
||||
|
||||
<div data-table-target="body" class="p-4 border-t" {{ not is_first ? 'style="display: none;"' : '' }}>
|
||||
<table class="min-w-full table-auto">
|
||||
<thead>
|
||||
<tr>
|
||||
@@ -95,53 +99,71 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for chapter in chapters %}
|
||||
{% if all_chapters_same_cbz and volume_cbz_path is not null %}
|
||||
<tr class="border-t hover:bg-green-100">
|
||||
{% if chapter.localPath is not null %}
|
||||
<td class="px-4 py-2 text-green-500">
|
||||
<a href="{{ path('read_chapter_page', { mangaSlug: manga.slug, chapterNumber: chapter.number, pageNumber: 1 }) }}">
|
||||
{{ chapter.number }}</a>
|
||||
</td>
|
||||
{% else %}
|
||||
<td class="px-4 py-2">{{ chapter.number }}</td>
|
||||
{% endif %}
|
||||
|
||||
<td class="px-4 py-2 text-green-500">
|
||||
<a href="{{ path('app_manga_read', { mangaSlug: manga.slug, chapterNumber: chapters|first.number, pageNumber: 1 }) }}">
|
||||
{{ '%02d'|format(volume) }}
|
||||
</a>
|
||||
</td>
|
||||
<td class="px-4 py-2 w-full text-left">
|
||||
{% if chapter.localPath is not null %}
|
||||
<a class=""
|
||||
href="{{ path('read_chapter_page', { mangaSlug: manga.slug, chapterNumber: chapter.number, pageNumber: 1 }) }}">{{ chapter.title ?? 'No title' }}</a>
|
||||
{% else %}
|
||||
{{ chapter.title ?? 'No title' }}
|
||||
{% endif %}
|
||||
<a href="{{ path('app_manga_read', { mangaSlug: manga.slug, chapterNumber: chapters|first.number, pageNumber: 1 }) }}">
|
||||
Volume {{ '%02d'|format(volume) }}
|
||||
</a>
|
||||
</td>
|
||||
<td class="px-4 py-2 flex justify-end gap-2">
|
||||
{% if chapter.localPath is null %}
|
||||
<button
|
||||
data-controller="download-chapter"
|
||||
data-action="click->download-chapter#handleClick"
|
||||
data-url="{{ path('add_chapter', {id: chapter.id}) }}"
|
||||
|
||||
>
|
||||
<span class="text-gray-500 hover:text-green-500">
|
||||
<i data-download-chapter-target="icon" class="fas fa-search"></i>
|
||||
</span>
|
||||
</button>
|
||||
{% else %}
|
||||
<button>
|
||||
<span class="text-gray-500" disabled="disabled">
|
||||
<i data-download-chapter-target="icon" class="fas fa-search"></i>
|
||||
</span>
|
||||
</button>
|
||||
{% endif %}
|
||||
<a href="{{ path('download_cbz', {chapterId: chapter.id}) }}" class="text-gray-500 hover:text-green-500">
|
||||
<a href="{{ path('download_cbz', {chapterId: chapters|first.id}) }}" class="text-gray-500 hover:text-green-500">
|
||||
<i class="fas fa-download"></i>
|
||||
</a>
|
||||
{# <a href="#" class="text-gray-500 hover:text-green-500"> #}
|
||||
{# <i class="fas fa-trash"></i> #}
|
||||
{# </a> #}
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
{% for chapter in chapters %}
|
||||
<tr class="border-t hover:bg-green-100">
|
||||
{% if chapter.cbzPath is not null %}
|
||||
<td class="px-4 py-2 text-green-500">
|
||||
<a href="{{ path('app_manga_read', { mangaSlug: manga.slug, chapterNumber: chapter.number, pageNumber: 1 }) }}">
|
||||
{{ '%02d'|format(chapter.number) }}
|
||||
</a>
|
||||
</td>
|
||||
{% else %}
|
||||
<td class="px-4 py-2">{{ '%02d'|format(chapter.number) }}</td>
|
||||
{% endif %}
|
||||
|
||||
<td class="px-4 py-2 w-full text-left">
|
||||
{% if chapter.cbzPath is not null %}
|
||||
<a href="{{ path('app_manga_read', { mangaSlug: manga.slug, chapterNumber: chapter.number, pageNumber: 1 }) }}">
|
||||
{{ chapter.title ?? 'No title' }}
|
||||
</a>
|
||||
{% else %}
|
||||
{{ chapter.title ?? 'No title' }}
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="px-4 py-2 flex justify-end gap-2">
|
||||
{% if chapter.cbzPath is null %}
|
||||
<button
|
||||
data-controller="download-chapter"
|
||||
data-action="click->download-chapter#handleClick"
|
||||
data-url="{{ path('add_chapter', {id: chapter.id}) }}"
|
||||
>
|
||||
<span class="text-gray-500 hover:text-green-500">
|
||||
<i data-download-chapter-target="icon" class="fas fa-search"></i>
|
||||
</span>
|
||||
</button>
|
||||
{% else %}
|
||||
<button disabled>
|
||||
<span class="text-gray-500">
|
||||
<i class="fas fa-search"></i>
|
||||
</span>
|
||||
</button>
|
||||
{% endif %}
|
||||
<a href="{{ path('download_cbz', {chapterId: chapter.id}) }}" class="text-gray-500 hover:text-green-500">
|
||||
<i class="fas fa-download"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
@@ -1,43 +1,61 @@
|
||||
<div id="menu" class="h-full w-full bg-gray-600 text-white overflow-y-auto">
|
||||
<nav>
|
||||
<ul>
|
||||
<li class="mb-4 border-l-4 border-green-600">
|
||||
<div class="pl-4 p-4 items-center text-green-600 bg-gray-800">
|
||||
<a class="flex items-center" href="{{ path('app_manga') }}">
|
||||
<i class="fas fa-book mr-2"></i>
|
||||
<span>Mangas</span>
|
||||
</a>
|
||||
</div>
|
||||
<ul class="ml-8 mt-2 space-y-4">
|
||||
<li><a href="{{ path('add_new_manga') }}" class="hover:text-green-600">Ajouter un nouveau</a></li>
|
||||
<li><a href="{{ path('app_import') }}" class="hover:text-green-600">Import bibliothèque</a></li>
|
||||
<li><a href="#" class="hover:text-green-600">Collections</a></li>
|
||||
<li><a href="#" class="hover:text-green-600">Découvrir</a></li>
|
||||
</ul>
|
||||
<li class="{{ app.request.get('_route') starts with 'app_manga' ? 'border-l-4 border-green-600' : '' }}">
|
||||
<a href="{{ path('app_manga') }}" class="block pl-4 py-2 flex items-center {{ app.request.get('_route') starts with 'app_manga' ? 'text-green-600 bg-gray-800' : 'hover:bg-gray-700' }}">
|
||||
<i class="fas fa-book mr-2"></i>
|
||||
<span>Mangas</span>
|
||||
</a>
|
||||
{% if app.request.get('_route') starts with 'app_manga' %}
|
||||
<ul class="ml-8 mt-2 space-y-4">
|
||||
<li><a href="{{ path('app_manga_new') }}" class="hover:text-green-600">Ajouter un nouveau</a></li>
|
||||
<li><a href="{{ path('app_import') }}" class="hover:text-green-600">Import bibliothèque</a></li>
|
||||
<li><a href="#" class="hover:text-green-600">Découvrir</a></li>
|
||||
</ul>
|
||||
{% endif %}
|
||||
</li>
|
||||
<li class="mb-4 pl-4 flex items-center hover:text-green-600">
|
||||
<i class="fas fa-calendar-alt mr-2"></i>
|
||||
<span>Calendrier</span>
|
||||
</li>
|
||||
<li class="mb-4 pl-4 hover:text-green-600">
|
||||
<a href="{{ path('app_activity') }}">
|
||||
<div data-controller="activity" class="flex flex-row justify-between items-center">
|
||||
<div class="flex flex-row items-center">
|
||||
<i class="fas fa-clock mr-2"></i>
|
||||
<span>Activité</span>
|
||||
</div>
|
||||
<span data-activity-target="activity"
|
||||
class="bg-green-500 rounded px-2 mr-2 hover:text-white hidden"></span>
|
||||
</div>
|
||||
<li class="{{ app.request.get('_route') == 'app_calendar' ? 'border-l-4 border-green-600' : '' }}">
|
||||
<a href="{{ path('app_calendar') }}" class="block pl-4 py-2 flex items-center {{ app.request.get('_route') == 'app_calendar' ? 'text-green-600 bg-gray-800' : 'hover:bg-gray-700' }}">
|
||||
<i class="fas fa-calendar-alt mr-2"></i>
|
||||
<span>Calendrier</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="mb-4 pl-4 flex items-center hover:text-green-600">
|
||||
<i class="fas fa-cog mr-2"></i>
|
||||
<span>Paramètres</span>
|
||||
<li class="{{ app.request.get('_route') == 'app_activity' ? 'border-l-4 border-green-600' : '' }}">
|
||||
<a href="{{ path('app_activity') }}" class="block pl-4 py-2 flex items-center justify-between {{ app.request.get('_route') == 'app_activity' ? 'text-green-600 bg-gray-800' : 'hover:bg-gray-700' }}">
|
||||
<div class="flex items-center">
|
||||
<i class="fas fa-clock mr-2"></i>
|
||||
<span>Activité</span>
|
||||
</div>
|
||||
<span data-controller="activity" data-activity-target="activity" class="bg-green-500 rounded px-2 mr-2 hover:text-white hidden"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="mb-4 pl-4 flex items-center hover:text-green-600">
|
||||
<i class="fas fa-desktop mr-2"></i>
|
||||
<span>Système</span>
|
||||
<li class="{{ app.request.get('_route') starts with 'app_settings' ? 'border-l-4 border-green-600' : '' }}">
|
||||
<a href="{{ path('app_settings') }}" class="block pl-4 py-2 flex items-center {{ app.request.get('_route') starts with 'app_settings' ? 'text-green-600 bg-gray-800' : 'hover:bg-gray-700' }}">
|
||||
<i class="fas fa-cog mr-2"></i>
|
||||
<span>Paramètres</span>
|
||||
</a>
|
||||
{% if app.request.get('_route') starts with 'app_settings' %}
|
||||
<ul class="ml-8 mt-2 space-y-4">
|
||||
<li><a href="{{ path('app_settings_general') }}" class="hover:text-green-600">Général</a></li>
|
||||
<li><a href="{{ path('app_settings_folders') }}" class="hover:text-green-600">Dossiers</a></li>
|
||||
<li><a href="{{ path('app_settings_scrappers') }}" class="hover:text-green-600">Scrappers</a></li>
|
||||
<li><a href="{{ path('app_settings_ui') }}" class="hover:text-green-600">UI</a></li>
|
||||
</ul>
|
||||
{% endif %}
|
||||
</li>
|
||||
<li class="{{ app.request.get('_route') starts with 'app_system' ? 'border-l-4 border-green-600' : '' }}">
|
||||
<a href="{{ path('app_system') }}" class="block pl-4 py-2 flex items-center {{ app.request.get('_route') starts with 'app_system' ? 'text-green-600 bg-gray-800' : 'hover:bg-gray-700' }}">
|
||||
<i class="fas fa-desktop mr-2"></i>
|
||||
<span>Système</span>
|
||||
</a>
|
||||
{% if app.request.get('_route') starts with 'app_system' %}
|
||||
<ul class="ml-8 mt-2 space-y-4">
|
||||
<li><a href="{{ path('app_system_status') }}" class="hover:text-green-600">Status</a></li>
|
||||
<li><a href="{{ path('app_system_backup') }}" class="hover:text-green-600">Backup</a></li>
|
||||
<li><a href="{{ path('app_system_logs') }}" class="hover:text-green-600">Logs</a></li>
|
||||
<li><a href="{{ path('app_system_updates') }}" class="hover:text-green-600">Updates</a></li>
|
||||
</ul>
|
||||
{% endif %}
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
20
templates/settings/index.html.twig
Normal file
20
templates/settings/index.html.twig
Normal file
@@ -0,0 +1,20 @@
|
||||
{% extends 'base.html.twig' %}
|
||||
|
||||
{% block title %}Hello SettingsController!{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<style>
|
||||
.example-wrapper { margin: 1em auto; max-width: 800px; width: 95%; font: 18px/1.5 sans-serif; }
|
||||
.example-wrapper code { background: #F5F5F5; padding: 2px 6px; }
|
||||
</style>
|
||||
|
||||
<div class="example-wrapper">
|
||||
<h1>Hello {{ controller_name }}! ✅</h1>
|
||||
|
||||
This friendly message is coming from:
|
||||
<ul>
|
||||
<li>Your controller at <code><a href="{{ '/app/src/Controller/SettingsController.php'|file_link(0) }}">src/Controller/SettingsController.php</a></code></li>
|
||||
<li>Your template at <code><a href="{{ '/app/templates/settings/index.html.twig'|file_link(0) }}">templates/settings/index.html.twig</a></code></li>
|
||||
</ul>
|
||||
</div>
|
||||
{% endblock %}
|
||||
20
templates/system/index.html.twig
Normal file
20
templates/system/index.html.twig
Normal file
@@ -0,0 +1,20 @@
|
||||
{% extends 'base.html.twig' %}
|
||||
|
||||
{% block title %}Hello SystemController!{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<style>
|
||||
.example-wrapper { margin: 1em auto; max-width: 800px; width: 95%; font: 18px/1.5 sans-serif; }
|
||||
.example-wrapper code { background: #F5F5F5; padding: 2px 6px; }
|
||||
</style>
|
||||
|
||||
<div class="example-wrapper">
|
||||
<h1>Hello {{ controller_name }}! ✅</h1>
|
||||
|
||||
This friendly message is coming from:
|
||||
<ul>
|
||||
<li>Your controller at <code><a href="{{ '/app/src/Controller/SystemController.php'|file_link(0) }}">src/Controller/SystemController.php</a></code></li>
|
||||
<li>Your template at <code><a href="{{ '/app/templates/system/index.html.twig'|file_link(0) }}">templates/system/index.html.twig</a></code></li>
|
||||
</ul>
|
||||
</div>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user