{% extends "admin/base.html" %}

{% load i18n static admin_tags %}

{% block title %} Papermerge | {% trans "Documents" %} {% endblock %}

{% comment %}
  beautiful refresh feature BEGIN
{% endcomment %}
{% block animated_opacity_content_wrapper %}
  animated-opacity
{% endblock %}

{% block animated_opacity_main_header %}
  animated-opacity
{% endblock %}

{% block animated_opacity_main_sidebar %}
  animated-opacity
{% endblock %}
{% comment %}
  beautiful refresh feature END
{% endcomment %}

{% block actions %}
<div class="col-12 d-flex justify-content-between p-0 mb-2 xmain-actions-row">
  <div id="actions">
   <ul  class="nav nav-pills">
     <li class="mx-1">
         <button type="button" id="id_btn_upload" class="btn btn-light btn-bordered ">
            <i class="fa fa-upload mr-1  text-success"></i>
            <div class="d-none d-md-inline-block">
              {% trans "Upload" %}
            </div>
          </button>
     </li>
     <!-- Hidden input required for file uploads-->
     <input type="file"
       name="file_name"
       id="id_file_name"
       multiple="true"
       hidden="true"
     />
     {% if has_perm_new_folder %}
       <li class="mx-1">
           <!--parent_id=object.id -->
           <button id="new-folder" data-target-id="new-folder-form" class="new-folder btn btn-light btn-bordered">
              <i class="fa fa-plus mr-1 text-success"></i>
              <div class="d-none d-md-inline-block">
                {% trans "New Folder" %}
              </div>
           </button>
       </li>
     {% endif %}
  </ul>
  </div> <!-- #actions -->
  <div id="display-mode" class="d-flex flex-row  align-items-center">
  </div> <!--  #display-mode -->
</div>
{% endblock %}

{% block breadcrumb %}
    <div id="breadcrumb" class="col-sm-12 pl-0">
    </div><!-- /.col -->
{% endblock %}

{% block modals %}
    {% include 'admin/_forms.js.html' %}
{% endblock modals %}

{% block document_browser %}
  document-browser
{% endblock document_browser %}

{% block content %}
  <div class="container-fluid pl-0 xmain-browser-row">
      <div id="browse">
      </div> <!-- .browse -->
      <div id="pagination-view">
      </div>
    <!-- /.row -->
  </div><!-- /.container-fluid -->
  <div id="pre-loader">
    <img src="{% static 'admin/img/pre-loader/loader-03.svg' %}" alt="">
  </div>
  <ul id="context-menu" class="dropdown-menu">
    <li class="new-folder dropdown-item">
      <a><i class="fa fa-plus mx-2"></i>{% trans "New Folder" %}</a>
    </li>
    <!-- download one or multiple nodes -->
    <li class="dropdown-item disabled" id="download-nodes">
      <a><i class="fa fa-download mx-2"></i>{% trans "Download" %}</a>
    </li>
   <li class="dropdown-item disabled" id="cut">
       <a><i class="fa fa-cut mx-2 "></i>{% trans "Cut" %}</a>
   </li>
   <!-- PASTE BEGIN -->
   <li class="nav-item dropright dropdown-submenu dropdown fl fl-i-center">
       <a class="dropdown-item dropdown-toggle" href="#" id="paste-dropdown" data-toggle="dropdown">
           <i class="fa fa-paste mx-2"></i>
           {% trans "Paste" %}
       </a>
     <ul class="dropdown-menu" aria-labelledby="paste-dropdown">
       <li class="dropdown-item" id="paste">
         <a>{% trans "Documents & Folders" %}</a>
       </li>
       <li class="dropdown-item" id="paste_pages">
         <a>{% trans "Pages" %}</a>
       </li>
     </ul>
   </li>
   <!-- PASTE END -->
   <!-- SELECTION BEGIN -->
   <li class="nav-item dropright dropdown-submenu dropdown fl fl-i-center">
       <div class="dropdown actions">
         <a class="dropdown-item dropdown-toggle" href="#" id="paste-dropdown" data-toggle="dropdown">
             <i class="fa fa-expand mx-2"></i>
             {% trans "Selection" %}
         </a>
         <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
            <li class="dropdown-item" id="select_all_menu_item">
                <a>{% trans "All" %}</a>
            </li>
            <li id="select_folders_menu_item" class="dropdown-item">
                <a>{% trans "Folders" %}</a>
            </li>
            <li id="select_documents_menu_item" class="dropdown-item">
                <a>{% trans "Documents" %}</a>
            </li>
            <li id="deselect_menu_item" class="dropdown-item">
                <a></i>{% trans "Deselect" %}</a>
            </li>
            <li id="invert_selection_menu_item" class="dropdown-item">
                <a></i>{% trans "Invert Selection" %}</a>
            </li>
         </ul>
       </div>
   </li>
   <!-- SELECTION END -->
   <li id="tags-menu-item" class="dropdown-item disabled">
       <a><i class="fa fa-tag mx-2"></i>{% trans "Tags" %}</a>
   </li>
   <li  id="rename" class="dropdown-item disabled">
       <a><i class="fa fa-edit mx-2"></i>{% trans "Rename" %}</a>
   </li>
   <li  id="run-ocr" class="dropdown-item disabled">
       <a><i class="fa fa-redo mx-2"></i>{% trans "Run OCR" %}</a>
   </li>
   {% if has_perm_access_feature %}
     <li id="access" class="dropdown-item disabled">
         <a><i class="fa fa-users mx-2"></i>{% trans "Access" %}</a>
     </li>
   {% endif %}
   <li class="dropdown-divider"></li>
   <li id="delete" class="dropdown-item disabled">
       <a><i class="fa fa-times mx-2 "></i>{% trans "Delete" %}</a>
   </li>
  </ul>
{% endblock %}

{% block widgetsbar %}
  <div class="card">
    <div class="card-body">
      <ul class="collection">
        <li class="collection-item">
          <label>{% trans "OCR Language" %}</label>
          {% ocr_language_select user %}
        </li>
      </ul>
    </div>
  </div>
  <!-- client managed -->
  <div id="widgetsbar">

  </div>

{% endblock %}