{% extends "manage_base.html" %}
{% import "components/ui/v1.html" as ui_v1 %}
{% import "course_video_library_fields.html" as cvv_v1 %}
{% block manage_content %}
<main class="course-video-library ui-page ui-page--compact-type ui-stack">
  {% call ui_v1.page_header('添加视频') %}<a class="rounded button" href="{{ url('course_video_main') }}">返回视频库</a>{% endcall %}
  <section class="ui-panel">
    <header class="ui-panel__header"><h2 class="ui-panel__title">上传视频</h2></header>
    <div class="ui-panel__body">
      <form id="course-video-vod-upload-form" class="ui-stack" data-sign-url="{{ url('course_video_upload_sign') }}" data-complete-url="{{ url('course_video_upload_complete') }}" data-return-url="{{ url('course_video_main') }}">
        {{ cvv_v1.fields({}, folderTree) }}
        <label class="ui-field"><span class="ui-field__label">视频文件</span><input type="file" name="video" accept="video/*" required></label>
        <progress data-vod-upload-progress max="1" value="0" aria-label="上传进度" hidden></progress>
        <div role="status" aria-live="polite" data-vod-upload-state></div>
        <div class="ui-actions ui-actions--start"><button type="submit" class="rounded primary button">上传到 VOD</button></div>
      </form>
    </div>
  </section>
  <details class="ui-panel">
    <summary class="ui-panel__header">登记已有 VOD 视频</summary>
    <div class="ui-panel__body">
      <form method="post" class="ui-stack">
        <label class="ui-field"><span class="ui-field__label">VOD FileId {{ ui_v1.help('相同 FileId 再次登记会打开原视频，不会覆盖其名称、简介或状态。', 'FileId') }}</span><input name="fileId" class="textbox ui-field__control" required maxlength="80"></label>
        {{ cvv_v1.fields({}, folderTree) }}
        <div class="ui-actions ui-actions--start"><button name="operation" value="manual_create" type="submit" class="rounded primary button">登记视频</button></div>
      </form>
    </div>
  </details>
</main>
{% endblock %}