Browse Source

Modèles d'insertion des documents en HTML5, avec figure et figcaption

git-svn-id: svn://zone.spip.net/spip-zone/_plugins_/figure@102660 ac52e18a-acf5-0310-9fe8-c4428f23b10a
master
tetue 5 years ago
parent
commit
dcc5fcb68a
  1. 58
      modeles/application.html
  2. 34
      modeles/audio.html
  3. 16
      modeles/doc.html
  4. 23
      modeles/doc_legende.html
  5. 47
      modeles/image.html
  6. 10
      modeles/img.html
  7. 11
      modeles/text.html
  8. 2
      modeles/text_csv.html
  9. 11
      modeles/text_html.html
  10. 66
      modeles/video.html
  11. 2
      plugin.xml

58
modeles/application.html

@ -11,37 +11,41 @@
(#ENV{controls}=={PositionSlider}|?{#SET{hauteur,25},''})][
(#ENV{controls}=={PositionSlider}|?{#SET{largeur,#GET{largeur}|moins{40}},''})
][(#INCLUS|=={embed}|?{[(#ENV{controls,''}|non)
<div class='spip_document_#ID_DOCUMENT spip_document_application spip_documents[ spip_documents_(#ENV{align})]'[
<figure class='spip_document_#ID_DOCUMENT spip_document_application spip_documents[ (#ENV{align})]'[
style='[(#ENV{align}|match{^(left|right)$}|oui)float:#ENV{align};] (#ENV{align,center}|=={center}|non)[width:(#GET{largeur}|max{120})px]']>
]})
][(#EXTENSION|=={swf}|oui)
<object classid='clsid:d27cdb6e-ae6d-11cf-96b8-444553540000'
codebase='http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=#ENV{version,'6,0,0,0'}'
width='#GET{largeur}' height='#GET{hauteur}'>
<param name='movie' value='#URL_DOCUMENT' />
[(#ENV{quality,''}|non)<param name="quality" value="high" />]
[(#ENV*|env_to_params)]
<!--#EVAL**{chr(91)}if !IE#EVAL**{chr(93)}> <-->
<object data="#URL_DOCUMENT" width='#GET{largeur}' height='#GET{hauteur}' type="application/x-shockwave-flash">
[(#ENV{quality,''}|non)<param name="quality" value="high" />]
<object classid='clsid:d27cdb6e-ae6d-11cf-96b8-444553540000'
codebase='http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=#ENV{version,'6,0,0,0'}'
width='#GET{largeur}' height='#GET{hauteur}'>
<param name='movie' value='#URL_DOCUMENT'>
[(#ENV{quality,''}|non)<param name="quality" value="high">]
[(#ENV*|env_to_params)]
<param name="pluginurl" value="http://www.macromedia.com/go/getflashplayer" />
<!--#EVAL**{chr(91)}if !IE#EVAL**{chr(93)}> <-->
<object data="#URL_DOCUMENT" width='#GET{largeur}' height='#GET{hauteur}' type="application/x-shockwave-flash">
[(#ENV{quality,''}|non)<param name="quality" value="high">]
[(#ENV*|env_to_params)]
<param name="pluginurl" value="http://www.macromedia.com/go/getflashplayer">
</object>
<!--> <!#EVAL**{chr(91)}endif#EVAL**{chr(93)}-->
</object>
<!--> <!#EVAL**{chr(91)}endif#EVAL**{chr(93)}-->
</object>
#SET{done,1}
][(#GET{done,0}|non)
[(#INCLUS|=={embed}|oui)
<object width='#GET{largeur}' height='#GET{hauteur}'>
<param name='movie' value='#URL_DOCUMENT' />
<param name='src' value='#URL_DOCUMENT' />
[(#ENV*|env_to_params)]
<embed src='#URL_DOCUMENT' [(#ENV*|env_to_attributs)] width='#GET{largeur}' height='#GET{hauteur}'></embed></object>
#SET{done,1}
][(#GET{done,0}|non)
[(#INCLUS|=={embed}|oui)
<object width='#GET{largeur}' height='#GET{hauteur}'>
<param name='movie' value='#URL_DOCUMENT'>
<param name='src' value='#URL_DOCUMENT'>
[(#ENV*|env_to_params)]
<embed src='#URL_DOCUMENT' [(#ENV*|env_to_attributs)] width='#GET{largeur}' height='#GET{hauteur}'></embed></object>
][(#INCLUS|=={image}|oui)
[(#INCLURE{fond=modeles/img}{id_document}{align=#ENV{align}}{embed=oui}{lien=#ENV{lien}}{lien_class=#ENV{lien_class}})]
]
][(#INCLUS|=={embed}|oui)[(#ENV{controls,''}|non)
[<div class='#EDIT{titre} spip_doc_titre'><strong>(#TITRE)</strong></div>][<div class='#EDIT{descriptif} spip_doc_descriptif'>(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]</div>]</div>
][(#INCLUS|=={image}|oui)
[(#INCLURE{fond=modeles/img}{id_document}{align=#ENV{align}}{embed=oui}{lien=#ENV{lien}}{lien_class=#ENV{lien_class}})]
]
][(#INCLUS|=={embed}|oui)[(#ENV{controls,''}|non)
<figcaption class='#EDIT{descriptif} spip_doc_descriptif'>[
<strong class='#EDIT{titre} spip_doc_titre'>(#TITRE)</strong>]
[(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]
]</figcaption>
</figure>
]]
</BOUCLE_tous>
</BOUCLE_tous>

34
modeles/audio.html

@ -1,21 +1,23 @@
<BOUCLE_tous (DOCUMENTS types_documents) {id_document=#ID} {tout}>
#SET{largeur,#ENV{largeur, #LARGEUR|?{#LARGEUR,400}}|max{120}}
<div class='spip_document_#ID_DOCUMENT spip_document_audio spip_documents[ spip_documents_(#ENV{align})]'
<figure class='spip_document_#ID_DOCUMENT spip_document_audio spip_documents[ (#ENV{align})]'
style='[(#ENV{align}|match{^(left|right)$}|oui)float:#ENV{align};][width:(#GET{largeur})px]'>
[(#LOGO_DOCUMENT{vignette}|image_reduire{#GET{largeur},0}|vider_attribut{class})]
<div class="audio-wrapper"[ style='width:(#GET{largeur})px;max-width:100%;']>
<audio class="mejs mejs-#ID_DOCUMENT [ mejs-(#ENV{skin})]"
data-id="[(#VAL{mejs-#ID_DOCUMENT}|concat{#ENV{skin}}|md5)]"
src="#FICHIER"
type="#MIME_TYPE"
data-mejsoptions='{"alwaysShowControls": true[,"loop":(#ENV{loop}|?{true,false})],"audioWidth":"100%"[,"audioHeight":"(#ENV{hauteur})"][,"startVolume":"(#ENV{volume})"]}'
controls="controls"
[autoplay="autoplay"(#ENV{autoplay}|oui)]></audio>
</div>
[<div class='#EDIT{titre} spip_doc_titre'><strong>(#TITRE)</strong></div>]
[<div class='#EDIT{descriptif} spip_doc_descriptif'>(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]</div>]
[<script>/*<!\[CDATA\[*/var mejspath='[(#CHEMIN{lib/mejs/mediaelement-and-player.min.js}|timestamp)]',mejscss='[(#CHEMIN{lib/mejs/mediaelementplayer.min.css}|timestamp)]';
(#INCLURE{javascript/mejs-init.min.js})/*\]\]>*/</script>]
[(#ENV{skin}|oui)[<style>(#INCLURE{#CHEMIN{css/mejs-skin-#ENV{skin}.css}|sinon{#CHEMIN{lib/mejs/mejs-skins.css}}|url_absolue_css})</style>]]
</div>
<div class="audio-wrapper"[ style='width:(#GET{largeur})px;max-width:100%;']>
<audio class="mejs mejs-#ID_DOCUMENT [ mejs-(#ENV{skin})]"
data-id="[(#VAL{mejs-#ID_DOCUMENT}|concat{#ENV{skin}}|md5)]"
src="#FICHIER"
type="#MIME_TYPE"
data-mejsoptions='{"alwaysShowControls": true[,"loop":(#ENV{loop}|?{true,false})],"audioWidth":"100%"[,"audioHeight":"(#ENV{hauteur})"][,"startVolume":"(#ENV{volume})"]}'
controls="controls"
[autoplay="autoplay"(#ENV{autoplay}|oui)]></audio>
</div>
<figcaption class='#EDIT{descriptif} spip_doc_descriptif'>[
<strong class='#EDIT{titre} spip_doc_titre'>(#TITRE)</strong>]
[(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]
]</figcaption>
[<script>/*<!\[CDATA\[*/var mejspath='[(#CHEMIN{lib/mejs/mediaelement-and-player.min.js}|timestamp)]',mejscss='[(#CHEMIN{lib/mejs/mediaelementplayer.min.css}|timestamp)]';
(#INCLURE{javascript/mejs-init.min.js})/*\]\]>*/</script>]
[(#ENV{skin}|oui)[<style>(#INCLURE{#CHEMIN{css/mejs-skin-#ENV{skin}.css}|sinon{#CHEMIN{lib/mejs/mejs-skins.css}}|url_absolue_css})</style>]]
</figure>
</BOUCLE_tous>

16
modeles/doc.html

@ -35,14 +35,16 @@
]
[(#SET{title,[(#TYPE_DOCUMENT) - [(#TAILLE|taille_en_octets)]]})]
[(#MEDIA|=={image}|oui) #SET{title,#TITRE|sinon{#GET{title}}]
<dl class='spip_document_#ID_DOCUMENT spip_documents[ spip_documents_(#ENV{align})][ (#ENV{class})] spip_lien_ok'[
<figure class='spip_document_#ID_DOCUMENT spip_documents[ (#ENV{align})][ (#ENV{class})] spip_lien_ok'[
style='float:(#ENV{align}|match{left|right});']>
<dt>[<a href="(#GET{url})"[
class="(#ENV{lien_class})"] title='[(#GET{title}|attribut_html)]'[
(#ENV{lien}|?{'',type="#MIME_TYPE"})]>]<img src='#GET{fichier}' width='#GET{width}' height='#GET{height}' alt='#TYPE_DOCUMENT - [(#TAILLE|taille_en_octets|texte_backend)]' />[(#GET{url}|?{</a>})]</dt>[
<dt class='#EDIT{titre} spip_doc_titre'[ style='width:(#GET{width}|min{350}|max{120})px;']><strong>(#TITRE)</strong></dt>][
<dd class='#EDIT{descriptif} spip_doc_descriptif'[ style='width:(#GET{width}|min{350}|max{120})px;']>(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]</dd>]
</dl>
[<a href="(#GET{url})"[
class="(#ENV{lien_class})"] title='[(#GET{title}|attribut_html)]'[
(#ENV{lien}|?{'',type="#MIME_TYPE"})]>]<img src='#GET{fichier}' width='#GET{width}' height='#GET{height}' alt='#TYPE_DOCUMENT - [(#TAILLE|taille_en_octets|texte_backend)]'>[(#GET{url}|?{</a>})]
<figcaption class='#EDIT{descriptif} spip_doc_descriptif'[ style='width:(#GET{width}|min{350}|max{120})px;']>[
<strong class='#EDIT{titre} spip_doc_titre'>(#TITRE)</strong>]
[(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]
]</figcaption>
</figure>
</BOUCLE_doc>
#FILTRE{trim}

23
modeles/doc_legende.html

@ -1,9 +1,6 @@
<BOUCLE_doc (DOCUMENTS) {id_document} {tout}>
[(#REM)
Modele pour <doc> en dl/dt/dd
cf. http://pompage.net/pompe/listesdefinitions/
La largeur de la legende est egale a la largeur de l'image
avec un minimum de 120px, et un maximum de 350px.
@ -27,12 +24,14 @@
#SET{height,#GET{fichier}|hauteur}
#SET{fichier,#GET{fichier}|extraire_attribut{src}}
]
<dl class='spip_document_#ID_DOCUMENT spip_documents_legende[ spip_documents_(#ENV{align})][ (#ENV{class})] spip_lien_ok'[ style='float:(#ENV{align}|match{left|right});']>
[<dt class='#EDIT{titre} titre'>(#TITRE|sinon{#FICHIER})</dt>]
<dd class='vignette'>[<a href="(#GET{url})"[ class="(#ENV{lien_class})"] title='#TYPE_DOCUMENT - [(#TAILLE|taille_en_octets|texte_backend)]'[ (#ENV{lien}|?{'',type="#MIME_TYPE"})]>]<img src='#GET{fichier}' width='#GET{width}' height='#GET{height}' alt='' />[(#GET{url}|?{</a>})]</dd>
<dd class='type'>#TYPE_DOCUMENT</dd>
<dd class='taille'>[(#LARGEUR|ou{#HAUTEUR}|oui)[
(#VAL{info_largeur_vignette}|_T{#ARRAY{largeur_vignette,#LARGEUR,hauteur_vignette,#HAUTEUR}})
] - ][(#TAILLE|taille_en_octets|texte_backend)]</dd>
</dl>
</BOUCLE_doc>
<figure class='spip_document_#ID_DOCUMENT spip_documents_legende[ (#ENV{align})][ (#ENV{class})] spip_lien_ok'[ style='float:(#ENV{align}|match{left|right});']>
<span class='vignette'>[<a href="(#GET{url})"[ class="(#ENV{lien_class})"] title='#TYPE_DOCUMENT - [(#TAILLE|taille_en_octets|texte_backend)]'[ (#ENV{lien}|?{'',type="#MIME_TYPE"})]>]<img src='#GET{fichier}' width='#GET{width}' height='#GET{height}' alt=''>[(#GET{url}|?{</a>})]</span>
<ficaption>
[<strong class='#EDIT{titre} titre'>(#TITRE|sinon{#FICHIER})</strong>]
<span class='type'>#TYPE_DOCUMENT</span>
<span class='taille'>[(#LARGEUR|ou{#HAUTEUR}|oui)[
(#VAL{info_largeur_vignette}|_T{#ARRAY{largeur_vignette,#LARGEUR,hauteur_vignette,#HAUTEUR}})
] - ][(#TAILLE|taille_en_octets|texte_backend)]</span>
</ficaption>
</figure>
</BOUCLE_doc>

47
modeles/image.html

@ -3,14 +3,14 @@
(#REM) Cas <imageXX> : equivalent a <imgXX> pour une image en mode image
][(#INCLUS|=={image}|et{#ENV{emb,''}|non}|oui)
<span class='spip_document_#ID_DOCUMENT spip_documents[ spip_documents_(#ENV{align})][ (#ENV{class})] spip_lien_ok'[
<span class='spip_document_#ID_DOCUMENT spip_documents[ (#ENV{align})][ (#ENV{class})] spip_lien_ok'[
style='float:(#ENV{align}|match{left|right});']>[
<a href="(#ENV{lien})"[
class="(#ENV{lien_class})"]>]<img src='#URL_DOCUMENT'[
width="(#LARGEUR|?{#LARGEUR})"][
height="(#HAUTEUR|?{#HAUTEUR})"][
title="(#TITRE|attribut_html)"]
alt="[(#TITRE|attribut_html)]" />[(#ENV{lien}|?{</a>})]</span>
alt="[(#TITRE|attribut_html)]">[(#ENV{lien}|?{</a>})]</span>
][
(#REM) Cas <embXX> : on est appele ici avec emb=' ' : on veut la legende
@ -21,29 +21,32 @@ equivalent a un <docXX> pour une image en mode image
#SET{width,#LARGEUR}
#SET{height,#HAUTEUR}
#SET{url,#ENV{lien}}
<dl class='spip_document_#ID_DOCUMENT spip_documents[ spip_documents_(#ENV{align})][ (#ENV{class})] spip_lien_ok'[
style='float:(#ENV{align}|match{left|right});[width:(#GET{width}|max{120})]px;']>
<dt>[<a href="(#GET{url})"[ class="(#ENV{lien_class})"] title='#TYPE_DOCUMENT - [(#TAILLE|taille_en_octets|texte_backend)]'[ type="(#ENV{lien}|?{#ENV{lien_mime},#MIME_TYPE})"]>]<img src='#GET{fichier}' width='#GET{width}' height='#GET{height}' alt='#TYPE_DOCUMENT - [(#TAILLE|taille_en_octets|texte_backend)]' />[(#GET{url}|?{</a>})]</dt>[
<dt class='#EDIT{titre} spip_doc_titre'[ style='width:(#GET{width}|min{350}|max{120})px;']><strong>(#TITRE)</strong></dt>][
<dd class='#EDIT{descriptif} spip_doc_descriptif'[ style='width:(#GET{width}|min{350}|max{120})px;']>(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]</dd>]
</dl>
<figure class='spip_document_#ID_DOCUMENT spip_documents[ (#ENV{align})][ (#ENV{class})] spip_lien_ok'[
style='float:(#ENV{align}|match{left|right});[width:(#GET{width}|max{120})]px;']>
[<a href="(#GET{url})"[ class="(#ENV{lien_class})"] title='#TYPE_DOCUMENT - [(#TAILLE|taille_en_octets|texte_backend)]'[ type="(#ENV{lien}|?{#ENV{lien_mime},#MIME_TYPE})"]>]<img src='#GET{fichier}' width='#GET{width}' height='#GET{height}' alt='#TYPE_DOCUMENT - [(#TAILLE|taille_en_octets|texte_backend)]'>[(#GET{url}|?{</a>})]
<figcaption class='#EDIT{descriptif} spip_doc_descriptif'[ style='width:(#GET{width}|min{350}|max{120})px;']>[
<strong class='#EDIT{titre} spip_doc_titre'>(#TITRE)</strong>]
[(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]
]</figcaption>
</figure>
][
(#REM) Cas des images qu'il faut embed (svg)
][
(#INCLUS|=={embed}|oui)
<div class='spip_document_#ID_DOCUMENT spip_documents[ spip_documents_(#ENV{align})]'[
<figure class='spip_document_#ID_DOCUMENT spip_documents[ (#ENV{align})]'[
style='[(#ENV{align}|match{^(left|right)$}|?{' '})float:#ENV{align};] (#ENV{align,center}|=={center}|?{'',' '})']>
<object data='#URL_DOCUMENT'
type='#MIME_TYPE'[
width='(#ENV{largeur}?{'', #LARGEUR})'][
height='(#ENV{hauteur}?{'', #HAUTEUR})']
[(#ENV*|env_to_attributs)] >
<param name='src' value='#URL_DOCUMENT' />
[(#ID_DOCUMENT|appliquer_filtre{#MIME_TYPE})]
</object>[
<div class='#EDIT{titre} spip_doc_titre'><strong>(#TITRE)</strong></div>
][
<div class='#EDIT{descriptif} spip_doc_descriptif'>(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]</div>
]</div>]
</BOUCLE_tous>
<object data='#URL_DOCUMENT'
type='#MIME_TYPE'[
width='(#ENV{largeur}?{'', #LARGEUR})'][
height='(#ENV{hauteur}?{'', #HAUTEUR})']
[(#ENV*|env_to_attributs)] >
<param name='src' value='#URL_DOCUMENT'>
[(#ID_DOCUMENT|appliquer_filtre{#MIME_TYPE})]
</object>
<figcaption class='#EDIT{descriptif} spip_doc_descriptif'>[
<strong class='#EDIT{titre} spip_doc_titre'>(#TITRE)</strong>]
[(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]
]</figcaption>
</figure>]
</BOUCLE_tous>

10
modeles/img.html

@ -36,9 +36,9 @@
(#REM) image complete ?
][(#GET{image})
<span class='spip_document_#ID_DOCUMENT spip_documents[ spip_documents_(#ENV{align})][ (#ENV{class})] spip_lien_ok'[
<span class='spip_document_#ID_DOCUMENT spip_documents[ (#ENV{align})][ (#ENV{class})] spip_lien_ok'[
style='float:(#ENV{align}|match{left|right});']>
[<a href="(#ENV{lien})"[ class="(#ENV{lien_class})"]>]<img src='#URL_DOCUMENT'[ width="(#LARGEUR)"][ height="(#HAUTEUR)"] alt="[(#TITRE|texte_backend)]"[ title="(#TITRE|texte_backend)"] />[(#ENV{lien}|?{</a>})]</span>
[<a href="(#ENV{lien})"[ class="(#ENV{lien_class})"]>]<img src='#URL_DOCUMENT'[ width="(#LARGEUR)"][ height="(#HAUTEUR)"] alt="[(#TITRE|texte_backend)]"[ title="(#TITRE|texte_backend)"]>[(#ENV{lien}|?{</a>})]</span>
][
(#REM) sinon logo document + lien + alt + title etc
@ -47,7 +47,7 @@
[(#SET{fichier,[(#LOGO_DOCUMENT|extraire_attribut{src})]})]
[(#SET{width,[(#LOGO_DOCUMENT|extraire_attribut{width})]})]
[(#SET{height,[(#LOGO_DOCUMENT|extraire_attribut{height})]})]
<span class='spip_document_#ID_DOCUMENT spip_documents[ spip_documents_(#ENV{align})][ (#ENV{class})] spip_lien_ok'[
<span class='spip_document_#ID_DOCUMENT spip_documents[ (#ENV{align})][ (#ENV{class})] spip_lien_ok'[
style='float:(#ENV{align}|match{left|right});[ width:(#GET{width})px;]']><a href="[(#ENV{lien}|sinon{#URL_DOCUMENT})]"[
(#ENV{lien}|?{'',type="#MIME_TYPE"})][ title="(#TITRE|texte_backend)"]><img src='#GET{fichier}' width='#GET{width}' height='#GET{height}' alt='[(#TITRE|strlen|?{#TITRE {#TYPE_DOCUMENT},#TYPE_DOCUMENT}|attribut_html)]' /></a></span>
]</BOUCLE_document>
(#ENV{lien}|?{'',type="#MIME_TYPE"})][ title="(#TITRE|texte_backend)"]><img src='#GET{fichier}' width='#GET{width}' height='#GET{height}' alt='[(#TITRE|strlen|?{#TITRE {#TYPE_DOCUMENT},#TYPE_DOCUMENT}|attribut_html)]'></a></span>
]</BOUCLE_document>

11
modeles/text.html

@ -1,6 +1,9 @@
<BOUCLE_tous (DOCUMENTS types_documents) {id_document=#ID} {tout}
>[<div class='spip_document_#ID_DOCUMENT spip_documents[ spip_documents_(#ENV{align})]'
>[<figure class='spip_document_#ID_DOCUMENT spip_documents[ (#ENV{align})]'
><pre>(#FICHIER|contenu_document{#ENV{charset,auto}}|echapper_tags)</pre>
[<div class='#EDIT{titre} spip_doc_titre'><strong>(#TITRE)</strong></div>][<div class='#EDIT{descriptif} spip_doc_descriptif'>(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]</div>]
</div>
]</BOUCLE_tous>
<figcaption class='#EDIT{descriptif} spip_doc_descriptif'>[
<strong class='#EDIT{titre} spip_doc_titre'>(#TITRE)</strong>]
[(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]
]</figcaption>
</figure>
]</BOUCLE_tous>

2
modeles/text_csv.html

@ -1,3 +1,3 @@
<BOUCLE_tous (DOCUMENTS types_documents) {id_document=#ID} {tout}
>[(#FICHIER|contenu_document{#ENV{charset,auto}}|appliquer_filtre{#MIME_TYPE}
)]</BOUCLE_tous>
)]</BOUCLE_tous>

11
modeles/text_html.html

@ -1,6 +1,9 @@
<BOUCLE_tous (DOCUMENTS types_documents) {id_document=#ID} {tout}
>[<div class='spip_document_#ID_DOCUMENT spip_documents[ spip_documents_(#ENV{align})]'
>[<figure class='spip_document_#ID_DOCUMENT spip_documents[ (#ENV{align})]'
><object data="(#URL_DOCUMENT)" width="100%" height="400"><a href="#URL_DOCUMENT">#FICHIER</a></object>
[<div class='#EDIT{titre} spip_doc_titre'><strong>(#TITRE)</strong></div>][<div class='#EDIT{descriptif} spip_doc_descriptif'>(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]</div>]
</div>
]</BOUCLE_tous>
<figcaption class='#EDIT{descriptif} spip_doc_descriptif'>[
<strong class='#EDIT{titre} spip_doc_titre'>(#TITRE)</strong>]
[(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]
]</figcaption>
</figure>
]</BOUCLE_tous>

66
modeles/video.html

@ -1,4 +1,4 @@
<BOUCLE_tous(DOCUMENTS types_documents) {id_document=#ID} {tout}>[
<BOUCLE_tous (DOCUMENTS types_documents) {id_document=#ID} {tout}>[
(#REM) on trouvera plusieurs variable de hauteur/largeur
- les balises #HAUTEUR et #LARGEUR
- #ENV{hauteur} et {largeur} correspondant <emb|hauteur=xx...>
@ -7,41 +7,43 @@
]
#SET{largeur,#ENV{largeur, #LARGEUR|?{#LARGEUR,480}}|max{120}}
#SET{hauteur,#ENV{hauteur, #HAUTEUR|?{#HAUTEUR,300}}|max{75}}
<div class='spip_document_#ID_DOCUMENT spip_document_video spip_documents[ spip_documents_(#ENV{align})]'
<figure class='spip_document_#ID_DOCUMENT spip_document_video spip_documents[ (#ENV{align})]'
style='[(#ENV{align}|match{^(left|right)$}|oui)float:#ENV{align};][width:(#GET{largeur})px]'>
<div class="video-intrinsic-wrapper" style='height:0;width:100%;padding-bottom:[(#GET{hauteur}|div{#GET{largeur}}|mult{100}|round{2})]%;position:relative;'>
<div class="video-wrapper" style="position: absolute;top:0;left:0;width:100%;height:100%;">
<video class="mejs mejs-#ID_DOCUMENT[ mejs-(#ENV{skin})]"
data-id="[(#VAL{mejs-#ID_DOCUMENT}|concat{#ENV{skin}}|md5)]"
data-mejsoptions='{"alwaysShowControls": true,"pluginPath":"[(#CHEMIN{lib/mejs/flashmediaelement.swf}|dirname)/]"[,"loop":(#ENV{loop}|?{true,false})],"videoWidth":"100%","videoHeight":"100%"[,"startVolume":"(#ENV{volume})"]}'
width="100%"
height="100%"
poster="[(#LOGO_DOCUMENT{vignette}|image_reduire{#GET{largeur},0}|extraire_attribut{src})]"
controls="controls"
preload="none"[
autoplay="autoplay"(#ENV{autoplay}|oui)]
>
<source type="[(#EXTENSION|in_array{#LISTE{mp4,webm,ogv}}|?{[(#MIME_TYPE|replace{application/,video/})],#MIME_TYPE})]" src="#FICHIER" />
[(#REM)
<div class="video-intrinsic-wrapper" style='height:0;width:100%;padding-bottom:[(#GET{hauteur}|div{#GET{largeur}}|mult{100}|round{2})]%;position:relative;'>
<div class="video-wrapper" style="position: absolute;top:0;left:0;width:100%;height:100%;">
<video class="mejs mejs-#ID_DOCUMENT[ mejs-(#ENV{skin})]"
data-id="[(#VAL{mejs-#ID_DOCUMENT}|concat{#ENV{skin}}|md5)]"
data-mejsoptions='{"alwaysShowControls": true,"pluginPath":"[(#CHEMIN{lib/mejs/flashmediaelement.swf}|dirname)/]"[,"loop":(#ENV{loop}|?{true,false})],"videoWidth":"100%","videoHeight":"100%"[,"startVolume":"(#ENV{volume})"]}'
width="100%"
height="100%"
poster="[(#LOGO_DOCUMENT{vignette}|image_reduire{#GET{largeur},0}|extraire_attribut{src})]"
controls="controls"
preload="none"[
autoplay="autoplay"(#ENV{autoplay}|oui)]
>
<source type="[(#EXTENSION|in_array{#LISTE{mp4,webm,ogv}}|?{[(#MIME_TYPE|replace{application/,video/})],#MIME_TYPE})]" src="#FICHIER">
[(#REM)
Flash fallback for non-HTML5 browsers without JavaScript
Flash fallback for non-HTML5 browsers without JavaScript
]<object width="#GET{largeur}" height="#GET{hauteur}" type="application/x-shockwave-flash" data="#CHEMIN{lib/mejs/flashmediaelement.swf}">
<param name="movie" value="#CHEMIN{lib/mejs/flashmediaelement.swf}" />
<param name="flashvars" value="controls=true&amp;file=#FICHIER" />
[(#REM)
]<object width="#GET{largeur}" height="#GET{hauteur}" type="application/x-shockwave-flash" data="#CHEMIN{lib/mejs/flashmediaelement.swf}">
<param name="movie" value="#CHEMIN{lib/mejs/flashmediaelement.swf}">
<param name="flashvars" value="controls=true&amp;file=#FICHIER">
[(#REM)
Image as a last resort
Image as a last resort
][(#LOGO_DOCUMENT|image_reduire{#GET{largeur},0}|vider_attribut{class}|inserer_attribut{alt,'Impossible de lire la video'})]
</object>
</video>
][(#LOGO_DOCUMENT|image_reduire{#GET{largeur},0}|vider_attribut{class}|inserer_attribut{alt,'Impossible de lire la video'})]
</object>
</video>
</div>
</div>
</div>
[<div class='#EDIT{titre} spip_doc_titre'><strong>(#TITRE)</strong></div>]
[<div class='#EDIT{descriptif} spip_doc_descriptif'>(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]</div>]
[<script>/*<!\[CDATA\[*/var mejspath='[(#CHEMIN{lib/mejs/mediaelement-and-player.min.js}|timestamp)]',mejscss='[(#CHEMIN{lib/mejs/mediaelementplayer.min.css}|timestamp)]';
(#INCLURE{javascript/mejs-init.min.js})/*\]\]>*/</script>]
[(#ENV{skin}|oui)[<style>(#INCLURE{#CHEMIN{css/mejs-skin-#ENV{skin}.css}|sinon{#CHEMIN{lib/mejs/mejs-skins.css}}|url_absolue_css})</style>]]
</div>
<figcaption class='#EDIT{descriptif} spip_doc_descriptif'>[
<strong class='#EDIT{titre} spip_doc_titre'>(#TITRE)</strong>]
[(#DESCRIPTIF|PtoBR)[(#NOTES|PtoBR)]
]</figcaption>
[<script>/*<!\[CDATA\[*/var mejspath='[(#CHEMIN{lib/mejs/mediaelement-and-player.min.js}|timestamp)]',mejscss='[(#CHEMIN{lib/mejs/mediaelementplayer.min.css}|timestamp)]';
(#INCLURE{javascript/mejs-init.min.js})/*\]\]>*/</script>]
[(#ENV{skin}|oui)[<style>(#INCLURE{#CHEMIN{css/mejs-skin-#ENV{skin}.css}|sinon{#CHEMIN{lib/mejs/mejs-skins.css}}|url_absolue_css})</style>]]
</figure>
</BOUCLE_tous>

2
plugin.xml

@ -3,7 +3,7 @@
<prefix>figure</prefix>
<icon>figure.png</icon>
<version>0.0.2</version>
<version>0.1.0</version>
<etat>dev</etat>
<categorie>multimedia</categorie>

Loading…
Cancel
Save