147 lines
8.2 KiB
Twig
147 lines
8.2 KiB
Twig
{% extends 'base.html.twig' %}
|
|
|
|
{% block title %}{{ results.media.title }} — Download Options — Torsearch{% endblock %}
|
|
|
|
{% block body %}
|
|
<div class="p-4 flex flex-col grow gap-4">
|
|
<h2 class="mb-2 text-3xl font-bold text-gray-50">Media Results</h2>
|
|
<div class="flex flex-row w-full gap-2">
|
|
<twig:Card title="" contentClass="flex flex-col gap-4 justify-between w-full text-gray-50">
|
|
<div class="p-2 md:p-4 flex flex-col md:flex-row gap-6">
|
|
{% if results.media.poster != null %}
|
|
<img class="w-full md:w-40 rounded-lg" src="{{ results.media.poster }}" />
|
|
{% else %}
|
|
<div class="w-full md:w-40 h-[144px] rounded-lg bg-gray-700 flex items-center justify-center">
|
|
<twig:ux:icon width="24" name="hugeicons:loading-01" />
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="w-full flex flex-col">
|
|
<div class="mb-4 flex flex-row gap-2 justify-between">
|
|
<h3 class="text-xl font-medium leading-tight font-bold text-gray-50">
|
|
{{ results.media.title }} - {{ results.media.year }}
|
|
</h3>
|
|
|
|
{# <div data-controller="dropdown" class="relative"#}
|
|
{# {{ stimulus_controller('monitor_button', {#}
|
|
{# tmdbId: results.media.tmdbId,#}
|
|
{# imdbId: results.media.imdbId,#}
|
|
{# title: results.media.title,#}
|
|
{# })}}#}
|
|
{# data-monitor-button-result-filter-outlet="#filter"#}
|
|
{# >#}
|
|
{# <button type="button" data-action="dropdown#toggle click@window->dropdown#hide"#}
|
|
{# class="h-8 text-white bg-green-800 bg-opacity-60 font-medium rounded-lg text-sm#}
|
|
{# px-2 py-1.5 text-center inline-flex items-center hover:bg-green-900 border-2#}
|
|
{# border-green-500">#}
|
|
{# Monitor#}
|
|
{# <svg class="w-2.5 h-2.5 ms-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 10 6">#}
|
|
{# <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4" /></svg>#}
|
|
{# </svg>#}
|
|
{# </button>#}
|
|
|
|
{# <div#}
|
|
{# data-dropdown-target="menu"#}
|
|
{# class="hidden transition transform origin-top-right absolute right-0#}
|
|
{# flex flex-col rounded-md shadow-sm w-44 bg-green-800 border-2 border-green-500 mt-1"#}
|
|
{# data-transition-enter-from="opacity-0 scale-95"#}
|
|
{# data-transition-enter-to="opacity-100 scale-100"#}
|
|
{# data-transition-leave-from="opacity-100 scale-100"#}
|
|
{# data-transition-leave-to="opacity-0 scale-95"#}
|
|
{# >#}
|
|
{# <a href="#"#}
|
|
{# data-action="dropdown#toggle"#}
|
|
{# class="backdrop-filter p-2 bg-opacity-100 hover:bg-green-950 rounded-t-md"#}
|
|
{# >#}
|
|
{# Entire Series#}
|
|
{# </a>#}
|
|
{# <a href="#"#}
|
|
{# data-action="dropdown#toggle"#}
|
|
{# class="backdrop-filter p-2 bg-opacity-100 hover:bg-green-950 rounded-b-md"#}
|
|
{# >#}
|
|
{# Season#}
|
|
{# </a>#}
|
|
{# </div>#}
|
|
{# </div>#}
|
|
|
|
|
|
<div {{ stimulus_controller('monitor_button', {
|
|
tmdbId: results.media.tmdbId,
|
|
imdbId: results.media.imdbId,
|
|
title: results.media.title,
|
|
})}}
|
|
data-monitor-button-result-filter-outlet="#filter"
|
|
>
|
|
<button data-monitor-button-target="button" {{ stimulus_action('monitor_button', 'toggle', 'click') }}
|
|
class="h-8 text-white bg-green-800 bg-opacity-60 font-medium rounded-lg text-sm
|
|
px-2 py-1.5 text-center inline-flex items-center hover:bg-green-900 border-2
|
|
border-green-500"
|
|
type="button"
|
|
>
|
|
Monitor
|
|
<svg class="w-2.5 h-2.5 ms-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 10 6">
|
|
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
|
|
</svg>
|
|
</button>
|
|
|
|
<!-- Dropdown menu -->
|
|
<div data-monitor-button-target="options"
|
|
class="absolute mt-1 right-12 z-40 hidden divide-y rounded-md shadow-sm
|
|
w-44 bg-green-800 backdrop-filter bg-opacity-100 border-2 border-green-500"
|
|
>
|
|
<ul class="py-2 text-sm text-gray-100" aria-labelledby="dropdownDefaultButton">
|
|
<li {{ stimulus_action('monitor_button', 'monitorSeries', 'click') }}>
|
|
<button class="px-4 py-2 hover:bg-green-950 w-full text-left">
|
|
Entire Series
|
|
</button>
|
|
</li>
|
|
<li {{ stimulus_action('monitor_button', 'monitorSeason', 'click') }}>
|
|
<button class="px-4 py-2 hover:bg-green-950 w-full text-left">
|
|
Season
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
<p class="text-gray-50">
|
|
{{ results.media.description }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<twig:Filter results="{{ results }}" filter="{{ filter }}" />
|
|
|
|
{% if "movies" == results.media.mediaType %}
|
|
<div class="results" {{ stimulus_controller('movie_results', {title: results.media.title, tmdbId: results.media.tmdbId, imdbId: results.media.imdbId}) }}>
|
|
</div>
|
|
{% elseif "tvshows" == results.media.mediaType %}
|
|
<twig:TvEpisodeList
|
|
results="results"
|
|
:imdbId="results.media.imdbId" :season="results.season" :perPage="20" :pageNumber="1"
|
|
:tmdbId="results.media.tmdbId" :title="results.media.title" loading="defer"
|
|
/>
|
|
{% endif %}
|
|
</twig:Card>
|
|
</div>
|
|
</div>
|
|
<style>
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
}
|
|
|
|
@media (min-width: 640px) {
|
|
thead tr:not(:first-child) {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
td:not(:last-child) {
|
|
border-bottom: 0;
|
|
}
|
|
</style>
|
|
{% endblock %}
|