  {% extends 'TopxiaAdminBundle:CloudSetting:layout.html.twig' %}

{% block title %}云视频设置 - {{ parent() }}{% endblock %}

{% set submenu = 'video' %}
{% set script_controller = 'setting/cloud' %}

{% block maincontent %}

<div class="page-header"><h1>云视频设置</h1></div>

{{ web_macro.flash_messages() }}

<form class="form-horizontal" id="cloud-setting-form" method="post" novalidate>

  <div class="row form-group">
    <div class="col-md-3 control-label">
      <label >云视频</label>
    </div>
    <div class="controls col-md-8 radios">

      {{ radios('upload_mode', {'local':'关闭', 'cloud':'开启'}, storageSetting.upload_mode) }}

      <div class="help-block">
        云视频，提供更快的视频播放速度，以及更低廉的网络流量价格。<br />
        <strong class="text-info">如需使用云视频，请联系<a href="http://www.edusoho.com/services/cloudvideo" target="_blank">Edusoho官方</a></strong>。
      </div>

    </div>
  </div>


  <div class="row form-group">
    <div class="col-md-3 control-label">
      <label for="cloud_bucket" >云视频Bucket</label>
    </div>
    <div class="controls col-md-8 radios">
      <input type="text" id="cloud_bucket" class="form-control" name="cloud_bucket" value="{{storageSetting.cloud_bucket}}">
    </div>
  </div>

  <div class="row form-group">
    <div class="col-md-3 control-label">
      <label for="cloud_bucket" >云视频转码类型</label>
    </div>
    <div class="controls col-md-8 radios">
      <p>
        <span class="form-control-static text-info">画质</span>
        {{ radios('video_quality', {'low':'流畅 <span class="text-muted">(适合PPT讲解)</span>', 'normal':'标准 <span class="text-muted">(适合屏幕录制、摄像头拍摄)</span>', 'high': '精细 <span class="text-muted">(适合动态电影)</span>'}, storageSetting.video_quality) }}
      </p>

      <p>
        <span class="form-control-static text-info">音质</span>
        {{ radios('video_audio_quality', {'low':'流畅', 'normal':'标准', 'high': '高品'}, storageSetting.video_audio_quality) }}
      </p>

    </div>
  </div>



  <hr>

  <div class="row form-group">
    <div class="col-md-3 control-label">
      <label>云视频水印</label>
    </div>
    <div class="controls col-md-8 radios " data-content="123">
      {# {{ radios('video_watermark', {'0':'关闭', '1':'开启播放器水印', '2':'开启内嵌水印'}, storageSetting.video_watermark) }} #}

      <label>
        <input type="radio" name="video_watermark" value="0" {% if storageSetting.video_watermark == 0 %}checked="checked"{% endif %}> 关闭
      </label>
      <label class="video-watermark-property-tips" data-content="
      播放时水印将会覆盖在视频上，可随时更换；
      已经通过系统使用了内嵌水印的视频，将不会显示播放器水印。
      ">
        <input type="radio" name="video_watermark" value="1" {% if storageSetting.video_watermark == 1 %}checked="checked"{% endif %}> 开启播放器水印
      </label>
      <label class="video-watermark-property-tips" data-content="
      能够更好的保护视频版权；
      上传时将水印嵌入视频编码中，不可删改；
      未嵌入水印的视频在播放时将会显示播放器水印。
      ">
        <input type="radio" name="video_watermark" value="2" {% if storageSetting.video_watermark == 2 %}checked="checked"{% endif %}> 开启内嵌水印
      </label>
    </div>
  </div>

  <div class="row form-group">
    <div class="col-md-3 control-label">
      <label>设置播放器水印图片</label>
    </div>
    <div class="controls col-md-8 radios">

      <div id="cloud-video-watermark-container">{% if storageSetting.video_watermark_image %}<img src="{{ file_url(storageSetting.video_watermark_image) }}">{% endif %}</div>
      <button class="btn btn-default" id="cloud-video-watermark-upload" type="button" data-url="{{ path('admin_setting_cloud_video_watermark_upload') }}">上传</button>
      <button class="btn btn-default" id="cloud-video-watermark-remove" type="button" data-url="{{ path('admin_setting_cloud_video_watermark_remove') }}" {% if not storageSetting.video_watermark_image %}style="display:none;"{% endif %}>删除</button>

      <div class="help-block">支持png/gif/jpg格式图片，建议使用半透明的png图片。（推荐图片大小为150×50）</div>
      <input type="hidden" name="video_watermark_image" value="{{ storageSetting.video_watermark_image }}">
    </div>
  </div>

  <div class="row form-group">
    <div class="col-md-3 control-label">
      <label>设置内嵌水印图片</label>
    </div>
    <div class="controls col-md-8 radios">

      <div id="cloud-video-embed-watermark-container">{% if storageSetting.video_embed_watermark_image %}<img src="{{ file_url(storageSetting.video_embed_watermark_image) }}">{% endif %}</div>
      <button class="btn btn-default" id="cloud-video-embed-watermark-upload" type="button" data-url="{{ path('admin_setting_cloud_video_embed_watermark_upload') }}">上传</button>
      <button class="btn btn-default" id="cloud-video-embed-watermark-remove" type="button" data-url="{{ path('admin_setting_cloud_video_embed_watermark_remove') }}" {% if not storageSetting.video_embed_watermark_image %}style="display:none;"{% endif %}>删除</button>

      <div class="help-block">支持png/gif/jpg格式图片，建议使用半透明的png图片（推荐图片大小为270×90）。</div>
      <input type="hidden" name="video_embed_watermark_image" value="{{ storageSetting.video_embed_watermark_image }}">
    </div>
  </div>

  <hr>

  <div class="row form-group" >
    <div class="col-md-3 control-label">
      <label>云视频指纹</label>
    </div>  
    <div class="controls col-md-8 radios">
      {{ radios('video_fingerprint', {'0':'关闭', '1':'开启'}, storageSetting.video_fingerprint) }}
      <div class="help-block">开启后，将在视频播放中随机时间、随机位置显示当前网站域名及学生的昵称。</div>
    </div>
  </div>
  {% if storageSetting.upload_mode == 'cloud' %}

  <hr>

  <div class="row form-group">
    <div class="col-md-3 control-label" >
      <label>云视频片头</label>
    </div>

    <div class="controls col-md-8 radios">
      {{ radios('video_header', {'0':'关闭', '1':'开启'}, storageSetting.video_header|default(0)) }}
    </div>
  </div>
  <div class="row form-group" id="upload-panel"
  data-params-url="{{ path('admin_uploadfile_head_leader_params', {storage:storageSetting.upload_mode}) }}"
  data-hls-encrypted="1"
  >
    <div class="col-md-3" >
    </div>
    <div class="controls col-md-8">


      <div class="file-chooser-bar" 
        {% if not storageSetting.video_header|default(null) %}
        style="display:none;"
        {% endif %}
        >
        <span data-role="placeholder">{{headLeader.filename|default('')}}</span>
        <button class="btn btn-link btn-sm edit-btn" type="button"><i class="glyphicon glyphicon-edit"></i> 编辑</button>
        {% if headLeader.convertStatus|default(null) != 'success' %}
        <div class="alert alert-warning" data-role="waiting-tip">
        正在转换视频格式，转换需要一定的时间，期间将不能播放该视频。<br />转换完成后将以站内消息通知您。
        </div>
        {% endif %}

      </div>

      <div class="file-chooser-main" 
        {% if storageSetting.video_header|default(null) %}
        style="display:none;"
        {% endif %}
      >
        <div class="file-chooser-uploader-control">
          <span id="video-choose-uploader-btn"
            data-role="uploader-btn"
            data-filetypes="{% if storageSetting.upload_mode == 'cloud' %}*.mp4;*.avi;*.flv;*.wmv;*.mov{% else %}*.mp4{% endif %}"
            data-button-image="{{ asset('assets/img/common/swfupload-btn.png') }}"
            data-callback="{% if storageSetting.upload_mode == 'cloud' %}{{ path('uploadfile_cloud_callback', {targetType:'headLeader', targetId:0}) }}{% endif %}" 
            data-progressbar="#video-chooser-progress"
            data-storage-type="{{storageSetting.upload_mode}}"
            data-get-media-info="{{path('uploadfile_cloud_get_media_info',{type:'video'})}}"
            >
            <a class="uploadBtn btn btn-default btn-lg" >
              上传
            </a>
            </p>
            <div style="display:none">
              <input data-role="fileSelected" class="filePrew" type="file" />
            </div>
          </span>
        </div>
        <div class="progress" id="video-chooser-progress" style="display:none;">
          <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;">
          </div>
        </div>

        <div class="alert alert-info">
          <ul>
            <li>支持<strong>mp4, avi, flv, wmv, mov</strong>格式的视频文件上传，文件大小不能超过<strong>10 MB</strong>。</li>
            <li>支持<strong>断点续传</strong>（仅支持HTML5浏览器）。</li>
            <li>视频将上传到<strong>云视频服务器</strong>，上传后会对视频进行格式转换，转换过程需要一定的时间。</li>
          </ul>
        </div>
      </div>
    </div>
  </div>
  {% endif %}

  <div class="row form-group">
    <div class="col-md-3 control-label"></div>
    <div class="controls col-md-8">
      <button type="submit" class="btn btn-primary">提交</button>
    </div>
  </div>

  <input type="hidden" name="_csrf_token" value="{{ csrf_token('site') }}">
</form>

{% endblock %}