{% extends "base.html" %}

{% macro my_setting_select(id, title, options, col='9', desc=None, value=None) %}
    {{ macros.setting_top(title) }}
    <div class="input-group col-sm-{{ col }}">
        <select id="{{ id }}" name="{{ id }}" class="form-control form-control-sm">
            {% set ns = namespace(optgroup=none) %}
            {% for item in options %}
                {% if ns.optgroup != item[2] %}
                    {% if ns.optgroup is not none %}
                        </optgroup>
                    {% endif %}
                    {% if item[2] is not none %}
                        <optgroup label="{{ item[2] }}">
                    {% endif %}
                    {% set ns.optgroup = item[2] %}
                {% endif %}
                {% if value is not none and value == item[0] %}
                    <option value="{{ item[0] }}" selected>{{ item[1] }}</option>
                {% else %}
                    <option value="{{ item[0] }}">{{ item[1] }}</option>
                {% endif %}
            {% endfor %}
            {% if ns.optgroup is not none %}
                </optgroup>
            {% endif %}
        </select>
    </div>
    {{ macros.setting_bottom(desc) }}
{% endmacro %}

{% block content %}
<style>
    #player-wrapper {
        width: 100%;
        max-width: 800px;
        height: 450px;
        margin: 0 auto 20px auto;
        display: none; /* 초기에는 숨김 */
        background: #000;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    }
</style>

<div id="player-wrapper"></div>

<form id="download">
    {{ macros.setting_input_text('url', 'URL', placeholder='http:// 주소', desc='유튜브, 네이버TV 등 동영상 주소') }}
    {{ macros.setting_input_text('filename', '파일명', value=arg['filename'], desc='템플릿 규칙은 https://github.com/ytdl-org/youtube-dl/#output-template 참고') }}
    {{ macros.setting_select('preset', '동영상 포맷 프리셋', arg['preset_list'], col='3') }}
    {{ macros.setting_input_text('format', '동영상 포맷', desc=['포맷 지정은 https://github.com/ytdl-org/youtube-dl/#format-selection 참고', '빈칸으로 두면 최고 화질로 다운로드합니다.']) }}
    {{ my_setting_select('postprocessor', '후처리', arg['postprocessor_list'], col='3', desc='다운로드 후 FFmpeg로 후처리합니다.') }}
    {{ macros.setting_buttons([['download_btn', '다운로드']]) }}
</form>

<script>
    "use strict";
    const package_name = '{{ arg["package_name"] }}';
</script>
<script src="https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js"></script>
<script src="{{ url_for('.static', filename='%s.js' % arg['template_name']) }}?ver={{ arg['package_version'] }}"></script>

{% endblock %}