https://filmetonjob.fr/js/videos.js

1var FiltreActif_Secteur = "Secteur";
2var FiltreActif_Region = "Région";
3var FiltreActif_Laureat = "Lauréats";
4var FiltreActif_Edition = "Édition";
5var search = "Aucun filtre";
6var filtresSecteur = document.getElementById("filtres-secteur");
7var filtresRegion = document.getElementById("filtres-region");
8var filtresLaureat = document.getElementById("filtres-laureat");
9var filtresEdition = document.getElementById("filtres-edition");
10
11var btn_secteur_statut = "fermer";
12var btn_region_statut = "fermer";
13var btn_laureat_statut = "fermer";
14var btn_edition_statut = "fermer";
15
16var section_videos = null;
17
18var filtres = null;
19//var pages = document.getElementById("videos-pages");
20
21/********** POPUP **********/
22
23// Variables
24var popup = document.getElementById("popup");
25var background_popup = document.getElementById("background-popup");
26
27var popup_iframe = document.getElementById("popup-iframe");
28// var lien_suffix = "https://www.youtube.com/embed/";
29
30var popup_prenom = document.getElementById("popup-prenom");
31var popup_prix = document.getElementById("popup-prix");
32var popup_metier = document.getElementById("popup-metier");
33var popup_cfa = document.getElementById("popup-cfa");
34var popup_entreprise = document.getElementById("popup-entreprise");
35var popup_formation = document.getElementById("popup-formation");
36var popup_secteur = document.getElementById("popup-secteur");
37var popup_region = document.getElementById("popup-region");
38var popup_edition = document.getElementById("popup-edition");
39
40function getVideoIframeSrc(videoRef) {
41    if (videoRef.startsWith("http")) {
42        if (videoRef.includes("youtube.com") || videoRef.includes("youtu.be")) {
43            let videoId = "";
44
45            if (videoRef.includes("youtu.be")) {
46                videoId = videoRef.split("youtu.be/")[1];
47            } else {
48                let urlParams = new URLSearchParams(new URL(videoRef).search);
49                videoId = urlParams.get("v");
50            }
51
52            return "https://www.youtube.com/embed/" + videoId;
53        }
54
55        return videoRef; // autre lien externe
56    }
57
58    // Cas local : chemin vers /videos/
59    return "/videos_2025/" + videoRef;
60}
61
62// Afficher le popup
63function Afficher(
64  prenom,
65  prix,
66  edition,
67  metier,
68  cfa,
69  entreprise,
70  lien,
71  formation,
72  secteur,
73  region
74) {
75  popup.classList.remove("Masquer");
76  background_popup.classList.remove("Masquer");
77  section_videos.classList.add("floutage");
78
79  // lien = lien_suffix + lien.substr(17);
80  popup_iframe.src = getVideoIframeSrc(lien); // ou ta variable réelle
81
82  //console.log("lien = " + lien);
83  // popup_iframe.src = lien;
84
85  popup_prenom.innerHTML = prenom;
86  popup_prix.innerHTML = prix;
87
88  popup_metier.innerHTML = metier;
89  popup_cfa.innerHTML = cfa;
90  popup_entreprise.innerHTML = entreprise;
91  popup_formation.innerHTML = formation;
92  popup_secteur.innerHTML = secteur;
93  popup_region.innerHTML = region;
94  popup_edition.innerHTML = edition;
95}
96
97// Masquer le popup
98function Masquer() {
99  document.getElementById("popup").classList.add("Masquer");
100  document.getElementById("background-popup").classList.add("Masquer");
101  section_videos.classList.remove("floutage");
102  popup_iframe.src = "";
103}
104
105/********** FILTRAGE **********/
106
107// Filtres Secteur
108for (let a of document.querySelectorAll("#filtres-secteur a")) {
109  a.onclick = function () {
110    Filtrer(this.innerHTML, "secteur");
111  };
112}
113
114// Filtres Région
115for (let a of document.querySelectorAll("#filtres-region a")) {
116  a.onclick = function () {
117    Filtrer(this.innerHTML, "region");
118  };
119}
120
121// Filtres Lauréat
122for (let a of document.querySelectorAll("#filtres-laureat a")) {
123  a.onclick = function () {
124    Filtrer(this.innerHTML, "laureat");
125  };
126}
127
128// Filtres Édition
129for (let a of document.querySelectorAll("#filtres-edition a")) {
130  a.onclick = function () {
131    Filtrer(this.innerHTML, "edition");
132  };
133}
134
135function Filtrer(filtre, type) {
136  /*** Filtres actifs & Variables ***/
137
138  /*** Variable & Titre filtre ***/
139  if (type == "secteur") {
140    FiltreActif_Secteur = filtre;
141    filtres = filtresSecteur.getElementsByClassName("filtre");
142    if (FiltreActif_Secteur == "Tous les secteurs") {
143      document.getElementById("titre-filtre-secteur").innerHTML = "Secteur";
144    } else {
145      document.getElementById("titre-filtre-secteur").innerHTML =
146        FiltreActif_Secteur;
147    }
148    BtnFiltreSecteur();
149  } else if (type == "region") {
150    FiltreActif_Region = filtre;
151    filtres = filtresRegion.getElementsByClassName("filtre");
152    if (FiltreActif_Region == "Toutes les régions") {
153      document.getElementById("titre-filtre-region").innerHTML = "Région";
154    } else {
155      document.getElementById("titre-filtre-region").innerHTML =
156        FiltreActif_Region;
157    }
158    BtnFiltreRegion();
159  } else if (type == "laureat") {
160    FiltreActif_Laureat = filtre;
161    filtres = filtresLaureat.getElementsByClassName("filtre");
162    if (FiltreActif_Laureat == "Réinitialiser le filtre") {
163      document.getElementById("titre-filtre-laureat").innerHTML = "Lauréats";
164    } else {
165      document.getElementById("titre-filtre-laureat").innerHTML =
166        FiltreActif_Laureat;
167    }
168    BtnFiltreLaureat();
169  } else {
170    FiltreActif_Edition = filtre;
171    filtres = filtresEdition.getElementsByClassName("filtre");
172    if (FiltreActif_Edition == "Toutes les éditions") {
173      document.getElementById("titre-filtre-edition").innerHTML = "Édition";
174    } else {
175      document.getElementById("titre-filtre-edition").innerHTML =
176        FiltreActif_Edition;
177    }
178    BtnFiltreEdition();
179  }
180
181  /*** Onglets ***/
182  for (let i = 0; i < filtres.length; i++) {
183    if (filtres[i].innerHTML == filtre) {
184      filtres[i].classList.add("actif");
185    } else {
186      filtres[i].classList.remove("actif");
187    }
188  }
189
190  /*** Filtrage ***/
191  Url();
192}
193function Url() {
194  url =
195    "/pages/loads/load_videos.php?parPage=" +
196    parPage +
197    "&region=" +
198    FiltreActif_Region.split(" ").join("%20") +
199    "&secteur=" +
200    FiltreActif_Secteur.split(" ").join("%20") +
201    "&laureat=" +
202    FiltreActif_Laureat.split(" ").join("%20") +
203    "&search=" +
204    search.split(" ").join("%20") +
205    "&edition=" +
206    FiltreActif_Edition.split(" ").join("%20") +
207    "&pagination=" +
208    pagination +
209    " .videos-page";
210  $("#videos-pages").load(url);
211  console.log(url);
212}
213
214/********** BOUTONS **********/
215function FermerAllBtn() {
216  btn_secteur_statut = "fermer";
217  btn_region_statut = "fermer";
218  btn_laureat_statut = "fermer";
219  btn_edition_statut = "fermer";
220  boutons = document.getElementsByClassName("filtres");
221  for (let i = 0; i < boutons.length; i++) {
222    boutons[i].classList.remove("actif");
223  }
224  console.log("Boutons fermés" + boutons.innerHTML);
225}
226
227// Btn filtre Secteur
228function BtnFiltreSecteur() {
229  if (btn_secteur_statut == "fermer") {
230    FermerAllBtn();
231    btn_secteur_statut = "ouvert";
232    document.getElementById("filtres-secteur").classList.add("actif");
233  } else {
234    btn_secteur_statut = "fermer";
235    document.getElementById("filtres-secteur").classList.remove("actif");
236  }
237}
238
239// Btn filtre Région
240function BtnFiltreRegion() {
241  if (btn_region_statut == "fermer") {
242    FermerAllBtn();
243    btn_region_statut = "ouvert";
244    document.getElementById("filtres-region").classList.add("actif");
245  } else {
246    btn_region_statut = "fermer";
247    document.getElementById("filtres-region").classList.remove("actif");
248  }
249}
250
251// Btn filtre Lauréat
252function BtnFiltreLaureat() {
253  if (btn_laureat_statut == "fermer") {
254    FermerAllBtn();
255    btn_laureat_statut = "ouvert";
256    document.getElementById("filtres-laureat").classList.add("actif");
257  } else {
258    btn_laureat_statut = "fermer";
259    document.getElementById("filtres-laureat").classList.remove("actif");
260  }
261}
262
263// Btn filtre Édition
264function BtnFiltreEdition() {
265  if (btn_edition_statut == "fermer") {
266    FermerAllBtn();
267    btn_edition_statut = "ouvert";
268    document.getElementById("filtres-edition").classList.add("actif");
269  } else {
270    btn_edition_statut = "fermer";
271    document.getElementById("filtres-edition").classList.remove("actif");
272  }
273}
274
275/********** Barre de recherche **********/
276function searchVideo() {
277  search = document.getElementById("searchbar-videos").value;
278  Url();
279}
280
281