{% extends 'base.html.twig' %}
{% block title %}Preferences{% endblock %}
{% block h2 %}Preferences{% endblock %}

{% block body %}
<div class="p-4 flex flex-col md:flex-row gap-2">
    <twig:Card title="Media Preferences" class="w-full">
        <p class="text-gray-50 mb-4">Define a filter to be pre-applied to your download options.</p>
        <div id="filter">
            {{ form_start(preferences_form) }}
                <div class="flex flex-col md:flex-row gap-2">
                    {{ form_row(preferences_form.resolution) }}
                    {{ form_row(preferences_form.codec) }}
                    {{ form_row(preferences_form.language) }}
                    {{ form_row(preferences_form.provider) }}
                    {{ form_row(preferences_form.quality) }}
                    <div class="self-end mb-4">
                        <twig:SubmitButton show_icon text="Save"/>
                    </div>
                </div>
            {{ form_end(preferences_form) }}
        </div>
    </twig:Card>
</div>

<div class="p-4 flex flex-col md:flex-row gap-2">
    <twig:Card title="Download Preferences" class="w-full">
        <p class="text-gray-50 mb-4">Change how your downloads are stored.</p>
        <form id="download_preferences" class="flex flex-col" name="download_preferences" method="post" action="{{ path('app_save_download_preferences') }}">
            <div class="flex flex-row gap-2 mb-2">
                <input type="hidden" name="movie_folder" id="movie_folder_hidden" value="0" />
                <input type="checkbox" name="movie_folder" id="movie_folder" value="1" {{ downloadPreferences['movie_folder'].getPreferenceValue() == true ? 'checked' }} />
                <label class="text-gray-50" for="movie_folder">Store movies in a new directory?</label>
            </div>
            <button class="px-1.5 py-1 max-w-20 rounded-md bg-green-600 text-white" type="submit">Submit</button>
        </form>
    </twig:Card>
</div>

<div class="p-4 flex flex-col md:flex-row gap-2">
    <twig:Card title="Calendar Preferences" class="w-full">
        <p class="text-gray-50 mb-4">Manage your Upcoming Episodes calendar.</p>
        <form id="calendar_preferences" class="flex flex-col" name="calendar_preferences" method="post" action="{{ path('app.save.calendar-preferences') }}">
            <div class="flex flex-col gap-2">
                <div class="flex flex-row gap-2 mb-1">
                    <input type="hidden" name="enable_ical_up_ep" id="enable_ical_up_ep_hidden" value="0" />
                    <input type="checkbox" name="enable_ical_up_ep" id="enable_ical_up_ep" value="1" {{ calendarPreferences['enable_ical_up_ep'].getPreferenceValue() == true ? 'checked' }} />
                    <label class="text-gray-50" for="enable_ical_up_ep">Enable a publicly available iCal calendar?</label>
                </div>
                <small class="text-gray-50 mb-4">Enabling the iCal calendar will allow you to subscribe from iCal
                    supporting clients. This endpoint will be publicly available with no authentication required.
                    Disabling this option will disable the calendar and public endpoint for your user.
                    This will not affect the calendar within the app.
                </small>
            </div>
            <button class="px-1.5 py-1 max-w-20 rounded-md bg-green-600 text-white" type="submit">Submit</button>
        </form>
    </twig:Card>
</div>
{% endblock %}