[Résolu] pb affiche video dans un inclure

Général
1

SPIP 4.2.6 Je vous soumet le probleme suivant.

1- dans le texte d’un article j’ai chargé une video de 854 × 480 pixels en MP4 filmée avec un telephone.
et chargé une vignette. test successif avec <doc2053|center> et <emb2053|center>
#TEXTE de la page article m’affiche bien cette video en grand avec la vignette en entier.

2- dans la page rubrique j’ai un #INCLURE qui boucle sur les articles de la rubrique et affiche simplement le texte de l’article par #TEXTE. dans ce cas la hauteur affichée de la vignette est la même que dans l’article mais la largeur est divisée par deux. c’est à dire que la vignette est coupée en largeur et étiree en hauteur.

3- pour tester je fait un modele" textart" qui contient

<BOUCLE_ARTICLE(ARTICLES) {id_article=#ENV{id_article} }>
[

(#TEXTE|liens_ouvrants)
]
</BOUCLE_ARTICLE>

ce modele s’affiche correctement par exemple dans le texte d’une rubrique et dans ma boucle sur les articles.

4- je fais un inclure avec SEULEMENT
<BOUCLE_ARTICLE(ARTICLES) {id_article=445}>
[

(#TEXTE|liens_ouvrants)
]
</BOUCLE_ARTICLE>

[(#MODELE{texteart,id_article=445})]

dans ce cas le modele affiche bien la video MAIS PAS LA BOUCLE qui affiche toujours a moitié

cela vient de la ligne generée par spip

<div class="video-intrinsic-wrapper" style="height:0;width:400px;max-width:100%;padding-bottom:103.25%;position:relative;">
	<div class="video-wrapper" style="position: absolute;top:0;left:0;width:100%;height:100%;">
		<span class="mejs__offscreen">Video Player</span><div id="mep_7" class="mejs__container mejs mejs-2053 done mejs__video" tabindex="0" role="application" aria-label="Video Player" style="width: 400px; height: 730.483px; min-width: 219px;"><div class="mejs__inner paused"><div class="mejs__mediaelement"><mediaelementwrapper id="mejs-93d8f12c0a33607841eab44a5e494f06-7"><video class="mejs mejs-2053 done" data-id="93d8f12c0a33607841eab44a5e494f06" data-mejsoptions="{&quot;alwaysShowControls&quot;: true,&quot;pluginPath&quot;:&quot;plugins-dist/medias/lib/mejs/&quot;,&quot;loop&quot;:false,&quot;videoWidth&quot;:&quot;100%&quot;,&quot;videoHeight&quot;:&quot;100%&quot;,&quot;duration&quot;:102}" width="100%" height="100%" poster="local/cache-vignettes/L400xH300/p1060436-d28ff.jpg?1698346779" preload="none" id="mejs-93d8f12c0a33607841eab44a5e494f06-7_html5" style="width: 400px; height: 730.483px;" src="http://localhost/spip422/IMG/mp4/depart_probert.mp4">
			<source type="video/mp4" src="IMG/mp4/depart_probert.mp4">
			<object width="400" height="413" type="application/x-shockwave-flash" data="plugins-dist/medias/lib/mejs/mediaelement-flash-video.swf">
				<param name="movie" value="plugins-dist/medias/lib/mejs/mediaelement-flash-video.swf">
				<param name="flashvars" value="controls=true&amp;file=IMG/mp4/depart_probert.mp4">
				<img src="local/cache-vignettes/L400xH300/p1060436-d28ff.jpg?1698346779" width="400" height="300" alt="Impossible de lire la video">
		  </object>
		</video></mediaelementwrapper></div><div class="mejs__layers"><div class="mejs__poster mejs__layer" style="background-image: url(&quot;local/cache-vignettes/L400xH300/p1060436-d28ff.jpg?1698346779&quot;); width: 100%; height: 100%;"><img class="mejs__poster-img" width="0" height="0" src="local/cache-vignettes/L400xH300/p1060436-d28ff.jpg?1698346779"></div><div style="display: none; width: 100%; height: 100%;" class="mejs__overlay mejs__layer"><div class="mejs__overlay-loading"><span class="mejs__overlay-loading-bg-img"></span></div></div><div style="display: none; width: 100%; height: 100%;" class="mejs__overlay mejs__layer"><div class="mejs__overlay-error"></div></div><div class="mejs__overlay mejs__layer mejs__overlay-play" style="width: 100%; height: 100%;"><div class="mejs__overlay-button" role="button" tabindex="0" aria-label="Play" aria-pressed="false"></div></div></div><div class="mejs__controls"><div class="mejs__button mejs__playpause-button mejs__play"><button type="button" aria-controls="mep_7" title="Play" aria-label="Play" tabindex="0"></button></div><div class="mejs__time mejs__currenttime-container" role="timer" aria-live="off"><span class="mejs__currenttime">00:00</span></div><div class="mejs__time-rail"><span class="mejs__time-total mejs__time-slider"><span class="mejs__time-buffering" style="display: none;"></span><span class="mejs__time-loaded"></span><span class="mejs__time-current"></span><span class="mejs__time-hovered no-hover"></span><span class="mejs__time-handle"><span class="mejs__time-handle-content"></span></span><span class="mejs__time-float" style="display: none; left: 0px;"><span class="mejs__time-float-current">00:00</span><span class="mejs__time-float-corner"></span></span></span></div><div class="mejs__time mejs__duration-container"><span class="mejs__duration">01:42</span></div><div class="mejs__button mejs__volume-button mejs__mute"><button type="button" aria-controls="mep_7" title="Mute" aria-label="Mute" tabindex="0"></button><a href="javascript:void(0);" class="mejs__volume-slider" aria-label="Volume Slider" aria-valuemin="0" aria-valuemax="100" role="slider" aria-orientation="vertical"><span class="mejs__offscreen">Use Up/Down Arrow keys to increase or decrease volume.</span><div class="mejs__volume-total"><div class="mejs__volume-current" style="bottom: 0px; height: 100%;"></div><div class="mejs__volume-handle" style="bottom: 100%; margin-bottom: -3px;"></div></div></a></div><div class="mejs__button mejs__fullscreen-button"><button type="button" aria-controls="mep_7" title="Fullscreen" aria-label="Fullscreen" tabindex="0"></button></div></div></div></div>
	</div>
</div>

dans un cas il y a 400px dans l’autre 854px

<div class="video-intrinsic-wrapper" style="height:0;width:854px;max-width:100%;padding-bottom:56.21%;position:relative;">
	<div class="video-wrapper" style="position: absolute;top:0;left:0;width:100%;height:100%;">
		<span class="mejs__offscreen">Video Player</span><div id="mep_8" class="mejs__container mejs mejs-2053 done mejs__video" tabindex="0" role="application" aria-label="Video Player" style="width: 707.5px; height: 397.683px; min-width: 219px;"><div class="mejs__inner paused"><div class="mejs__mediaelement"><mediaelementwrapper id="mejs-93d8f12c0a33607841eab44a5e494f06-8"><video class="mejs mejs-2053 done" data-id="93d8f12c0a33607841eab44a5e494f06" data-mejsoptions="{&quot;alwaysShowControls&quot;: true,&quot;pluginPath&quot;:&quot;plugins-dist/medias/lib/mejs/&quot;,&quot;loop&quot;:false,&quot;videoWidth&quot;:&quot;100%&quot;,&quot;videoHeight&quot;:&quot;100%&quot;,&quot;duration&quot;:102}" width="100%" height="100%" poster="local/cache-vignettes/L854xH641/p1060436-d41cf.jpg?1697650590" preload="none" id="mejs-93d8f12c0a33607841eab44a5e494f06-8_html5" style="width: 707.5px; height: 397.683px;" src="http://localhost/spip422/IMG/mp4/depart_probert.mp4">
			<source type="video/mp4" src="IMG/mp4/depart_probert.mp4">
			<object width="854" height="480" type="application/x-shockwave-flash" data="plugins-dist/medias/lib/mejs/mediaelement-flash-video.swf">
				<param name="movie" value="plugins-dist/medias/lib/mejs/mediaelement-flash-video.swf">
				<param name="flashvars" value="controls=true&amp;file=IMG/mp4/depart_probert.mp4">
				<img src="local/cache-vignettes/L854xH641/p1060436-d41cf.jpg?1697650590" width="854" height="641" alt="Impossible de lire la video">
		  </object>
		</video></mediaelementwrapper></div><div class="mejs__layers"><div class="mejs__poster mejs__layer" style="background-image: url(&quot;local/cache-vignettes/L854xH641/p1060436-d41cf.jpg?1697650590&quot;); width: 100%; height: 100%;"><img class="mejs__poster-img" width="0" height="0" src="local/cache-vignettes/L854xH641/p1060436-d41cf.jpg?1697650590"></div><div style="display: none; width: 100%; height: 100%;" class="mejs__overlay mejs__layer"><div class="mejs__overlay-loading"><span class="mejs__overlay-loading-bg-img"></span></div></div><div style="display: none; width: 100%; height: 100%;" class="mejs__overlay mejs__layer"><div class="mejs__overlay-error"></div></div><div class="mejs__overlay mejs__layer mejs__overlay-play" style="width: 100%; height: 100%;"><div class="mejs__overlay-button" role="button" tabindex="0" aria-label="Play" aria-pressed="false"></div></div></div><div class="mejs__controls"><div class="mejs__button mejs__playpause-button mejs__play"><button type="button" aria-controls="mep_8" title="Play" aria-label="Play" tabindex="0"></button></div><div class="mejs__time mejs__currenttime-container" role="timer" aria-live="off"><span class="mejs__currenttime">00:00</span></div><div class="mejs__time-rail"><span class="mejs__time-total mejs__time-slider"><span class="mejs__time-buffering" style="display: none;"></span><span class="mejs__time-loaded"></span><span class="mejs__time-current"></span><span class="mejs__time-hovered no-hover"></span><span class="mejs__time-handle"><span class="mejs__time-handle-content"></span></span><span class="mejs__time-float"><span class="mejs__time-float-current">00:00</span><span class="mejs__time-float-corner"></span></span></span></div><div class="mejs__time mejs__duration-container"><span class="mejs__duration">01:42</span></div><div class="mejs__button mejs__volume-button mejs__mute"><button type="button" aria-controls="mep_8" title="Mute" aria-label="Mute" tabindex="0"></button><a href="javascript:void(0);" class="mejs__volume-slider" aria-label="Volume Slider" aria-valuemin="0" aria-valuemax="100" role="slider" aria-orientation="vertical"><span class="mejs__offscreen">Use Up/Down Arrow keys to increase or decrease volume.</span><div class="mejs__volume-total"><div class="mejs__volume-current" style="bottom: 0px; height: 100%;"></div><div class="mejs__volume-handle" style="bottom: 100%; margin-bottom: -3px;"></div></div></a></div><div class="mejs__button mejs__fullscreen-button"><button type="button" aria-controls="mep_8" title="Fullscreen" aria-label="Fullscreen" tabindex="0"></button></div></div></div></div>
	</div>
</div>

854px correspond a la largeur indiquée pour la video ( MPEG4 - 854 × 480 pixels) pour #TEXTE de article et le modele.
même resultat dans l’espace prive : si on clique sur modifier le document : affichage sur 400px. si on voit l’article on est sur 854px.

Est-ce une mauvaise utilisation ou un pb spip ?

2

Pourquoi par endroit il y a bien 854px et d’autre 400 px pour l’affichage de la video?
spip ? configuration ? mon squelette ?
aucune idees … ??
merci

3

Quelques URLs pour voir ?

4

En voulant faire un exemple pour te montrer sur un site en ligne … j’ai enfin trouvé l’erreur.
Mon inclure est appelle par un inclure qui a entre autre un parametre … largeur=#GET{largeur,400} … dont je ne me sert pas dans ce cas mais le modele video prend cette largeur par defaut.
J’ai essaye en mettant largeur=#GET{largeur,1000} et c’est bien de la que vient le problème
donc merci Jean Christophe…