<script src="/siofu/client.js"></script>
<script src="/socket.io/socket.io.js"></script>
 <div class="form theme-form">
     
    <div class="row">
       <div class="col">
         <div class="mb-3">
           
          
             <div  style="text-align: center" id="file_drop" dropzone="copy" class="dropzone dz-message needsclick"> <i class="fa-regular fa-square-plus" style="color: #4d22b3;" onclick="document.getElementById('upload_input').click()"></i>
                <h6>بارگذاری فایل در آلبوم  </h6><span class="note needsclick">جهت آپلود فایل میتوانید فایل های خود را بکشید و در این قسمت رها کنید</span>
             
              </div>
           
         </div>
       </div>
     </div>
     <div class="row">
       <div class="col">
        <button class="btn btn-primary" type="button" data-bs-toggle="modal" data-bs-target="#buttonPublicAlbumSelectFiles">آلبوم عمومی</button>
        <button class="btn btn-warning" type="button" data-bs-toggle="modal" data-bs-target="#buttonPrivateAlbumSelectFiles">آلبوم اختصاصی</button>
         
          <button class="btn btn-danger-gradien" type="button" title="انتخاب فایل" onclick="document.getElementById('upload_input').click()">انتخاب فایل</button>
          
          <input accept=".jpg, .png, .jpeg, .gif, .bmp, .tif, .tiff|image/*" type="file" multiple id="upload_input" style="display:none"/>
        
         
      
  
          <label>جهت انتخاب فایل میتوانید بر روی گزینه انتخاب فایل کلیک کنید</label>
       </div>
     </div>
     <div class="card-body progress-showcase row">
        <div class="col"  id="uplodProgressBarParrent" >
       
          
          
           </div>
      </div>
     
   </div>
  
  <div id="FilesDiv" class="gallery my-gallery card-body row FilesDiv" itemscope="">
<% try {%>
  
    <% for(var i=0; i<files.length; i++) {%>
    <div style='width: 200px;height: 200px;'><figure style='width: 200px;height: 200px' class='col-xl-3 col-md-4 col-6 FilesFigure' itemprop='associatedMedia'><img class='img-thumbnail'style='width: 200px;height: 200px;' src='<%= files[i].Url %>' itemprop='thumbnail' alt='Image description'></figure><button class='btn btn-primary btnRemoveFile'type='button' style='width:80% ;position: absolute;bottom: 5px;right: 30px;'data-address='<%= files[i]._id %>'> حذف تصویر</button></div>
    <% } %>
  
  <% } catch(e){%>
  
     
  <% }%>
  </div>
          



<div id="AlbumFiles">
  
 <% try {%>
  <% for(var i=0; i<files.length; i++) {%>
      <input type='text' name='Files' id='<%= files[i]._id %>' class='d-none' value='<%= files[i]._id %>'>
   
  <% } %>
   
  <% } catch(e){%>
  
     
  <% }%>

</div>