nineskeletor/templates/File/list.html.twig

347 lines
15 KiB
Twig
Raw Normal View History

2023-02-01 09:03:27 +01:00
{% extends 'base.html.twig' %}
{% block localstyle %}
<style>
body { height:auto;}
#page { padding: 0px !important;}
.btn-group>.btn, .btn-group>.btn:active{
background-color: var(--colorbgbodydark);
border: var(--colorbgbodydark);
}
.btn-group>.btn:active{
background-color: var(--colorbgbodydark-darker);
border: var(--colorbgbodydark);
}
.item-small .item-subtitle, .item-list .item-subtitle {
display:block;
}
.item-small .item-subtitle {
font-size:9px;
}
.item-small img {
width:60px;
}
.item-list {
zoom:80%;
}
.item-list img {
width:40px;
}
.breadcrumb {
padding: 5px 10px;
margin: 5px 0px 5px 0px;
list-style: none;
border-radius: 4px;
background-color: var(--colorbgbodydark);
display: inline-flex;
}
.breadcrumb a {
color: var(--colorftbodydark);
}
.item-action .btn-modal {
color: inherit;
}
</style>
{% endblock %}
{% block body %}
<div id="explorer">
<div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups">
{% if canadd and not fgtrash %}
<div class="btn-group me-1" role="group" aria-label="First group">
<button type="button" class="btn btn-modal btn-primary"data-modalid="mymodalfull" data-modaltitle="Téléchargez vos Fichiers" data-modalurl="{{ path('app_'~access~'_file_upload',{'category': category, 'id': id,'type':'file','usage':usage,'folder':folder}) }}" title="Ajouter des fichiers">
<i class="fa fa-upload"></i>
</button>
<button type="button" class="btn btn-modal btn-primary"data-modalid="mymodalfull" data-modaltitle="Création Répertoire" data-modalurl="{{ path('app_'~access~'_file_folder',{'category': category, 'id': id,'usage':usage,'folder':folder}) }}" title="Ajouter un Répertoire">
<i class="fa fa-folder-plus"></i>
</button>
</div>
{% endif %}
<div class="btn-group me-1" role="group" aria-label="Second group">
{% if view=="small" %}
{%set action="list" %}
{% else %}
{%set action="small" %}
{% endif %}
<a href="{{ path('app_'~access~'_file_list',{'category': category, 'id': id,'type':'file','usage':usage,'folder':folder, 'view':action }) }}" type="button" class="btn btn-primary">
{% if view=="small" %}
<i class="fas fa-list"></i>
{% else %}
<i class="fas fa-th"></i>
{% endif %}
</a>
{% set active="" %}
{% if sort=="name" %}
{% set active="active" %}
{%endif%}
{% if order=="SORT_ASC" %}
{%set action="SORT_DESC" %}
{% else %}
{%set action="SORT_ASC" %}
{% endif %}
<a href="{{ path('app_'~access~'_file_list',{'category': category, 'id': id,'type':'file','usage':usage,'folder':folder, 'sort': 'name', 'order':action }) }}" type="button" class="btn btn-primary {{active}}">
{% if order=="SORT_ASC" %}
<i class="fas fa-long-arrow-alt-down"></i> Nom
{% else %}
<i class="fas fa-long-arrow-alt-up"></i> Nom
{% endif %}
</a>
{% set active="" %}
{% if sort=="date" %}
{% set active="active" %}
{%endif%}
{% if order=="SORT_ASC" %}
{%set action="SORT_DESC" %}
{% else %}
{%set action="SORT_ASC" %}
{% endif %}
<a href="{{ path('app_'~access~'_file_list',{'category': category, 'id': id,'usage':usage,'folder':folder, 'sort': 'date', 'order':action }) }}" type="button" class="btn btn-primary {{active}}">
{% if order=="SORT_ASC" %}
<i class="fas fa-long-arrow-alt-down"></i> Date
{% else %}
<i class="fas fa-long-arrow-alt-up"></i> Date
{% endif %}
</a>
</div>
{% if canadd %}
<div class="btn-group" role="group" aria-label="Third group">
{% if fgtrash %}
<a href="{{ path('app_'~access~'_file_purgetrash',{'category': category, 'id': id ,'usage':usage}) }}" type="button" class="btn btn-primary" data-method="delete" data-confirm="Souhaitez-vous purger votre poubelle ? Cette action sera irrévocable.">Purger la poubelle</a>
{% else %}
<a href="{{ path('app_'~access~'_file_list',{'category': category, 'id': id,'usage':usage,'folder':'file/'~category~'/'~id~'/.trash/' }) }}" type="button" class="btn btn-primary"><i class="fas fa-trash"></i></a>
{% endif %}
</div>
{% endif %}
</div>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
{% for parent in parents %}
<li class="breadcrumb-item folder" data-src="{{parent.folder}}"><a href="{{ path('app_'~access~'_file_list',{'category': category, 'id': id,'usage':usage,'folder': parent.folder }) }}">{{ parent.basename}}</a></li>
{% endfor %}
</ol>
</div>
<div class="items-list">
{% for dir in folders %}
<div class="item item-{{view}} folder" data-src="{{dir.Prefix}}" style="background-color: var(--colorbgbodydark);">
<div class="item-container">
<div class="item-content">
<a class="item-link" href="{{ path('app_'~access~'_file_list',{'category': category, 'id': id,'usage':usage,'folder':dir.Prefix }) }}">
<img height="35" src="{{ dir.thumb }}">
<div class="item-title">
<h3>{{ dir.basename }}</h3>
</div>
</a>
<div class="item-action">
{% if canadd %}
{% if fgtrash %}
<a style="display:none" onClick="restaureFile('{{dir.Prefix|e('js')|raw }}')">
<i class="fa fa-undo" title="Restaurer le fichier"></i>
</a>
<a style="display:none" onClick="delFile('{{dir.Prefix|e('js')|raw }}')">
<i class="fa fa-trash" title="Supprimer le dossier"></i>
</a>
{% else %}
<a style="display:none" class="btn-modal" title="Modifier" data-modalid="mymodalfull" data-modaltitle="Modification" data-modalurl="{{ path('app_'~access~'_file_rename',{'category': category, 'id': id,'usage':usage,'file':dir.Prefix}) }}">
<i class="fas fa-file"></i>
</a>
<a style="display:none" onClick="trashFile('{{dir.Prefix|e('js')|raw}}')">
<i class="fas fa-trash" title="Supprimer le dossier"></i>
</a>
{% endif %}
{% endif %}
</div>
</div>
</div>
</div>
{% endfor %}
{% for file in files %}
<div class="item item-{{view}} file" style="background-color: var(--colorbgbodydark);" data-src="{{file.Key}}">
<div class="item-container">
<div class="item-content">
<a class="item-link" href="{{ path('app_'~access~'_file_show',{'category': category, 'id': id,'file':file.Key }) }}" target="_blank">
<img height="35" src="{{ file.thumb }}">
<div class="item-title">
<h3>{{ file.basename }}</h3>
<div class="item-subtitle">le {{ file.LastModified|date("d/m/Y H:i")}}</div>
</div>
</a>
<div class="item-action">
{% if canadd %}
{% if fgtrash %}
<a style="display:none" onClick="restaureFile('{{file.Key|e('js')|raw }}')">
<i class="fa fa-undo" title="Restaurer le fichier"></i>
</a>
<a style="display:none" onClick="delFile('{{file.Key|e('js')|raw }}')">
<i class="fa fa-trash" title="Supprimer le dossier"></i>
</a>
{% else %}
<a style="display:none" class="btn-modal" title="Modifier" data-modalid="mymodalfull" data-modaltitle="Modification" data-modalurl="{{ path('app_'~access~'_file_rename',{'category': category, 'id': id,'usage':usage,'file':file.Key}) }}">
<i class="fas fa-file"></i>
</a>
<a style="display:none" onClick="trashFile('{{file.Key|e('js')|raw}}')">
<i class="fas fa-trash" title="Supprimer le dossier"></i>
</a>
{% endif %}
{% endif %}
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
<div id="mymodalfull" class="modal" tabindex="-1">
<div class="modal-dialog modal-fullscreen">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title"></h4>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<iframe frameborder=0 width="100%" style="min-height:300px;"></iframe>
</div>
</div>
</div>
</div>
{% endblock %}
{% block localscript %}
<script>
$('#mymodalfull').on('shown.bs.modal', function() {
$("#framefile-{{id}}",window.parent.document).css("min-height",$("#mymodalfull").find("iframe").height()+130);
$("#framefile-{{id}}",window.parent.document).parent().css("min-height",$("#mymodalfull").find("iframe").height()+130);
});
$('#mymodalfull').on('hide.bs.modal', function() {
$("#framefile-{{id}}",window.parent.document).css("min-height","unset");
$("#framefile-{{id}}",window.parent.document).parent().css("min-height","unset");
});
$(window).on('load', function(){
$("#framefile-{{id}}",window.parent.document).css("min-height","unset");
$("#framefile-{{id}}",window.parent.document).parent().css("min-height","unset");
});
{% if canadd %}
// Trasher un fichier
function trashFile(file) {
var r = confirm("Confirmez-vous la mise à la poubelle de ce fichier ? Vous pourrez le récupèrer si besoin.");
if (r == true) {
url="{{ path('app_'~access~'_file_trash',{'category': category, 'id': id,'file':'xxx' }) }}";
url=url.replace("xxx",file);
url=url.replace(/&amp;/g,"&");
$.ajax({
method: "POST",
url: url,
success: function() {
location.reload();
}
});
}
}
// Supprimer un fichier
function delFile(file) {
var r = confirm("Confirmez-vous la suppression définitive de ce fichier ?");
if (r == true) {
url="{{ path('app_'~access~'_file_delete',{'category': category, 'id': id,'file':'xxx' }) }}";
url=url.replace("xxx",file);
url=url.replace(/&amp;/g,"&");
$.ajax({
method: "POST",
url: url,
success: function() {
location.reload();
}
});
}
}
// Restaurer un fichier
function restaureFile(file) {
url="{{ path('app_'~access~'_file_restaure',{'category': category, 'id': id,'file':'xxx' }) }}";
url=url.replace("xxx",file);
url=url.replace(/&amp;/g,"&");
$.ajax({
method: "POST",
url: url,
success: function() {
location.reload();
}
});
}
// Déplacement
{% if not fgtrash %}
$('.file').on('dragstart', function (s) {
filesource=$(this).data("src");
});
$('.folder').on('dragstart', function (s) {
filesource=$(this).data("src");
});
$('.folder')
// crucial for the 'drop' event to fire
.on('dragover', false)
.on('drop', function (e) {
// Récupérer la destination
filedestination=$(this).data("src");
// Si la source est la meme que la destination on ne fait rien
if(filesource==filedestination) return false;
url="{{ path('app_'~access~'_file_move',{'category': category, 'id': id,'source':'xxx', 'destination':'zzz' }) }}";
url=url.replace("xxx",filesource);
url=url.replace("zzz",filedestination);
url=url.replace(/&amp;/g,"&");
// On déplace l'element
$.ajax({
method: "POST",
url: url,
success: function() {
location.reload();
}
});
return false;
});
{% endif %}
{% endif %}
</script>
{% endblock %}