diff --git a/lang/medias_fr.php b/lang/medias_fr.php
index f0e33f946ce9843258aad8b6917c12a84fffd049..d41fe2cecb3d6971e4a902b6da51c11aca2351e9 100644
--- a/lang/medias_fr.php
+++ b/lang/medias_fr.php
@@ -146,6 +146,7 @@ $GLOBALS[$GLOBALS['idx_lang']] = array(
'label_credits' => 'Crédits',
'label_fichier' => 'Fichier',
'label_fichier_vignette' => 'Vignette',
+ 'label_titre_mimetype' => 'Type de fichier',
'label_paginer_par' => 'Paginer par :',
'label_parents' => 'Ce document est lié à ',
'label_refdoc_joindre' => 'Document numéro',
diff --git a/prive/squelettes/inclure/mediatheque-choisir.html b/prive/squelettes/inclure/mediatheque-choisir.html
index bf8d5b5d9d887a6bc070395ab3b77ed28ef40b11..9bc14f3f3ae5f286808546d930b24d3d22e80dc7 100644
--- a/prive/squelettes/inclure/mediatheque-choisir.html
+++ b/prive/squelettes/inclure/mediatheque-choisir.html
@@ -1,82 +1,143 @@
#SET{editable,#ENV{editable,' '}|oui}
-<div class="galerie[ media-(#ENV{media,''})]">
+<div class="liste-objets galerie galerie-choisir mini[ media-(#ENV{media,''})]">
<B_galerie>
-
- <h3>[(#GRAND_TOTAL|singulier_ou_pluriel{#VAL{medias:un_}|concat{#ENV{media,document}},#VAL{medias:des_}|concat{#ENV{media,document},s}})]</h3>
- <nav class='pagination tri'>
- [(#TRI{'>',#CHEMIN_IMAGE{tri-asc-16.png}|balise_img{<:par_tri_croissant:>}}) |]
- [(#TRI{'<',#CHEMIN_IMAGE{tri-desc-16.png}|balise_img{<:par_tri_decroissant:>}}) |]
- [(#TRI{id_document,<:medias:par_id:>}) |]
- [(#TRI{date,<:medias:par_date:>}) |]
- [(#TRI{taille,<:medias:par_taille:>}) |]
- [(#TRI{largeur,<:medias:par_largeur:>}) |]
- [(#TRI{hauteur,<:medias:par_hauteur:>}) |]
- [(#TRI{titre,<:medias:par_titre:>}) |]
- </nav>
- [<nav class="pagination">(#PAGINATION{prive})</nav>]
- <table>
+ <table class="spip liste">
+ <caption>
+ <strong class="caption">[(#GRAND_TOTAL|singulier_ou_pluriel{#VAL{medias:un_}|concat{#ENV{media,document}},#VAL{medias:des_}|concat{#ENV{media,document},s}})][ - (#GET{poids_total}|taille_en_octets)]</strong>
+ </caption>
<thead>
- <th></th>
- <th class="id"><:medias:id:></th>
- <th></th>
- <th><:medias:logo:></th>
- <th><:medias:infos:></th>
- <th><:medias:descriptif:></th>
- <th></th>
+ <tr>
+ <th colspan="7">
+ <nav class='pagination tri'>
+ [(#TRI{'>',#CHEMIN_IMAGE{tri-asc-16.png}|balise_img{<:par_tri_croissant:>}}) |]
+ [(#TRI{'<',#CHEMIN_IMAGE{tri-desc-16.png}|balise_img{<:par_tri_decroissant:>}}) |]
+ [(#TRI{id_document,<:medias:par_id:>}) |]
+ [(#TRI{date,<:medias:par_date:>}) |]
+ [(#TRI{taille,<:medias:par_taille:>}) |]
+ [(#TRI{largeur,<:medias:par_largeur:>}) |]
+ [(#TRI{hauteur,<:medias:par_hauteur:>}) |]
+ [(#TRI{titre,<:medias:par_titre:>}) |]
+ [<:medias:label_paginer_par:> (#GRAND_TOTAL|>{100}|oui)
+ [(#SELF|parametre_url{pagination,''}|lien_ou_expose{10,#ENV{pagination,10}|=={10},ajax})]
+ [<span class="sep">|</span> (#SELF|parametre_url{pagination,50}|lien_ou_expose{50,#ENV{pagination,10}|=={50},ajax})]]
+ [(#GRAND_TOTAL|>{500}|oui)
+ [<span class="sep">|</span> (#SELF|parametre_url{pagination,100}|lien_ou_expose{100,#ENV{pagination,10}|=={100},ajax})]
+ ]
+ [(#GRAND_TOTAL|>{5000}|oui)
+ [<span class="sep">|</span> (#SELF|parametre_url{pagination,500}|lien_ou_expose{500,#ENV{pagination,10}|=={500},ajax})]
+ ]
+ </nav>
+ </th>
+ </tr>
+ [<tr>
+ <th colspan="7">
+ <nav class="pagination">(#PAGINATION{prive})</nav>
+ </th>
+ </tr>]
+ <tr class="first_row">
+ <th class="logo"><:medias:logo:></th>
+ <th class="infos"></th>
+ <th class="id"><:medias:id:></th>
+ <th class="statut"></th>
+ <th class="exif"><:medias:infos:></th>
+ <th class="editorial"><:medias:descriptif:></th>
+ <th class="action"></th>
+ </tr>
</thead>
- <BOUCLE_galerie(DOCUMENTS) {id_rubrique ?}{id_article ?}{id_breve ?}{id_document ?}{recherche ?} {tri id_document,inverse}{media?}{extension?}{distant?}{brise?}{statut==#ENV{statut,.*}}{orphelins?}{titre==(#ENV{sanstitre}|?{'^$','.*'})}{pagination 10}>
- <tr class="[(#ENV{media}|non)[ media-(#MEDIA)]]" id="#ENV{iddoc,media}#ID_DOCUMENT">
- <td class='infos'>
- [(#DISTANT|=={oui}|non)#SET{missing,#FICHIER|file_exists|non}]
- [(#ENV{media}|non|et{#MEDIA|!={file}})[(#CHEMIN_IMAGE{media-#MEDIA|concat{-32.png}}|balise_img|inserer_attribut{alt,#VAL{medias:media_#MEDIA}|_T}|inserer_attribut{title,#VAL{medias:media_#MEDIA}|_T})]]
- [(#GET{missing}|oui)<img src='#CHEMIN_IMAGE{document-manquant-24.png}' width='24' height='24' alt='<:medias:fichier_manquant:>' />]
- [(#DISTANT|=={oui}|oui)<img src='#CHEMIN_IMAGE{document-distant-24.png}' width='24' height='24' alt='<:medias:fichier_distant:>' />]
- </td>
- <td class="id">
- <strong>#ID_DOCUMENT</strong>
- </td>
- <td class='statut'>
- [(#ID_DOCUMENT|medias_puce_statut_document{#STATUT})]
- </td>
- <td class="logo">
- #SET{fichier,#DISTANT|=={oui}|?{#FICHIER,#FICHIER|basename}}
- [(#MEDIA|=={image}|oui)[
- (#LOGO_DOCUMENT{apercu,200,100}|inserer_attribut{alt,[(#TITRE|couper{60}|texte_backend)]})
- ]]
- [(#MEDIA|=={image}|non)[<div class="#EDIT{vignette} resize-250">
- (#LOGO_DOCUMENT{auto,200,100}|inserer_attribut{alt,[(#TITRE|couper{60}|texte_backend)]})
- </div>]]
- <div class="fichier">#GET{fichier}</div>
- </td>
- <td class="exif">
- [<strong class="extension">(#EXTENSION)</strong>]
- [<div class="dimensions">(#LARGEUR|?{[(#LARGEUR)[ x (#HAUTEUR) pixels]],''})</div>]
- [<div class="taille">(#TAILLE|taille_en_octets)</div>]
- [<div class="date">(#DATE|affdate{d/m/Y})</div>]
- <B_liens>
- [(#TOTAL_BOUCLE|>{1}|oui)
- <a href='#' onclick="jQuery(this).next().show();$(this).hide();return false;">[(#TOTAL_BOUCLE|singulier_ou_pluriel{medias:une_utilisation,medias:des_utilisations})]</a><div style='display: none;'>
- ]
- <BOUCLE_liens(documents_liens){id_document}{'<br />'}>
- [(#ID_OBJET|generer_lien_entite{#OBJET}|inserer_attribut{target,_blank})]
- </BOUCLE_liens>
- [(#TOTAL_BOUCLE|>{1}|oui)</div>]
- </B_liens>
- </td>
- <td class="descriptif">
- [<strong class="titre #EDIT{titre}">(#TITRE|sinon{#VAL{<i>}|concat{<:info_sans_titre:>,'</i>'}})</strong>]
- [<div class="descriptif #EDIT{descriptif}">(#DESCRIPTIF)</div>]
- [<p class="credits #EDIT{credits}">(#CREDITS)</p>]
- </td>
- <td>
- [(#REM) Utilisation de la galerie en mode selecteur, avec un bouton choix qui appelle une fonction js passee en argument]
- [<span class="choisir"><input type="submit" onclick="(#ENV{selectfunc,''})([(#ID_DOCUMENT)]);return false;" value="<:bouton_choisir|attribut_html:>" /></span>]
- </td>
- </tr>
- </BOUCLE_galerie>
+ <tbody>
+ <BOUCLE_galerie(DOCUMENTS) {id_rubrique ?}{id_article ?}{id_breve ?}{id_document ?}{recherche ?} {tri id_document,inverse}{media?}{extension?}{distant?}{brise?}{statut==#ENV{statut,.*}}{orphelins?}{titre==(#ENV{sanstitre}|?{'^$','.*'})}{pagination 10}>
+ <tr class="[(#ENV{media}|non)[ media-(#MEDIA)]]" id="#ENV{iddoc,media}#ID_DOCUMENT">
+ <td class="logo">
+ #SET{fichier,#DISTANT|=={oui}|?{#FICHIER,#FICHIER|basename}}
+ [(#MEDIA|=={image}|oui)[
+ (#LOGO_DOCUMENT{apercu,200,100}|inserer_attribut{alt,[(#TITRE|couper{60}|texte_backend)]})
+ ]]
+ [(#MEDIA|=={image}|non)[<div class="#EDIT{vignette} resize-250">
+ (#LOGO_DOCUMENT{auto,200,100}|inserer_attribut{alt,[(#TITRE|couper{60}|texte_backend)]})
+ </div>]]
+ </td>
+ <td class='infos'>
+ [(#DISTANT|=={oui}|non)#SET{missing,#FICHIER|file_exists|non}]
+ [(#ENV{media}|non|et{#MEDIA|!={file}})[(#CHEMIN_IMAGE{media-#MEDIA|concat{-32.png}}|balise_img|inserer_attribut{alt,#VAL{medias:media_#MEDIA}|_T}|inserer_attribut{title,#VAL{medias:media_#MEDIA}|_T})]]
+ [<div class="extension">(#EXTENSION)</div>]
+ [(#GET{missing}|oui)<img src='#CHEMIN_IMAGE{document-manquant-24.png}' width='24' height='24' alt='<:medias:fichier_manquant:>' />]
+ [(#DISTANT|=={oui}|oui)<img src='#CHEMIN_IMAGE{document-distant-24.png}' width='24' height='24' alt='<:medias:fichier_distant:>' />]
+ </td>
+ <td class="id">
+ <strong>#ID_DOCUMENT</strong>
+ </td>
+ <td class='statut'>
+ [(#ID_DOCUMENT|medias_puce_statut_document{#STATUT})]
+ </td>
+ <td class="exif">
+ [(#REM) Infos résumées ]
+ [<div class="fichier" title="[(#GET{fichier}|attribut_html)]">(#GET{fichier})</div>]
+ [<div class="taille">(#TAILLE|taille_en_octets)</div>]
+
+ [(#REM) Infos détaillées ]
+ <a
+ role="button"
+ href="#"
+ class="btn btn_link btn_toggle"
+ title="<:medias:details_document_afficher_masquer|attribut_html:>"
+ onclick="jQuery(this).next().toggle();return false;"
+ ><span class="sp-icone">+</span> <:medias:details_document:></a>
+ <dl class="detaillees" style="display:none;">
+ [<dt class="detaillees__label"><:medias:label_fichier:></dt>
+ <dd class="detaillees__valeur fichier">(#GET{fichier})</dd>]
+ [<dt class="detaillees__label"><:medias:label_titre_mimetype:></dt>
+ <dd class="detaillees__valeur mimetype">(#GET{titre_mimetype})</dd>]
+ [(#LARGEUR|ou{#HAUTEUR}|et{#MEDIA|=={image}})
+ [<dt class="detaillees__label"><:medias:info_dimensions_image:></dt>
+ <dd class="detaillees__valeur dimensions">(#VAL{info_largeur_vignette}|_T{#ARRAY{largeur_vignette,#LARGEUR,hauteur_vignette,#HAUTEUR}})</dd>]
+ [<dt class="detaillees__label"><:medias:info_resolution_image:></dt>
+ <dd class="detaillees__valeur resolution">(#VAL{medias:info_resolution_mpx}|_T{#ARRAY{resolution,#LARGEUR|mult{#HAUTEUR}|div{1000000}|round{1}|number_format{1}}})</dd>]
+ ]
+ [(#MEDIA|in_array{#LISTE{audio,video}}|et{#DUREE|intval}|oui)
+ [<dt class="detaillees__label"><:medias:info_duree:></dt>
+ <dd class="detaillees__valeur duree">(#DUREE|duree_en_secondes)</dd>]
+ ]
+ [<dt class="detaillees__label"><:medias:info_taille:></dt>
+ <dd class="detaillees__valeur taille">(#TAILLE|taille_en_octets)</dd>]
+ [<dt class="detaillees__label"><:date:></dt>
+ <dd class="detaillees__valeur date">(#DATE|affdate{d/m/Y})</dd>]
+ </dl>
+
+ [(#PIPELINE{afficher_metas_document,#ARRAY{args,#ARRAY{'quoi','galerie','id_document',#ID_DOCUMENT},data,''}})]
+
+ <B_utilisations>
+ [(#TOTAL_BOUCLE|>{1}|oui)
+ <a role="button" class="btn btn_link btn_toggle" href='#' onclick="jQuery(this).next().toggle();/*$(this).hide();*/return false;">
+ <span class="sp-icone">+</span> [(#TOTAL_BOUCLE|singulier_ou_pluriel{medias:une_utilisation,medias:des_utilisations})]
+ </a>
+ ]
+ <ul class="utilisations"[ (#TOTAL_BOUCLE|>{1}|oui)style="display:none"]>
+ <BOUCLE_utilisations(documents_liens) {id_document} {fusion objet} {fusion id_objet}>
+ [<li class="utilisations__item">
+ <a class="" href="(#ID_OBJET|generer_url_entite{#OBJET})">[(#CHEMIN_IMAGE{vu-16.png}|balise_img{'',sp-icone}) ][(#INFO_TITRE{#OBJET,#ID_OBJET}|couper{50})]</a>
+ </li>]
+ </BOUCLE_utilisations>
+ </ul>
+ </B_utilisations>
+ </td>
+ <td class="editorial">
+ [<strong class="titre #EDIT{titre}">(#TITRE|sinon{#VAL{<i class="sans-titre">}|concat{<:info_sans_titre:>,'</i>'}})</strong>]
+ [<div class="descriptif #EDIT{descriptif}">(#DESCRIPTIF)</div>]
+ [<p class="credits #EDIT{credits}"><span class="label"><:medias:label_credits:></span><span class="sep"> – </span><span class="valeur">(#CREDITS)</span></p>]
+ [<p class="alt #EDIT{alt}"><span class="label"><:medias:label_alt:></span><span class="sep"> – </span><span class="valeur">(#ALT)</span></p>]
+ </td>
+ <td class="action">
+ [(#REM) Utilisation de la galerie en mode selecteur, avec un bouton choix qui appelle une fonction js passee en argument]
+ [<span class="choisir"><input class="btn" type="submit" onclick="(#ENV{selectfunc,''})([(#ID_DOCUMENT)]);return false;" value="<:bouton_choisir|attribut_html:>" /></span>]
+ </td>
+ </tr>
+ </BOUCLE_galerie>
+ </tbody>
</table>
[<nav class='pagination'>(#PAGINATION{prive})</nav>]
</B_galerie>
- <h3>[(#VAL{medias:aucun_}|concat{#ENV{media,document}}|_T)]</h3>
+ <div class="liste-objets galerie galerie-choisir mini caption-wrap">
+ <h3 class="caption">[(#VAL{medias:aucun_}|concat{#ENV{media,document}}|_T)]</h3>
+ </div>
<//B_galerie>
</div><!--#galerie-->
diff --git a/prive/squelettes/inclure/mediatheque-galerie.html b/prive/squelettes/inclure/mediatheque-galerie.html
index e1ad6e50818914abcf280328ce543f93ab0e8f75..aafa68297ba99d7e72e17796326e4df2f85fae10 100644
--- a/prive/squelettes/inclure/mediatheque-galerie.html
+++ b/prive/squelettes/inclure/mediatheque-galerie.html
@@ -1,101 +1,161 @@
#SET{editable,#ENV{editable,oui}|=={non}|non}
-<div class="galerie[ media-(#ENV{media,''})]">
+<div class="liste-objets galerie[ media-(#ENV{media,''})]">
[(#SET{poids_total,0})]<BOUCLE_poids_total(DOCUMENTS){id_rubrique ?}{id_article ?}{id_breve ?}{id_document ?}{recherche ?}{media?}{extension?}{distant?}{brise?}{statut==#ENV{statut,.*}}{orphelins?}{titre==(#ENV{sanstitre}|?{'^$','.*'})}{id_vignette==(#ENV{sansvignette}|?{'^0','.*'})}>[(#SET{poids_total,#GET{poids_total}|plus{#TAILLE}})]</BOUCLE_poids_total>
<B_galerie>
- <h2>[(#GRAND_TOTAL|singulier_ou_pluriel{#VAL{medias:un_}|concat{#ENV{media,document}},#VAL{medias:des_}|concat{#ENV{media,document},s}})][ - (#GET{poids_total}|taille_en_octets)]</h2>
- <nav class='pagination tri'>
- [(#TRI{'>',#CHEMIN_IMAGE{tri-asc-16.png}|balise_img{<:par_tri_croissant:>}}) |]
- [(#TRI{'<',#CHEMIN_IMAGE{tri-desc-16.png}|balise_img{<:par_tri_decroissant:>}}) |]
- [(#TRI{id_document,<:medias:par_id:>}) |]
- [(#TRI{date,<:medias:par_date:>}) |]
- [(#TRI{taille,<:medias:par_taille:>}) |]
- [(#TRI{largeur,<:medias:par_largeur:>}) |]
- [(#TRI{hauteur,<:medias:par_hauteur:>}) |]
- [(#TRI{titre,<:medias:par_titre:>}) |]
-
- [<:medias:label_paginer_par:> (#GRAND_TOTAL|>{100}|oui)
- [(#SELF|parametre_url{pagination,''}|lien_ou_expose{10,#ENV{pagination,10}|=={10},ajax})]
- [<span class="sep">|</span> (#SELF|parametre_url{pagination,50}|lien_ou_expose{50,#ENV{pagination,10}|=={50},ajax})]]
- [(#GRAND_TOTAL|>{500}|oui)
- [<span class="sep">|</span> (#SELF|parametre_url{pagination,100}|lien_ou_expose{100,#ENV{pagination,10}|=={100},ajax})]
- ]
- [(#GRAND_TOTAL|>{5000}|oui)
- [<span class="sep">|</span> (#SELF|parametre_url{pagination,500}|lien_ou_expose{500,#ENV{pagination,10}|=={500},ajax})]
- ]
- </nav>
- [<nav class="pagination">(#PAGINATION{prive})</nav>]
- <table>
+ <table class="spip liste">
+ <caption>
+ <strong class="caption">[(#GRAND_TOTAL|singulier_ou_pluriel{#VAL{medias:un_}|concat{#ENV{media,document}},#VAL{medias:des_}|concat{#ENV{media,document},s}})][ - (#GET{poids_total}|taille_en_octets)]</strong>
+ </caption>
<thead>
- <th></th>
- <th class="id"><:medias:id:></th>
- <th></th>
- <th><:medias:logo:></th>
- <th><:medias:infos:></th>
- <th><:medias:descriptif:></th>
- <th></th>
+ <tr>
+ <th colspan="7">
+ <nav class='pagination tri'>
+ [(#TRI{'>',#CHEMIN_IMAGE{tri-asc-16.png}|balise_img{<:par_tri_croissant:>}}) |]
+ [(#TRI{'<',#CHEMIN_IMAGE{tri-desc-16.png}|balise_img{<:par_tri_decroissant:>}}) |]
+ [(#TRI{id_document,<:medias:par_id:>}) |]
+ [(#TRI{date,<:medias:par_date:>}) |]
+ [(#TRI{taille,<:medias:par_taille:>}) |]
+ [(#TRI{largeur,<:medias:par_largeur:>}) |]
+ [(#TRI{hauteur,<:medias:par_hauteur:>}) |]
+ [(#TRI{titre,<:medias:par_titre:>}) |]
+ [<:medias:label_paginer_par:> (#GRAND_TOTAL|>{100}|oui)
+ [(#SELF|parametre_url{pagination,''}|lien_ou_expose{10,#ENV{pagination,10}|=={10},ajax})]
+ [<span class="sep">|</span> (#SELF|parametre_url{pagination,50}|lien_ou_expose{50,#ENV{pagination,10}|=={50},ajax})]]
+ [(#GRAND_TOTAL|>{500}|oui)
+ [<span class="sep">|</span> (#SELF|parametre_url{pagination,100}|lien_ou_expose{100,#ENV{pagination,10}|=={100},ajax})]
+ ]
+ [(#GRAND_TOTAL|>{5000}|oui)
+ [<span class="sep">|</span> (#SELF|parametre_url{pagination,500}|lien_ou_expose{500,#ENV{pagination,10}|=={500},ajax})]
+ ]
+ </nav>
+ </th>
+ </tr>
+ [<tr>
+ <th colspan="7">
+ <nav class="pagination">(#PAGINATION{prive})</nav>
+ </th>
+ </tr>]
+ <tr class="first_row">
+ <th class="logo"><:medias:logo:></th>
+ <th class="infos"></th>
+ <th class="id"><:medias:id:></th>
+ <th class="statut"></th>
+ <th class="exif"><:medias:infos:></th>
+ <th class="editorial"><:medias:descriptif:></th>
+ <th class="action"></th>
+ </tr>
</thead>
- <BOUCLE_galerie(DOCUMENTS) {id_rubrique ?}{id_article ?}{id_breve ?}{id_document ?}{recherche ?} {tri id_document,inverse}{media?}{extension?}{distant?}{brise?}{statut==#ENV{statut,.*}}{orphelins?}{titre==(#ENV{sanstitre}|?{'^$','.*'})}{id_vignette==(#ENV{sansvignette}|?{'^0','.*'})}{pagination #ENV{pagination,10}}>
- <tr class="[(#ENV{media}|non)[ media-(#MEDIA)]]" id="#ENV{iddoc,media}#ID_DOCUMENT">
- <td class='infos'>
- [(#DISTANT|=={oui}|non)#SET{missing,#FICHIER|file_exists|non}]
- [(#ENV{media}|non|et{#MEDIA|!={file}})[(#CHEMIN_IMAGE{media-#MEDIA|concat{-32.png}}|balise_img|inserer_attribut{alt,#VAL{medias:media_#MEDIA}|_T}|inserer_attribut{title,#VAL{medias:media_#MEDIA}|_T})]]
- [(#GET{missing}|oui)[(#CHEMIN_IMAGE{document-manquant-32.png}|balise_img{<:medias:fichier_manquant:>}|inserer_attribut{title,<:medias:fichier_manquant:>})]]
- [(#DISTANT|=={oui}|oui)[(#CHEMIN_IMAGE{document-distant-32.png}|balise_img{<:medias:fichier_distant:>}|inserer_attribut{title,<:medias:fichier_distant:>})]]
- </td>
- <td class="id">
- <strong>#ID_DOCUMENT</strong>
- </td>
- <td class='statut'>
- [(#ID_DOCUMENT|medias_puce_statut_document{#STATUT})]
- </td>
- <td class="logo">
- #SET{fichier,#DISTANT|=={oui}|?{#FICHIER,#FICHIER|basename}}
- [(#MEDIA|=={image}|oui)[
- <a href="#URL_DOCUMENT" type="#MIME_TYPE"[ title="(#GET{fichier})"]>(#LOGO_DOCUMENT{apercu,250,100}|inserer_attribut{alt,[(#TITRE|couper{60}|texte_backend)]})</a>
- ]]
- [(#MEDIA|=={image}|non)[<div class="#EDIT{vignette} resize-250">
- <a href="#URL_DOCUMENT" type="#MIME_TYPE"[ title="(#GET{fichier})"]>(#LOGO_DOCUMENT{auto,250,100}|inserer_attribut{alt,[(#TITRE|couper{60}|texte_backend)]})</a>
- </div>]]
- <div class="fichier">#GET{fichier}</div>
- </td>
- <td class="exif">
- [<strong class="extension">(#EXTENSION)</strong>]
- [<div class="dimensions">(#LARGEUR|?{[(#LARGEUR)[ x (#HAUTEUR) pixels]],''})</div>]
- [<div class="taille">(#TAILLE|taille_en_octets)</div>]
- [<div class="date">(#DATE|affdate{d/m/Y})</div>]
- [(#PIPELINE{afficher_metas_document,#ARRAY{args,#ARRAY{'quoi','galerie','id_document',#ID_DOCUMENT},data,''}})]
- <B_liens>
- [(#TOTAL_BOUCLE|>{1}|oui)
- <a href='#' onclick="jQuery(this).next().show();$(this).hide();return false;">[(#TOTAL_BOUCLE|singulier_ou_pluriel{medias:une_utilisation,medias:des_utilisations})]</a><div style='display: none;'>
- ]
- <BOUCLE_liens(documents_liens){id_document}{fusion objet}{fusion id_objet}{'<br />'}>
- [(#ID_OBJET|generer_lien_entite{#OBJET})]
- </BOUCLE_liens>
- [(#TOTAL_BOUCLE|>{1}|oui)</div>]
- </B_liens>
- </td>
- <td class="descriptif">
- [<strong class="titre #EDIT{titre}">(#TITRE|sinon{#VAL{<i>}|concat{<:info_sans_titre:>,'</i>'}})</strong>]
- [<div class="descriptif #EDIT{descriptif}">(#DESCRIPTIF)</div>]
- [<p class="credits #EDIT{credits}">(#CREDITS)</p>]
- </td>
- <td>
- [(#REM) Utilisation de la galerie en mode portfolio, avec renvoi vers l'edition]
- [(#GET{editable})
- [(#AUTORISER{modifier,document,#ID_DOCUMENT})[<a href='#URL_ECRIRE{document_edit,id_document=#ID_DOCUMENT}'><:bouton_modifier:></a>]]
- [<span class='supprimer'>(#AUTORISER{supprimer,document,#ID_DOCUMENT})[(#BOUTON_ACTION{<:medias:bouton_supprimer:>,#URL_ACTION_AUTEUR{supprimer_document,#ID_DOCUMENT,#SELF},ajax,'','',[(function(){jQuery("##ENV{iddoc,media}(#ID_DOCUMENT)").animateRemove();return true;})()]})]</span>]
- ]
- [(#PIPELINE{document_desc_actions,#ARRAY{args,#ARRAY{id_document,#ID_DOCUMENT,position,galerie},data,''}})]
- </td>
- </tr>
- </BOUCLE_galerie>
+ <tbody>
+ <BOUCLE_galerie(DOCUMENTS) {id_rubrique ?}{id_article ?}{id_breve ?}{id_document ?}{recherche ?} {tri id_document,inverse}{media?}{extension?}{distant?}{brise?}{statut==#ENV{statut,.*}}{orphelins?}{titre==(#ENV{sanstitre}|?{'^$','.*'})}{id_vignette==(#ENV{sansvignette}|?{'^0','.*'})}{pagination #ENV{pagination,10}}>
+ #SET{titre_mimetype,''}
+ <BOUCLE_type(types_documents) {extension}>#SET{titre_mimetype,#TITRE}</BOUCLE_type>
+ <tr class="[(#COMPTEUR_BOUCLE|alterner{row_odd,row_even})][ (#ENV{media}|non)[ media-(#MEDIA)]]" id="#ENV{iddoc,media}#ID_DOCUMENT">
+ <td class="logo">
+ #SET{fichier,#DISTANT|=={oui}|?{#FICHIER,#FICHIER|basename}}
+ [(#MEDIA|=={image}|oui)[
+ <a href="#URL_DOCUMENT" type="#MIME_TYPE"[ title="(#GET{fichier})"]>(#LOGO_DOCUMENT{apercu,250,100}|inserer_attribut{alt,[(#TITRE|couper{60}|texte_backend)]})</a>
+ ]]
+ [(#MEDIA|=={image}|non)[<div class="#EDIT{vignette} resize-250">
+ <a href="#URL_DOCUMENT" type="#MIME_TYPE"[ title="(#GET{fichier})"]>(#LOGO_DOCUMENT{auto,250,100}|inserer_attribut{alt,[(#TITRE|couper{60}|texte_backend)]})</a>
+ </div>]]
+ </td>
+ <td class='infos'>
+ [(#DISTANT|=={oui}|non)#SET{missing,#FICHIER|file_exists|non}]
+ [(#ENV{media}|non|et{#MEDIA|!={file}})[(#CHEMIN_IMAGE{media-#MEDIA|concat{-32.png}}|balise_img{[(#VAL{medias:media_#MEDIA}|_T)],type-media}|inserer_attribut{title,#VAL{medias:media_#MEDIA}|_T})]]
+ [<div class="extension">(#EXTENSION)</div>]
+ [(#GET{missing}|oui)[(#CHEMIN_IMAGE{document-manquant-32.png}|balise_img{<:medias:fichier_manquant:>}|inserer_attribut{title,<:medias:fichier_manquant:>})]]
+ [(#DISTANT|=={oui}|oui)[(#CHEMIN_IMAGE{document-distant-32.png}|balise_img{<:medias:fichier_distant:>}|inserer_attribut{title,<:medias:fichier_distant:>})]]
+ </td>
+ <td class="id">
+ <strong>#ID_DOCUMENT</strong>
+ </td>
+ <td class='statut'>
+ [(#ID_DOCUMENT|medias_puce_statut_document{#STATUT})]
+ </td>
+ <td class="exif">
+
+ [(#REM) Infos résumées ]
+ [<div class="fichier" title="[(#GET{fichier}|attribut_html)]">(#GET{fichier})</div>]
+ [<div class="taille">(#TAILLE|taille_en_octets)</div>]
+
+ [(#REM) Infos détaillées ]
+ <a
+ role="button"
+ href="#"
+ class="btn btn_link btn_toggle"
+ title="<:medias:details_document_afficher_masquer|attribut_html:>"
+ onclick="jQuery(this).next().toggle();return false;"
+ ><span class="sp-icone">+</span> <:medias:details_document:></a>
+ <dl class="detaillees" style="display:none;">
+ [<dt class="detaillees__label"><:medias:label_fichier:></dt>
+ <dd class="detaillees__valeur fichier">(#GET{fichier})</dd>]
+ [<dt class="detaillees__label"><:medias:label_titre_mimetype:></dt>
+ <dd class="detaillees__valeur mimetype">(#GET{titre_mimetype})</dd>]
+ [(#LARGEUR|ou{#HAUTEUR}|et{#MEDIA|=={image}})
+ [<dt class="detaillees__label"><:medias:info_dimensions_image:></dt>
+ <dd class="detaillees__valeur dimensions">(#VAL{info_largeur_vignette}|_T{#ARRAY{largeur_vignette,#LARGEUR,hauteur_vignette,#HAUTEUR}})</dd>]
+ [<dt class="detaillees__label"><:medias:info_resolution_image:></dt>
+ <dd class="detaillees__valeur resolution">(#VAL{medias:info_resolution_mpx}|_T{#ARRAY{resolution,#LARGEUR|mult{#HAUTEUR}|div{1000000}|round{1}|number_format{1}}})</dd>]
+ ]
+ [(#MEDIA|in_array{#LISTE{audio,video}}|et{#DUREE|intval}|oui)
+ [<dt class="detaillees__label"><:medias:info_duree:></dt>
+ <dd class="detaillees__valeur duree">(#DUREE|duree_en_secondes)</dd>]
+ ]
+ [<dt class="detaillees__label"><:medias:info_taille:></dt>
+ <dd class="detaillees__valeur taille">(#TAILLE|taille_en_octets)</dd>]
+ [<dt class="detaillees__label"><:date:></dt>
+ <dd class="detaillees__valeur date">(#DATE|affdate{d/m/Y})</dd>]
+ </dl>
+
+ [(#PIPELINE{afficher_metas_document,#ARRAY{args,#ARRAY{'quoi','galerie','id_document',#ID_DOCUMENT},data,''}})]
+
+ <B_utilisations>
+ [(#TOTAL_BOUCLE|>{1}|oui)
+ <a role="button" class="btn btn_link btn_toggle" href='#' onclick="jQuery(this).next().toggle();/*$(this).hide();*/return false;">
+ <span class="sp-icone">+</span> [(#TOTAL_BOUCLE|singulier_ou_pluriel{medias:une_utilisation,medias:des_utilisations})]
+ </a>
+ ]
+ <ul class="utilisations"[ (#TOTAL_BOUCLE|>{1}|oui)style="display:none"]>
+ <BOUCLE_utilisations(documents_liens) {id_document} {fusion objet} {fusion id_objet}>
+ [<li class="utilisations__item">
+ <a class="" href="(#ID_OBJET|generer_url_entite{#OBJET})">[(#CHEMIN_IMAGE{vu-16.png}|balise_img{'',sp-icone}) ][(#INFO_TITRE{#OBJET,#ID_OBJET}|couper{50})]</a>
+ </li>]
+ </BOUCLE_utilisations>
+ </ul>
+ </B_utilisations>
+
+ </td>
+ <td class="editorial">
+ [<strong class="titre #EDIT{titre}">(#TITRE|sinon{#VAL{<i class="sans-titre">}|concat{<:info_sans_titre:>,'</i>'}})</strong>]
+ [<div class="descriptif #EDIT{descriptif}">(#DESCRIPTIF)</div>]
+ [<p class="credits #EDIT{credits}"><span class="label"><:medias:label_credits:></span><span class="sep"> – </span><span class="valeur">(#CREDITS)</span></p>]
+ [<p class="alt #EDIT{alt}"><span class="label"><:medias:label_alt:></span><span class="sep"> – </span><span class="valeur">(#ALT)</span></p>]
+ </td>
+ <td class="action">
+ [(#REM) Utilisation de la galerie en mode portfolio, avec renvoi vers l'edition]
+ [(#GET{editable}|oui)
+ <div class="groupe-btns groupe-btns_vertical">
+ [(#AUTORISER{modifier,document,#ID_DOCUMENT})<a class="btn" href='#URL_ECRIRE{document_edit,id_document=#ID_DOCUMENT}'><:bouton_modifier:></a>]
+ [(#AUTORISER{supprimer,document,#ID_DOCUMENT})[(#BOUTON_ACTION{<:medias:bouton_supprimer:>,#URL_ACTION_AUTEUR{supprimer_document,#ID_DOCUMENT,#SELF},ajax btn btn_secondaire btn_supprimer,'','',[(function(){jQuery("##ENV{iddoc,media}(#ID_DOCUMENT)").animateRemove();return true;})()]})]]
+ </div>
+ ]
+ [(#REM) On ne sait pas si le contenu ajouté par le pipeline consiste en des boutons, donc pas inclus dans le groupe. ]
+ [(#PIPELINE{document_desc_actions,#ARRAY{args,#ARRAY{id_document,#ID_DOCUMENT,position,galerie},data,''}})]
+ </td>
+ </tr>
+ </BOUCLE_galerie>
+ </tbody>
</table>
[<nav class='pagination'>(#PAGINATION{prive})</nav>]
#SET{nb_orphelins,#GRAND_TOTAL}
</B_galerie>
- <h2>[(#VAL{medias:aucun_}|concat{#ENV{media,document}}|_T)]</h2>
+
+ <div class="liste-objets galerie caption-wrap">
+ <h2 class="caption">[(#VAL{medias:aucun_}|concat{#ENV{media,document}}|_T)]</h2>
+ </div>
<//B_galerie>
+
[(#ENV{orphelins}|et{#AUTORISER{supprimer,orphelins,'',#SESSION{id_auteur}}})
[(#INCLURE{fond=prive/squelettes/inclure/bouton-supprimer-orphelins,env,nb_orphelins=#GET{nb_orphelins}})]
]
diff --git a/prive/squelettes/inclure/mediatheque-navigation.html b/prive/squelettes/inclure/mediatheque-navigation.html
index 28ec3ebbf0a7bdd679900cb443125b9331521848..70fb644317a1d13c6d7541e2afe1f0e43daa6f2a 100644
--- a/prive/squelettes/inclure/mediatheque-navigation.html
+++ b/prive/squelettes/inclure/mediatheque-navigation.html
@@ -56,6 +56,7 @@
<div class='nettoyeur'></div>
#FORMULAIRE_RECHERCHE_ECRIRE{#GET{self},ajax}
+<div class="nettoyeur"></div>
<INCLURE{fond=#ENV{galerie,''}|spip_sanitize_from_request{galerie,vide}|sinon{prive/squelettes/inclure/mediatheque-galerie},ajax=documents,env} />
diff --git a/prive/style_prive_plugin_medias.html b/prive/style_prive_plugin_medias.html
index 079a164d08775bec31105c0b58b0cb287aae16b8..f6b319adf1f39bbb7cfe92569aab9b789006029c 100644
--- a/prive/style_prive_plugin_medias.html
+++ b/prive/style_prive_plugin_medias.html
@@ -63,46 +63,140 @@
a.bouton_fermer {display:block;text-align:#GET{right};}
-.galerie { float: none; width: 100%; padding:0;margin-bottom: #ENV{margin-bottom};}
-.galerie .pagination {clear:both;font-size:0.95em;}
-.galerie .pagination + .pagination {border-top: 0;margin-top:-1px;}
-.galerie table { width: 100%; border: none; margin-bottom: 0}
-.galerie table thead,.galerie table thead th { background: #e5e5e5;background: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#e0e0e0));background-image: -webkit-linear-gradient(top, #f0f0f0, #e0e0e0);background-image: -moz-linear-gradient(top, #f0f0f0, #e0e0e0);background-image: -ms-linear-gradient(top, #f0f0f0, #e0e0e0);background-image: -o-linear-gradient(top, #f0f0f0, #e0e0e0);background-image: linear-gradient(top, #f0f0f0, #e0e0e0);filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#f0f0f0', endColorstr='#e0e0e0');}
-.galerie table tbody tr:hover { background: [#(#GET{claire}|couleur_eclaircir|couleur_eclaircir)]; }
-.galerie table td { min-height: 100px; vertical-align: top; word-break: break-word;}
-.galerie table th, .galerie table td { padding: 0.5em .3em; border-bottom: 1px solid #ccc; }
-.galerie table th.id { text-align: right; }
-.galerie table td.id { width: 80px; text-align: right; vertical-align: top; line-height: normal; }
-.galerie table td.id strong { font-size: 1.6em; color: #666; font-weight: normal; }
-.galerie table td.infos {min-width: 24px;}
-.galerie table td.statut { width: 9px; }
-.galerie table td.logo { width: 250px; overflow: hidden; }
-.galerie table td.logo img { /*border: 1px solid #666;*/ }
-.galerie table .fichier {font-size:0.8em;width:250px;overflow:hidden;font-style:italic;}
-
-.galerie table td.exif { width: 140px; }
-.galerie table td.exif small { display: inline; }
-.galerie table td.exif .extension {}
-.galerie table td.exif .dimensions { font-size: .9em; }
-.galerie table td.exif .taille { font-size: .9em; font-weight: bold; color: #666; }
-.galerie table td.exif .date { font-size: .9em; }
-.galerie table td.descriptif { }
-
-.galerie table .supprimer {display:block;font-size:0.8em;margin-top:1em;}
-
-.galerie.media-image h2 { background: url(#CHEMIN_IMAGE{media-image-32.png}) no-repeat center left; padding: 6px;padding-left: 40px;background-size:32px;}
-.galerie.media-audio h2 { background: url(#CHEMIN_IMAGE{media-audio-32.png}) no-repeat center left; padding: 6px;padding-left: 40px;background-size:32px;}
-.galerie.media-video h2 { background: url(#CHEMIN_IMAGE{media-video-32.png}) no-repeat center left; padding: 6px;padding-left: 40px;background-size:32px;}
-
-.galerie table td.exif { background-repeat: no-repeat; background-position: top right; }
+/**
+ * Galerie
+ */
+/* Caption */
+.liste-objets.galerie[class*="media-"] .caption {
+ padding-left: var(--spip-list-heading-iconpadding);
+ background-size: var(--spip-list-heading-iconsize);
+ background-repeat: no-repeat;
+ background-position: var(--spip-left) var(--spip-list-spacing-x) center;
+}
+.liste-objets.galerie.media-image .caption {
+ background-image: url(#CHEMIN_IMAGE{media-image-32.png});
+}
+.liste-objets.galerie.media-audio .caption {
+ background-image: url(#CHEMIN_IMAGE{media-audio-32.png});
+}
+.liste-objets.galerie.media-video .caption {
+ background-image: url(#CHEMIN_IMAGE{media-video-32.png});
+}
+
+/* Colonne logo */
+.liste-objets.galerie th.logo,
+.liste-objets.galerie td.logo {
+ width: 270px; /* laisser un peu respirer (largeur max image = 250px) */
+ overflow: hidden;
+ text-align: center;
+}
+
+/* Colonne infos : media, extension, distant, orphelin */
+.liste-objets.galerie td.infos {
+ min-width: 24px;
+}
+.liste-objets.galerie .type-media {
+ margin-bottom: 0.2em;
+}
+.liste-objets.galerie .extension {
+ text-transform: uppercase;
+}
+
+/* Colonne exif : infos techniques */
+.liste-objets.galerie td.exif {
+ vertical-align: top;
+}
+.liste-objets.galerie .fichier,
+.liste-objets.galerie .taille {
+ margin-bottom: 0.25em;
+}
+.liste-objets.galerie .fichier {
+ display: block;
+ max-width: 15em;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+.liste-objets.galerie .detaillees {
+ display: grid;
+ grid-template-columns: max-content 1fr;
+ margin-bottom: 0.5em;
+}
+.liste-objets.galerie .detaillees__label,
+.liste-objets.galerie .detaillees__valeur {
+ padding: 0.33em 0;
+ border-bottom: 1px solid var(--spip-box-sep-color);
+}
+.liste-objets.galerie .detaillees__valeur {
+ padding-#LEFT: 1em;
+ margin-bottom: 0;
+}
+.liste-objets.galerie .detaillees__label:last-of-type,
+.liste-objets.galerie .detaillees__valeur:last-of-type {
+ border-bottom: 0;
+}
+/* dans les détails il faut voir le nom de fichier en entier */
+.liste-objets.galerie .detaillees .fichier {
+ margin: 0;
+ word-wrap: break-word;
+}
+.liste-objets.galerie .detaillees .taille {
+ margin: 0;
+}
+.liste-objets.galerie .detaillees .taille {}
+.liste-objets.galerie .detaillees .date {}
+.liste-objets.galerie .exif .utilisations {
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+.liste-objets.galerie .exif .utilisations__item {}
+.liste-objets.galerie .exif .btn_link {
+ padding-#LEFT: 0;
+ margin: 0;
+}
+
+/* Colonne titre + crédits + descriptif */
+.liste-objets.galerie td.editorial {
+ vertical-align: top;
+}
+.liste-objets.galerie td.editorial .titre:not(:last-child),
+.liste-objets.galerie td.editorial .descriptif:not(:last-child),
+.liste-objets.galerie td.editorial p {
+ margin-bottom: 0.5em;
+}
+.liste-objets.galerie td.editorial p:last-child {
+ margin-bottom: 0;
+}
+.liste-objets.galerie .titre {
+ display: block;
+}
+.liste-objets.galerie .sans-titre {
+ font-weight: normal;
+ font-style: normal;
+ color: var(--spip-color-gray);
+}
+.liste-objets.galerie .descriptif { }
+.liste-objets.galerie .credits { }
+
+/* Modale avec galerie pour choisir */
.popin-choisir_document {}
-.popin-choisir_document .onglets_simple.second {display:none;}
-.popin-choisir_document .galerie table td.id {width:40px;}
-.popin-choisir_document .galerie table td.logo {width:200px;}
-.popin-choisir_document .galerie table td.exif {width:120px;}
-.popin-choisir_document .galerie table td.descriptif {max-width:150px;}
-.popin-choisir_document .galerie table td {word-wrap: break-word;}
+.popin-choisir_document .onglets_simple.second {
+ display: none;
+}
+.popin-choisir_document .liste-objets.galerie td {
+ word-wrap: break-word;
+}
+.popin-choisir_document .liste-objets.galerie tr > .logo {
+ width: 200px;
+}
+.popin-choisir_document .liste-objets.galerie tr > .editorial {
+ max-width: 20em;
+}
+.liste-objets.galerie .fichier {
+ max-width: 12em;
+ word-wrap: initial;
+}
.spip_documents_legende {border:1px solid #GET{foncee};text-align:center;font-size:0.9em;margin:0 0 1em;}
.spip_documents_legende dt {background:#GET{foncee};color:#fff;padding:5px 3px;font-weight:bold;}