Bonjour.

Ma fonction loadMedia suivante (issue de mon script JavaScript) me permet normalement d'ouvrir des images en Pop-up via la librairie Masonry-JS.

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
function loadMedia(src, className) {
 
	var video = $("<img>");
 
	video.on("load", function() {
		$("." + className + " a").append(video);
 
		clearTimeout(timer);
 
		timer = setTimeout(function() {
			$(".imageResults").masonry();
		}, 500);
 
	});
 
	video.on("error", function() {
 
		$("." + className).remove();
 
		$.post("ajax/setBroken.php", {src: src});
 
	});
 
	video.attr("src", src);
 
}
Le JavaScript du Lecteur "Plyr-JS" est le suivant:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
// Change the second argument to your options:
// https://github.com/sampotts/plyr/#options
const player = new Plyr('video', { captions: { active: true } });
 
// Expose player so it can be used from the console
window.player = player;
Et enfin j'ai ajouté mon code PHP dans "ajax/setBroken.php" pour récupérer l'extention du fichier vidéos et de l'image en miniature est le suivant:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
 
$query = $con->prepare("SELECT * FROM videos");
while($row = $query->fetch(PDO::FETCH_ASSOC)) {
	$videoLink = $row["videoLink"];
	$thumbnail = $row["thumbnail"];
	$vidExtension = $row["video_extension"];				
}
Alors, j'ai quelques questions très importantes:

1 - Comment remplacer le contenu de la variable JavaScript var video = $("<img>"); par le Code HTML du lecteur "Plyr-JS" suivant:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
<video id="player" playsinline controls data-poster="/path/to/poster.jpg">
	<source src="/path/to/video.mp4" type="video/mp4" />
</video>
???

2 - Comment passer la variable $thumbnail à l'attribut data-poster de la balise <video> de sorte à remplacer sa valeur "/path/to/poster.jpg" par cette variable $thumbnail sachant que le Code PHP qui récupère cette variable est dans le fichier ajax/setBroken.php ???

3 - Comment passer également la variable $videoLink à l'attribut src de la balise <source> de sorte à remplacer sa valeur "/path/to/video.mp4" par cette variable $videoLink sachant que le Code PHP qui récupère cette variable est dans le fichier ajax/setBroken.php ???

4 - Comment également, passer la variable $vidExtension à l'attribut type de la balise <source> de sorte à remplacer sa valeur "video/mp4" par cette variable $vidExtension sachant que le Code PHP qui récupère cette variable est dans le fichier ajax/setBroken.php ???

5 -Et enfin, à quel niveau devrais-ajouter le Code JavaScript ci-dessus du Lecteur "Plyr-JS" ???


Merci de m'aider s'il vous plaît.