{% set selectionLength = records|length %}

{% set nbHdSubstitute = 0 %}
{% set nbSubdefSubstitute = 0 %}

{% for record in records %}
  {% set subdefs = record.get_subdefs() %}
  {% if subdefs|length > 0 %}
    {% for key, subdef in subdefs if subdef.is_substituted() %}
      {% if key == 'document' %}
        {% set nbHdSubstitute = nbHdSubstitute + 1 %}
      {% else %}
        {% set nbSubdefSubstitute = nbSubdefSubstitute + 1 %}
      {% endif%}

    {% endfor %}
  {% endif %}
{% endfor %}

<div id='prod-tool-box' class="PNB10">

    {# jquery Tabs #}
    <div id="tool-tabs"  class="tabs tool-modal-wrapper">
        {# jquery menu #}
        <div>
            <ul>
                <li>
                    <a href="#subdefs">
                        {{ "regeneration of sub-definitions" | trans }}
                    </a>
                </li>
                <li>
                    <a href="#image">
                        {{ "image tool" | trans }}
                    </a>
                </li>
                {% if selectionLength == 1 and (app['conf'].get(['registry', 'modules', 'doc-substitution']) or app['conf'].get(['registry', 'modules', 'thumb-substitution'])) %}
                    <li>
                        <a href="#substitution">
                            {{ "substitution" | trans }}
                        </a>
                    </li>
                {% endif %}
                {% if metadatas %}
                    <li>
                        <a class="tool-metadata" href="#exiftool">
                            {{ "meta-datas" | trans }}
                        </a>
                    </li>
                {% endif %}
                {% if selectionLength == 1%}
                    {% if recordSubdefs %}
                        <li>
                            <a href="#tools-sharing">
                                {{ "Document Type Sharing" | trans }}
                            </a>
                        </li>
                    {% endif %}
                {% endif %}
            </ul>
        </div>
        {# subdef section #}
        <div id="subdefs" class="tabBox">
            <form id="new-img-form" action="{{ path('prod_tools_image') }}" method="post">
                <fieldset style='border:1px solid #999; padding:20px;'>
                    <legend>&nbsp;<b>{{ "Reconstruire les sous definitions" | trans }}</b>&nbsp;</legend>
                    {% if nbSubdefSubstitute > 0 %}
                        <div style="color:#A00;">
                            {{ "Attention, certain documents ont des sous-definitions substituees" | trans }}
                        </div>
                        <label for="FTS" class="checkbox">
                            <input type="checkbox" name="force_substitution" value="1" id="FTS" />
                            {{ "Forcer la reconstruction sur les enregistrements ayant des thumbnails substituees" | trans }}
                        </label>
                        <br/>
                    {% else %}
                        <input type="hidden" name="force_substitution" value="1">
                    {% endif %}
                    <div>
                        <p>
                            {{ 'Are you sure you want to rebuild the sub-definitions of selected records?' | trans }}
                        </p>
                    </div>
                    <input type="hidden" name="ACT" value="SEND" />
                    <input type="hidden" name="lst" value="{{records.serializedList()}}" />
                </fieldset>
                <div style='text-align:right;padding-top:10px;'>
                    <button class="action_submiter btn btn-inverse" type="button">{{ "validate" | trans }}</button>
                    <button class="action_cancel btn btn-inverse" type="button">{{ "cancel" | trans }}</button>
                </div>
                <div class="confirm_block text-center hide" style="margin-top: 45px;">
                    <span class="alert alert-info">
                        {{ 'prod::tool:recreatesubviews: warning for rebuild sub-definitions' | trans }}
                    </span></div>
            </form>
        </div>

    <div id="image" class="tabBox">
      <div class="text-info">
          <i class="fa fa-info-circle" aria-hidden="true"></i> {% trans %}Changes for rotation will be applied only on
          the sub-definitions of "image" type.{% endtrans %}
      </div>
      <form name="formpushdoc" action="{{ path('prod_tools_rotate') }}" method="post">
        <fieldset style='border:1px solid #999;padding:20px;'>
          <legend>&nbsp;<b>{{ "image rotation" | trans  }}</b>&nbsp;</legend>
            <label for="ROTA_90" class="radio">
                <input type="radio" name="rotation" id="ROTA_90" value="90" checked="checked">
                {{ "rotation 90 degres horaire" | trans }}
            </label>
            <br />
            <label for="ROTA_C90" class="radio">
                <input type="radio" name="rotation" id="ROTA_C90" value="-90">
                {{ "rotation 90 degres anti-horaires" | trans }}
            </label>
            <input type="hidden" name="lst" value="{{records.serializedList()}}" />
            <input type="hidden" name="element" value="" />
            <input type="hidden" name="cchd" value="" />
        </fieldset>
        <div style='text-align:right;padding-top:10px;'>
          <button class="action_submiter btn btn-inverse">{{ "validate"|trans }}</button>
          <button class="action_cancel btn btn-inverse">{{ "cancel"|trans }}</button>
        </div>
      </form>
    </div>

    {# hd sub section #}
    {% if selectionLength == 1 and (app['conf'].get(['registry', 'modules', 'doc-substitution']) or app['conf'].get(['registry', 'modules', 'thumb-substitution'])) %}
      {% for record in records %}
        <div id="substitution" class="tabBox">

         {% if "unknown" == record.get_type() %}
             <i class="fa fa-exclamation-triangle icon-white"
                aria-hidden="true"></i>{{ "Substitution is not possible for this kind of record" | trans }}
         {% else %}
            {% if app['conf'].get(['registry', 'modules', 'doc-substitution']) %}
                <div id="substitution-hd">
                  <form
                    name ="formchgHD"
                    action="{{ path('prod_tools_hd_substitution') }}"
                    enctype="multipart/form-data"
                    method="post"
                    target="uploadHdsub">

                    <fieldset style='border:1px solid #999;padding:20px;'>
                      <legend>&nbsp;<b>{{ "substitution HD" | trans }}</b>&nbsp;</legend>
                      <div>
                        <input id='new-hd-file' name="newHD" type="file"/>
                        <br />
                        <label for="CCFNALP" class="checkbox">
                            <input type="checkbox" name="ccfilename" id="CCFNALP" value="1">
                            {{ "mettre a jour le nom original de fichier apres substitution" | trans }}
                        </label>
                        <input type="hidden" name="ACT" value="SEND" />
                        <input type="hidden" name="sbas_id" value="{{record.get_sbas_id()}}"/>
                        <input type="hidden" name="record_id" value="{{record.get_record_id()}}" />
                        <div class="load"></div>
                      </div>
                    </fieldset>
                    <div style='text-align:right;padding-top:10px;'>
                      <button class="iframe_submiter btn btn-inverse">{{ "validate" | trans }}</button>
                      <button class="action_cancel btn btn-inverse">{{ "cancel" | trans }}</button>
                    </div>
                  </form>
                  <div class='resultAction'></div>
                </div>
              {% endif %}

              {% if app['conf'].get(['registry', 'modules', 'thumb-substitution']) %}
                <div id="substitution-sd">
                  <form
                    name="formchgHD"
                    action="{{ path('prod_tools_thumbnail_substitution') }}"
                    enctype="multipart/form-data"
                    method="post"
                    target="uploadHdsub">
                    <fieldset style='border:1px solid #999;padding:20px;'>
                      <legend>&nbsp;<b>{{ "substitution SD" | trans }}</b>&nbsp;</legend>
                      <div>
                        <input id='new-sd-file' name="newThumb" type="file" />
                        <input type="hidden" name="sbas_id" value="{{record.get_sbas_id()}}" />
                        <input type="hidden" name="record_id" value="{{record.get_record_id()}}" />
                        <div class="load"></div>
                      </div>
                    </fieldset>
                    <div style='text-align:right;padding-top:10px;'>
                      <button class="iframe_submiter btn btn-inverse">{{ "validate" | trans }}</button>
                      <button class="action_cancel btn btn-inverse">{{ "cancel" | trans }}</button>
                    </div>
                  </form>
                  <div class='resultAction'></div>
                </div>
              {% endif %}
         {% endif %}
        </div>
      {% endfor %}
    {% endif %}

    {# exiftool section #}
    {% if metadatas %}
        <div id="exiftool"  class="tabBox">
            <div class="metadatas-top-block">
                <select id="select-meta-subdef" name="metaSubdef" class="input-medium check-filters">
                    <option value="" disabled >{{"prod::tool:select subdef" | trans}}</option>
                    {% if listsubdef is defined and listsubdef is not null %}
                        {% for subdef in listsubdef %}
                        <option value= "{{ subdef }}" {{ subdef== 'document'? 'selected' : 'false' }}>{{ subdef }}</option>
                        {% endfor %}
                    {% endif %}
                </select>
            </div>
            <div id="metadata-load" style="height: 100%"></div>
            <div id="metadata-content"></div>
        </div>
    {% endif %}
        {% if selectionLength == 1 and recordSubdefs is not empty %}
            <div id="tools-sharing" class="tabBox">
                <div class="well-large">
                    {% for subdef in recordSubdefs %}
                        <div class="row-fluid tools-sharing-row">
                            <div class="span6 tools-sharing-title">
                                <span class="status-marker {{ subdef.state ? 'status-active' : 'status-inactive' }}"></span>{{ subdef.label }}
                            </div>
                            <div class="span6 text-right">
                                    <button type="button" class="tools-sharing-btn stateChange_button btn btn-inverse text-right"
                                            data-name="{{ subdef.name }}" data-state="{{ subdef.state }}">
                                        {% if subdef.state %}
                                            {{- "Disable document type sharing"|trans -}}
                                        {% else %}
                                            {{- "Enable document type sharing"|trans -}}
                                        {% endif %}
                                    </button>
                            </div>
                        </div>
                    {% endfor %}
                </div>
            </div>
        {% endif %}
  </div>

  {# hidden iframe to handle upload #}
  <iframe
    id="uploadHdsub"
    name="uploadHdsub"
    height="0"
    width="0"
    border="0"
    >
  </iframe>
</div>

<script type="text/javascript">
    var toolsConfig = {
        selectionLength: {{ selectionLength }},
        databaseId: {% if selectionLength == 1%}{{record.get_base_id}}{% else %}0{% endif %},
        translations: {
            alertTitle: '{{ "alert" | trans }}',
            noImgSelected: '{{ "no image selected" | trans }}',
            processing: '{{ "processing" | trans }}',
            thumbnailTitle: '{{ 'thumbnail validation' | trans }}',
        },
        records: [

            {% for record in records %}
            {
                id: {{ record.get_record_id }},
                type: "{{ record.get_type() }}",
                {% if record.get_type() == 'video' %}
                {% if selectionLength == 1 %}
                {% set outputFormats = record.getSubdfefByDeviceAndMime(null, ['image/jpeg', 'image/png']) %}
                {% set previewHtml5 = record.getSubdfefByDeviceAndMime(constant('\\databox_subdef::DEVICE_SCREEN'), ['video/ogg', 'video/mp4', 'video/webm']) %}
                {% set dataW = constant('media_subdef::TC_DATA_WIDTH') %}
                {% set dataH = constant('media_subdef::TC_DATA_HEIGHT') %}

                {% set technical_info = record.get_technical_infos %}
                {% set width = technical_info[dataW].value %}
                {% set height = technical_info[dataH].value %}

                {% if width and height %}
                    {% set ratio = (width / height)|number_format(2, '.') %}
                {% else %}
                    {% set ratio = '' %}
                {% endif %}

                sources: [
                    {% for subdef in previewHtml5 %}
                    {
                        ratio: '{{ ratio }}',
                        framerate: {{ record.exif[constant('media_subdef::TC_DATA_FRAMERATE')] | round(2) }},
                        type: "{{ subdef.get_mime() }}",
                        src: "{{ subdef.get_url() }}"
                    }{% if not loop.last %},{% endif %}
                    {% endfor %}
                ]
                {% endif %}
                {% endif %}
            }{% if not loop.last %},{% endif %}
            {% endfor %}
        ]

    };

    {% if record is not null %}
    function loadMetadataTab (url) {
        console.log(url);
        $.ajax({
            "url": url,
            "type": "GET",
            beforeSend: function () {
                $('#metadata-content').empty();
                $('#metadata-load').removeClass('hidden').addClass('loading');
            },
            success: function (data) {
                $('#metadata-load').removeClass('loading').addClass('hidden');
                $('#metadata-content').append(data);
            }
        });
    }
        $(document).ready(function(){
            /**load default Subdef info **/
            loadMetadataTab( '{{ path('prod_subdefs_metadata', {'databox_id': record.get_sbas_id(), 'record_id': record.get_record_id, 'subdef_name': 'document'  }) }}');
            $('.tool-modal-wrapper .tabBox').height($('#prod-tool-box').height() - 61 );
            $('#exiftool').height($('#prod-tool-box').height() - 55 );
            /**load selected Subdef info **/
            $('#select-meta-subdef').on('change', function (e) {
                var selectedSubdef = $(this).children('option:selected');
                if (selectedSubdef.val() !== "") {
                   var url = '{{ path('prod_subdefs_metadata', {'databox_id': record.get_sbas_id(), 'record_id': record.get_record_id, 'subdef_name': 'subdefName'  }) }}';
                   url = url.replace("subdefName", selectedSubdef.val() );
                   loadMetadataTab(url);
                }
            });
        });
    {% endif %}
</script>