2021-04-29 17:40:20 +02:00
|
|
|
// Exemple d'utilisation simple de vCarousel avec 3 vidéos
|
2021-04-01 17:20:09 +02:00
|
|
|
import { vCarousel } from "./vCarousel";
|
2021-03-31 18:14:03 +02:00
|
|
|
|
|
|
|
try
|
|
|
|
{
|
2021-04-29 17:40:20 +02:00
|
|
|
// Initialisation vCarousel :
|
2021-04-01 12:58:47 +02:00
|
|
|
const videosContainers=["vFunanbule", "vForgeron", "vCircuit"];
|
2021-04-29 17:40:20 +02:00
|
|
|
const testvCarousel=new vCarousel();
|
|
|
|
testvCarousel.vContainers=videosContainers;
|
|
|
|
|
2021-04-01 12:58:47 +02:00
|
|
|
// Si un id est fourni par l'url, on affiche cette vidéo en premier :
|
2022-01-18 17:58:25 +01:00
|
|
|
if(window.location.hash !== undefined && window.location.hash !== "")
|
2021-04-29 17:40:20 +02:00
|
|
|
testvCarousel.firstVideoId=window.location.hash.replace("#","");
|
|
|
|
// On lance le carrousel :
|
2022-01-18 17:58:25 +01:00
|
|
|
testvCarousel.playNextVideos=true;
|
2021-04-29 17:40:20 +02:00
|
|
|
testvCarousel.run();
|
2021-04-01 12:58:47 +02:00
|
|
|
|
|
|
|
// Dans le cas où l'utilisateur clique pour sélectionner une vidéo à afficher, on actualise l'affichage :
|
|
|
|
let selectLinks=document.querySelectorAll(".selectVideo");
|
|
|
|
for (let i = 0; i < selectLinks.length; i++)
|
|
|
|
{
|
2022-01-18 17:58:25 +01:00
|
|
|
const link=<HTMLAnchorElement>selectLinks[i];
|
2021-04-01 12:58:47 +02:00
|
|
|
link.addEventListener("click", function(e)
|
|
|
|
{
|
2021-04-29 17:40:20 +02:00
|
|
|
testvCarousel.firstVideoId=link.hash.replace("#","");
|
|
|
|
testvCarousel.playFirstVideo=true;// ici je demande à ce que la lecture de la vidéo choisie soit lancée automatiquement.
|
|
|
|
testvCarousel.run();
|
2021-04-01 12:58:47 +02:00
|
|
|
});
|
|
|
|
}
|
2021-03-31 18:14:03 +02:00
|
|
|
}
|
|
|
|
catch(e)
|
|
|
|
{
|
|
|
|
console.error(e);
|
|
|
|
}
|