diff --git a/assets/bootstrap.js b/assets/bootstrap.js index 7d4379e..03a8795 100644 --- a/assets/bootstrap.js +++ b/assets/bootstrap.js @@ -3,7 +3,7 @@ import Popover from '@stimulus-components/popover'; import Dialog from '@stimulus-components/dialog'; import Dropdown from '@stimulus-components/dropdown'; import 'animate.css'; -import Brock from './components/brock.js'; +import EpisodeContainer from './components/episode-container.js'; const app = startStimulusApp(); // register any custom, 3rd party controllers here @@ -11,4 +11,4 @@ app.register('popover', Popover); app.register('dialog', Dialog); app.register('dropdown', Dropdown); -customElements.define('brock-app', Brock); +customElements.define('episode-container', EpisodeContainer); diff --git a/assets/components/brock.js b/assets/components/brock.js deleted file mode 100644 index 8b3462f..0000000 --- a/assets/components/brock.js +++ /dev/null @@ -1,25 +0,0 @@ -export default class Brock extends HTMLElement { - constructor() { - super(); - } - connectedCallback() { - this.render(); - } - - render() { - this.innerHTML = ` - Yo, yo, yo! Waddup ${this.name}, doe, it's Brocky fresh! - `; - } - - // attribute change - attributeChangedCallback(property, oldValue, newValue) { - if (oldValue === newValue) return; - this[ property ] = newValue; - this.render(); - } - - static get observedAttributes() { - return ['name']; - } -} diff --git a/assets/components/episode-container.js b/assets/components/episode-container.js new file mode 100644 index 0000000..8e92638 --- /dev/null +++ b/assets/components/episode-container.js @@ -0,0 +1,34 @@ +export default class EpisodeContainer extends HTMLElement { + #resultsToggleBtnEl; + #resultsTableEl; + #resultsCountBadgeEl; + + constructor() { + super(); + this.#resultsToggleBtnEl = this.querySelector('.dropdown-button'); + this.#resultsCountBadgeEl = this.querySelector('.results-count-badge'); + this.#resultsTableEl = this.querySelector('.results-container'); + + this.#resultsToggleBtnEl.addEventListener('click', () => this.toggleResults()); + this.#resultsCountBadgeEl.addEventListener('click', () => this.toggleResults()); + } + connectedCallback() { + + } + + // attribute change + attributeChangedCallback(property, oldValue, newValue) { + if (oldValue === newValue) return; + this[ property ] = newValue; + } + + static get observedAttributes() { + return ['name']; + } + + toggleResults() { + this.#resultsToggleBtnEl.classList.toggle('rotate-90'); + this.#resultsToggleBtnEl.classList.toggle('-rotate-90'); + this.#resultsTableEl.classList.toggle('hidden'); + } +} diff --git a/assets/controllers/tv_episode_list_controller.js b/assets/controllers/tv_episode_list_controller.js index e418a2f..86570f6 100644 --- a/assets/controllers/tv_episode_list_controller.js +++ b/assets/controllers/tv_episode_list_controller.js @@ -16,8 +16,10 @@ export default class extends Controller { }); if (window.location.hash) { let targetElement = document.querySelector(window.location.hash); - targetElement.scrollIntoView({ behavior: 'smooth', block: 'start' }); - targetElement.classList.add('animate__animated', 'animate__pulse', 'animate__faster'); + if (targetElement) { + targetElement.scrollIntoView({ behavior: 'smooth', block: 'start' }); + targetElement.classList.add('animate__animated', 'animate__pulse', 'animate__faster'); + } } } diff --git a/assets/controllers/tv_results_controller.js b/assets/controllers/tv_results_controller.js index 6fce56e..493fc8c 100644 --- a/assets/controllers/tv_results_controller.js +++ b/assets/controllers/tv_results_controller.js @@ -71,13 +71,6 @@ export default class extends Controller { } } - toggleList() { - this.listTarget.classList.toggle('options-table'); - this.listTarget.classList.toggle('hidden'); - this.toggleButtonTarget.classList.toggle('rotate-90'); - this.toggleButtonTarget.classList.toggle('-rotate-90'); - } - download() { this.options.forEach(option => { const optionSelector = option.querySelector('input[type="checkbox"]'); diff --git a/assets/styles/app.css b/assets/styles/app.css index c94a5a1..478b4d6 100644 --- a/assets/styles/app.css +++ b/assets/styles/app.css @@ -130,3 +130,21 @@ dialog[data-dialog-target="dialog"][closing] { background: unset; @apply bg-orange-500/80 text-black font-bold rounded-md } + +.progress { + display: grid; + grid-template: 1fr / 1fr; + place-items: center; +} +.progress > * { + grid-column: 1 / 1; + grid-row: 1 / 1; +} +.progress .background { + z-index: 1; + place-self: start; +} +.progress .number { + z-index: 2; + background: transparent; +} diff --git a/tailwind.config.js b/tailwind.config.js index cdfef2a..55a4a9c 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -22,6 +22,7 @@ module.exports = { "bg-rose-600", "alert-success", "alert-warning", + "font-bold", "min-w-64", "rotate-180", "-rotate-180", diff --git a/templates/broadcast/Download.stream.html.twig b/templates/broadcast/Download.stream.html.twig index 3915d19..25920a2 100644 --- a/templates/broadcast/Download.stream.html.twig +++ b/templates/broadcast/Download.stream.html.twig @@ -14,14 +14,11 @@ {% if entity.status != "Complete" %} diff --git a/templates/components/DownloadListRow.html.twig b/templates/components/DownloadListRow.html.twig index 02d92e8..ad5a438 100644 --- a/templates/components/DownloadListRow.html.twig +++ b/templates/components/DownloadListRow.html.twig @@ -29,12 +29,13 @@ {% if download.progress < 100 %}
-
-
+
+
+
{{ download.progress }}%
-
{{ download.progress }}%
{% else %} diff --git a/templates/components/Filter.html.twig b/templates/components/Filter.html.twig index 6671671..719b1dd 100644 --- a/templates/components/Filter.html.twig +++ b/templates/components/Filter.html.twig @@ -91,7 +91,7 @@ {% if results.media.mediaType == "tvshows" %}
- + Downloading an entire season this way will use the filter from your preferences to choose the appropriate file(s). @@ -99,7 +99,7 @@ Do you wish to download season {{ results.season }} of "{{ results.media.title }}"? - diff --git a/templates/components/TvEpisodeList.html.twig b/templates/components/TvEpisodeList.html.twig index cc0197c..6445141 100644 --- a/templates/components/TvEpisodeList.html.twig +++ b/templates/components/TvEpisodeList.html.twig @@ -3,7 +3,7 @@ >
{% for episode in this.getEpisodes().items %} -
-
-
- {% if episode['poster'] != null %} - - {% else %} -
- -
- {% endif %} -
-

- {{ episode['episode_number'] }}. {{ episode['name'] }} -

-

{{ episode['overview']|truncate }}

-
- +
+
+ {% if episode['poster'] != null %} + + {% else %} +
+ +
+ {% endif %} +
+

+ {{ episode['episode_number'] }}. {{ episode['name'] }} +

+

{{ episode['overview']|truncate }}

+
+ - - {{ episode['air_date']|date(null, 'UTC') }} - + + {{ episode['air_date']|date(null, 'UTC') }} + - - - missing - - + }) }}"> + + missing + + +
+
+
+
+ +
+
-
-
- -
- +
-
- -
-
-
+ {% endfor %}
{% set paginator = this.episodes %} diff --git a/templates/torrentio/partial/option-table.html.twig b/templates/torrentio/partial/option-table.html.twig index 36340a3..c0a5fd9 100644 --- a/templates/torrentio/partial/option-table.html.twig +++ b/templates/torrentio/partial/option-table.html.twig @@ -1,4 +1,4 @@ -