Compare commits

..

2 Commits

Author SHA1 Message Date
71bcf277f6 Add type icons to downloads search page 2025-10-15 19:33:37 +02:00
6c44d83e6b Add type filter to download search page 2025-10-15 18:50:49 +02:00
2 changed files with 177 additions and 20 deletions

View File

@@ -5,15 +5,37 @@ namespace App\Livewire;
use App\Models\Downloads;
use Livewire\Component;
use Livewire\WithPagination;
use Livewire\Attributes\Url;
class DownloadsSearch extends Component
{
use WithPagination;
#[Url(history: true)]
public $fileSearch;
public $order = 'created_at_desc';
public $options = [
'FHD' => true,
'FHD 48fps' => true,
];
public $isOpen = false;
// To toggle individual option selection
public function toggleOption($option)
{
$this->options[$option] = !$this->options[$option];
$this->resetPage();
}
// To toggle dropdown visibility
public function toggleDropdown()
{
$this->isOpen = !$this->isOpen;
}
protected $queryString = [
'fileSearch' => ['except' => '', 'as' => 'fS'],
'order' => ['except' => '', 'as' => 'order'],
@@ -24,6 +46,29 @@ class DownloadsSearch extends Component
$this->resetPage();
}
// Map the selected options to database types
private function getSelectedTypes()
{
$types = [];
// Map the options to their corresponding database values
foreach ($this->options as $label => $selected) {
if ($selected) {
if ($label === 'FHD') {
$types[] = 'FHD';
} elseif ($label === 'FHD 48fps') {
$types[] = 'FHDi';
} elseif ($label === 'UHD' && auth()->user()->is_patreon) {
$types[] = 'UHD';
} elseif ($label === 'UHD 48fps' && auth()->user()->is_patreon) {
$types[] = 'UHDi';
}
}
}
return $types;
}
public function clicked($downloadId)
{
$download = Downloads::find($downloadId);
@@ -36,6 +81,17 @@ class DownloadsSearch extends Component
cache()->forget("episode_{$download->episode->id}_download_{$download->type}");
}
public function mount()
{
if (!auth()->user()->is_patreon) {
return;
}
// Add patreon options
$this->options['UHD'] = true;
$this->options['UHD 48fps'] = true;
}
public function render()
{
$orderby = 'created_at';
@@ -72,7 +128,7 @@ class DownloadsSearch extends Component
}
$downloads = Downloads::when($this->fileSearch != '', fn ($query) => $query->where('url', 'like', '%'.$this->fileSearch.'%'))
->when(!auth()->user()->is_patreon, fn ($query) => $query->whereIn('type', ['FHD', 'FHDi']))
->whereIn('type', $this->getSelectedTypes())
->whereNotNull('size')
->orderBy($orderby, $orderdirection)
->paginate(20);

View File

@@ -1,8 +1,8 @@
<div class="py-3">
<div class="mx-auto sm:px-6 lg:px-8 space-y-6 max-w-[100%] xl:max-w-[80%] 2xl:max-w-[50%]">
<div class="py-3 relative">
<div class="mx-auto sm:px-6 lg:px-8 space-y-6 max-w-[100%] lg:max-w-[90%] xl:max-w-[80%] 2xl:max-w-[60%] relative z-10">
<!-- Search Filter -->
<div class="p-4 sm:p-8 bg-white/30 dark:bg-neutral-950/40 shadow sm:rounded-lg backdrop-blur">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div class="p-4 sm:p-8 bg-white/30 dark:bg-neutral-950/40 shadow sm:rounded-lg backdrop-blur relative z-100">
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4 ">
<!-- Title -->
<div>
@@ -36,6 +36,44 @@
</div>
</div>
<div x-data="{ open: @entangle('isOpen') }" x-on:click.away="open = false"
class="relative right-2 left-0 sm:left-2 transition-all">
<div class="absolute inset-y-0 left-2 flex items-center pl-3 pointer-events-none">
<i class="fa-solid fa-filter text-gray-500 dark:text-gray-400"></i>
</div>
<button type="button"
class="inline-flex w-full p-4 pl-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-rose-800 focus:border-rose-900 dark:bg-neutral-900 dark:border-neutral-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-rose-800 dark:focus:border-rose-900"
wire:click="toggleDropdown">
Select Type
<svg class="absolute -mr-1 h-5 w-5 text-gray-500 right-4 top-4"
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"
aria-hidden="true">
<path fill-rule="evenodd"
d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
clip-rule="evenodd" />
</svg>
</button>
<!-- Dropdown Menu -->
@if ($isOpen)
<div x-show="open" x-transition @click.away="open = false"
class="absolute mt-2 w-full rounded-lg bg-white dark:bg-neutral-900 border-[1px] border-gray-300 dark:border-neutral-600 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none z-[110]">
<div class="py-1">
@foreach ($options as $label => $selected)
<label
class="flex items-center px-4 py-2 text-sm text-gray-700 cursor-pointer hover:bg-gray-100 dark:hover:bg-neutral-800">
<input type="checkbox" wire:click="toggleOption('{{ $label }}')"
class="h-4 w-4 text-rose-600 bg-gray-100 border-gray-300 rounded focus:ring-rose-500 dark:focus:ring-rose-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
{{ $selected ? 'checked' : '' }}>
<span class="ml-2 text-gray-900 dark:text-white">{{ $label }}</span>
</label>
@endforeach
</div>
</div>
@endif
</div>
<!-- Ordering -->
<div>
<div class="relative right-2 left-0 sm:left-2 transition-all">
@@ -56,7 +94,8 @@
</div>
</div>
</div>
<div class="relative pt-5 mx-auto sm:px-6 lg:px-8 space-y-6 text-gray-900 dark:text-white max-w-[100%] xl:max-w-[80%] 2xl:max-w-[50%]">
<div
class="relative pt-5 mx-auto sm:px-6 lg:px-8 space-y-6 text-gray-900 dark:text-white max-w-[100%] lg:max-w-[90%] xl:max-w-[80%] 2xl:max-w-[60%]">
<div class="flex flex-col">
<div class="overflow-x-auto sm:-mx-6 lg:-mx-8">
<div class="inline-block min-w-full py-2 sm:px-6 lg:px-8">
@@ -68,9 +107,10 @@
<div
class="flex bg-white/30 dark:bg-neutral-950/40 backdrop-blur font-medium dark:border-neutral-500 border-b rounded-tl-lg rounded-tr-lg">
<div class="flex-1 px-6 py-4 hidden sm:block">Title</div>
<div class="w-28 px-6 py-4 hidden sm:block">Size</div>
<div class="w-32 px-6 py-4 hidden sm:block">Date</div>
<div class="w-32 px-6 py-4">Download</div>
<div class="w-20 px-6 py-4 hidden text-center sm:block">Type</div>
<div class="w-28 px-6 py-4 hidden text-center sm:block">Size</div>
<div class="w-32 px-6 py-4 hidden text-center sm:block">Date</div>
<div class="w-32 px-6 py-4 text-center">Download</div>
</div>
@php
@@ -91,8 +131,58 @@
{{ $title }}
</div>
<!-- Type -->
<div class="w-20 whitespace-nowrap flex justify-center">
<span class="block sm:hidden pr-2">
Type:
</span>
<div class="flex justify-center">
@if ($download->type === 'FHD' || $download->type === 'FHDi')
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
class="text-sky-500" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-badge-hd">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path
d="M3 5m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z" />
<path d="M14 9v6h1a2 2 0 0 0 2 -2v-2a2 2 0 0 0 -2 -2h-1z" />
<path d="M7 15v-6" />
<path d="M10 15v-6" />
<path d="M7 12h3" />
</svg>
@else
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
class="text-rose-600" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"
class="icon icon-tabler icons-tabler-outline icon-tabler-badge-4k">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path
d="M3 5m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z" />
<path d="M7 9v2a1 1 0 0 0 1 1h1" />
<path d="M10 9v6" />
<path d="M14 9v6" />
<path d="M17 9l-2 3l2 3" />
<path d="M15 12h-1" />
</svg>
@endif
@if ($download->type === 'FHDi' || $download->type === 'UHDi')
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" class="text-yellow-600"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round">
<path
d="M9.225 18.412a1.595 1.595 0 0 1 -1.225 .588c-.468 0 -.914 -.214 -1.225 -.588l-4.361 -5.248a1.844 1.844 0 0 1 0 -2.328l4.361 -5.248a1.595 1.595 0 0 1 1.225 -.588c.468 0 .914 .214 1.225 .588l4.361 5.248a1.844 1.844 0 0 1 0 2.328l-4.361 5.248z" />
<path d="M17 5l4.586 5.836a1.844 1.844 0 0 1 0 2.328l-4.586 5.836" />
<path d="M13 5l4.586 5.836a1.844 1.844 0 0 1 0 2.328l-4.586 5.836" />
</svg>
@endif
</div>
</div>
<!-- Size -->
<div class="w-28 whitespace-nowrap flex">
<div class="w-28 whitespace-nowrap flex justify-center">
<span class="block sm:hidden">
Size:
</span>
@@ -100,7 +190,7 @@
</div>
<!-- Date -->
<div class="w-32 whitespace-nowrap flex">
<div class="w-32 whitespace-nowrap flex justify-center">
<span class="block sm:hidden">
Date:
</span>
@@ -108,18 +198,29 @@
</div>
<!-- Download -->
<div class="w-32 whitespace-nowrap">
<div class="w-32 whitespace-nowrap flex justify-center">
@php
if (in_array($download->type, ['FHD', 'FHDi'])) {
$downloadURL = $dldomains[array_rand($dldomains)].'/'.$download->url;
$downloadURL =
$dldomains[array_rand($dldomains)] . '/' . $download->url;
} else {
$now = \Illuminate\Support\Carbon::now();
$expire = \Illuminate\Support\Facades\Crypt::encryptString($now->addHours(6));
$file = \Illuminate\Support\Facades\Crypt::encryptString('hentai/'.$download->url);
$downloadURL = $dlpdomains[array_rand($dlpdomains)].'/download/'.$file.'/'.$expire;
$expire = \Illuminate\Support\Facades\Crypt::encryptString(
$now->addHours(6),
);
$file = \Illuminate\Support\Facades\Crypt::encryptString(
'hentai/' . $download->url,
);
$downloadURL =
$dlpdomains[array_rand($dlpdomains)] .
'/download/' .
$file .
'/' .
$expire;
}
@endphp
<a href="{{ $downloadURL }}" wire:click="clicked({{ $download->id }})" download>
<a href="{{ $downloadURL }}" wire:click="clicked({{ $download->id }})"
download>
<button id="dl-{{ $download->id }}"
class="group rounded-md bg-transparent border-[1px] border-white/20 shadow dark:text-white text-blac cursor-pointer flex justify-between items-center overflow-hidden transition-all w-[110px] h-[32px] mt-1 mb-1">
<div