bachir/drupal-quartiersdedemain
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

retrouve page lessites

Browse Source
This commit is contained in:
Ouidade Soussi Chiadmi 2025-03-03 23:35:36 +01:00
parent 104633faa1
commit 735a9a0278
2 changed files with 505 additions and 606 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/themes/custom/quartiers_de_demain/dist/assets/bundle.js vendored
View File

File diff suppressed because one or more lines are too long

293
web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js
View File

@ -11,11 +11,11 @@
console.log('It works!'); console.log('It works!');
} }
}; };
} (Drupal)); } (Drupal));
//////// start header //////////// //////// start header ////////////
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
const header = document.querySelector('header'); const header = document.querySelector('header');
const logo = document.querySelector('#block-quartiers-de-demain-logoquartiersdedemain > div:nth-child(1) > div:nth-child(1) > a:nth-child(1) > svg:nth-child(1)'); const logo = document.querySelector('#block-quartiers-de-demain-logoquartiersdedemain > div:nth-child(1) > div:nth-child(1) > a:nth-child(1) > svg:nth-child(1)');
@ -200,7 +200,7 @@
} }
} }
}); });
//////// end header //////////// //////// end header ////////////
@ -210,22 +210,22 @@
(function($, window) { (function($, window) {
var adjustAnchor = function() { var adjustAnchor = function() {
var $anchor = $('.sidebar_first_container'), var $anchor = $('.sidebar_first_container'),
fixedElementHeight = 500; fixedElementHeight = 500;
if ($anchor.length > 0) { if ($anchor.length > 0) {
$('html, body').stop().animate({scrollTop: $anchor.offset().top - fixedElementHeight }, 0); $('html, body').stop().animate({scrollTop: $anchor.offset().top - fixedElementHeight }, 0);
} }
}; };
$(window).on('hashchange', function() { $(window).on('hashchange', function() {
adjustAnchor(); adjustAnchor();
}); });
//////////////////////// start script smooth apparition des textes ///////////////// //////////////////////// start script smooth apparition des textes /////////////////
function scrollReaveal(){ function scrollReaveal(){
const nodes = { const nodes = {
logo : document.querySelectorAll('#logo-animated-container'), logo : document.querySelectorAll('#logo-animated-container'),
@ -263,16 +263,16 @@
ScrollReveal().reveal(nodes.lienDoc, showUp); ScrollReveal().reveal(nodes.lienDoc, showUp);
ScrollReveal().reveal(nodes.lienURL, showUp); ScrollReveal().reveal(nodes.lienURL, showUp);
} }
$( document ).ready(function() { $( document ).ready(function() {
scrollReaveal(); scrollReaveal();
}); });
//////////////////////// end script smooth apparition des textes ///////////////// //////////////////////// end script smooth apparition des textes /////////////////
// //////////////////// start Timeline script /////////////////////// // //////////////////// start Timeline script ///////////////////////
// Update month field to only show the first 3 letters // Update month field to only show the first 3 letters
document.querySelectorAll('.paragraph--type--phase-deroulement').forEach(function(paragraph) { document.querySelectorAll('.paragraph--type--phase-deroulement').forEach(function(paragraph) {
@ -322,7 +322,7 @@
}); });
// ////////////////////// start calendrier home ///////////////////////////////// // ////////////////////// start calendrier home /////////////////////////////////
$(document).ready(function(){ $(document).ready(function(){
$('.__timeline-content').slick({ $('.__timeline-content').slick({
slidesToShow: 3, slidesToShow: 3,
@ -349,49 +349,33 @@
}); });
//////////////////////// end calendrier home ///////////////////////////////// //////////////////////// end calendrier home /////////////////////////////////
//////////////////////// end Timeline script ///////////////////////////////////////////// //////////////////////// end Timeline script /////////////////////////////////////////////
/////////////////// caracteres body actus///////////////////////// /////////////////// caracteres body actus/////////////////////////
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
// Nombre maximum de caractères à afficher // Maximum number of characters to display
const maxChars = 140; // Ajustez cette valeur selon vos besoins const maxChars = 140; // Adjust this value as needed
document.querySelectorAll('#actus-caroussel .node-type-actualite').forEach(function(node) { document.querySelectorAll('#actus-caroussel .node-type-actualite .field_body p').forEach(function(paragraph) {
let paragraphs = node.querySelectorAll('.field_body p'); let text = paragraph.textContent.trim();
let fullText = ""; if (text.length > maxChars) {
let truncatedText = text.slice(0, maxChars) + '...';
// Concaténer tous les paragraphes paragraph.textContent = truncatedText;
paragraphs.forEach(p => fullText += p.textContent.trim() + " ");
fullText = fullText.trim();
// Vérifier si le texte dépasse la limite
if (fullText.length > maxChars) {
let truncatedText = fullText.slice(0, maxChars) + '...';
// Vider tout le contenu et insérer seulement le texte tronqué
let firstParagraph = paragraphs[0];
firstParagraph.textContent = truncatedText;
// Masquer les autres paragraphes
for (let i = 1; i < paragraphs.length; i++) {
paragraphs[i].style.display = "none";
}
} }
}); });
}); });
//////////// start slideshow home //////////////////////////
//////////// start slideshow home ////////////////////////// $(document).ready(function(){
$(document).ready(function(){
let actuview = $('.content-actus .view ') let actuview = $('.content-actus .view ')
if (actuview) { if (actuview) {
actuview.slick({ actuview.slick({
@ -428,12 +412,12 @@
lazyLoad: 'progressive', // Option 'ondemand' ou 'progressive' lazyLoad: 'progressive', // Option 'ondemand' ou 'progressive'
}); });
}); });
$(document).ready(function () { $(document).ready(function () {
let diapohome = $('.config_pages--type--diaporama-home .diaporama'); let diapohome = $('.config_pages--type--diaporama-home .diaporama');
if (diapohome.length) { if (diapohome.length) {
@ -462,10 +446,10 @@
}] }]
}); });
} }
}); });
//////////// end slideshow home ////////////////////////// //////////// end slideshow home //////////////////////////
//////////////// start lightbox galerie image page site//////////////////////// //////////////// start lightbox galerie image page site////////////////////////
@ -504,56 +488,56 @@ lightbox.appendChild(nextBtn);
// Fonction pour afficher l'image et la légende à l'index donné // Fonction pour afficher l'image et la légende à l'index donné
function showImage(index) { function showImage(index) {
if (index < 0) index = images.length - 1; if (index < 0) index = images.length - 1;
if (index >= images.length) index = 0; if (index >= images.length) index = 0;
currentIndex = index; currentIndex = index;
// Mettre à jour l'image // Mettre à jour l'image
img.src = images[currentIndex].getAttribute('src'); img.src = images[currentIndex].getAttribute('src');
// Récupérer la légende associée (le paragraphe dans blockquote suivant l'image) // Récupérer la légende associée (le paragraphe dans blockquote suivant l'image)
const captionText = images[currentIndex] const captionText = images[currentIndex]
.closest('.cadre-img-zoom') .closest('.cadre-img-zoom')
.nextElementSibling.querySelector('.image-field-caption p') .nextElementSibling.querySelector('.image-field-caption p')
.textContent; .textContent;
caption.textContent = captionText || ''; // Affiche la légende ou une chaîne vide si elle est absente caption.textContent = captionText || ''; // Affiche la légende ou une chaîne vide si elle est absente
lightbox.style.display = 'flex'; lightbox.style.display = 'flex';
} }
// Événements de clic sur chaque image pour ouvrir le lightbox avec la légende // Événements de clic sur chaque image pour ouvrir le lightbox avec la légende
images.forEach((image, index) => { images.forEach((image, index) => {
image.addEventListener('click', () => { image.addEventListener('click', () => {
showImage(index); showImage(index);
}); });
}); });
// Fermer le lightbox // Fermer le lightbox
closeBtn.addEventListener('click', () => { closeBtn.addEventListener('click', () => {
lightbox.style.display = 'none'; lightbox.style.display = 'none';
}); });
// Navigation pour images précédente et suivante // Navigation pour images précédente et suivante
prevBtn.addEventListener('click', (e) => { prevBtn.addEventListener('click', (e) => {
e.stopPropagation(); e.stopPropagation();
showImage(currentIndex - 1); showImage(currentIndex - 1);
}); });
nextBtn.addEventListener('click', (e) => { nextBtn.addEventListener('click', (e) => {
e.stopPropagation(); e.stopPropagation();
showImage(currentIndex + 1); showImage(currentIndex + 1);
}); });
// Fermer le lightbox en cliquant en dehors de l'image // Fermer le lightbox en cliquant en dehors de l'image
lightbox.addEventListener('click', (e) => { lightbox.addEventListener('click', (e) => {
if (e.target === lightbox) { if (e.target === lightbox) {
lightbox.style.display = 'none'; lightbox.style.display = 'none';
} }
}); });
// Ajout des contrôles clavier (Échap, flèches gauche/droite) // Ajout des contrôles clavier (Échap, flèches gauche/droite)
document.addEventListener('keydown', (e) => { document.addEventListener('keydown', (e) => {
if (lightbox.style.display === 'flex') { if (lightbox.style.display === 'flex') {
if (e.key === 'Escape') { if (e.key === 'Escape') {
lightbox.style.display = 'none'; lightbox.style.display = 'none';
} else if (e.key === 'ArrowLeft') { } else if (e.key === 'ArrowLeft') {
@ -561,7 +545,7 @@ document.addEventListener('keydown', (e) => {
} else if (e.key === 'ArrowRight') { } else if (e.key === 'ArrowRight') {
showImage(currentIndex + 1); showImage(currentIndex + 1);
} }
} }
}); });
@ -571,11 +555,11 @@ document.addEventListener('keydown', (e) => {
//////////////////// start wrapper views-row lessites ///////////////////////// //////////////////// start wrapper views-row lessites /////////////////////////
document.addEventListener("DOMContentLoaded", function() { document.addEventListener("DOMContentLoaded", function() {
// Sélectionne le conteneur principal avec l'ID 'lessites' // Sélectionne le conteneur principal avec l'ID 'lessites'
const container = document.getElementById("lessites"); const container = document.getElementById("lessites");
// Vérifie si le conteneur existe pour éviter toute erreur sur d'autres pages // Vérifie si le conteneur existe pour éviter toute erreur sur d'autres pages
if (container) { if (container) {
// Sélectionne l'élément 'view' à l'intérieur de '.views-element-container' // Sélectionne l'élément 'view' à l'intérieur de '.views-element-container'
const viewContainer = container.querySelector(".views-element-container .view"); const viewContainer = container.querySelector(".views-element-container .view");
@ -592,7 +576,7 @@ document.addEventListener("DOMContentLoaded", function() {
// Ajoute la div englobante dans le 'viewContainer' // Ajoute la div englobante dans le 'viewContainer'
viewContainer.appendChild(wrapperDiv); viewContainer.appendChild(wrapperDiv);
} }
} }
}); });
@ -604,31 +588,31 @@ document.addEventListener("DOMContentLoaded", function() {
// Vérifie si la page a la classe 'node-type-site' dans le <body> // Vérifie si la page a la classe 'node-type-site' dans le <body>
if (document.body.classList.contains('node-type-site')) { if (document.body.classList.contains('node-type-site')) {
// Sélectionne le conteneur principal // Sélectionne le conteneur principal
const blockRegion = document.querySelector('.block-region-second'); const blockRegion = document.querySelector('.block-region-second');
// Liste des classes spécifiques à cibler // Liste des classes spécifiques à cibler
const fieldClasses = [ const fieldClasses = [
'.field_field_region', '.field_field_region',
'.field_field_nom_du_qpv_nb_d_hab', '.field_field_nom_du_qpv_nb_d_hab',
'.field_field_departement_s', '.field_field_departement_s',
'.field_field_programme_de_l_etat', '.field_field_programme_de_l_etat',
'.field_field_porteur_s_de_site', '.field_field_porteur_s_de_site',
'.field_field_nom_de_la_commune_nb_d_hab' '.field_field_nom_de_la_commune_nb_d_hab'
]; ];
// Sélectionne les div parents de chacun des champs listés // Sélectionne les div parents de chacun des champs listés
const elementsToWrap = []; const elementsToWrap = [];
fieldClasses.forEach(className => { fieldClasses.forEach(className => {
const fieldElement = blockRegion.querySelector(className); const fieldElement = blockRegion.querySelector(className);
if (fieldElement) { if (fieldElement) {
// Ajoute le parent du champ au tableau si trouvé // Ajoute le parent du champ au tableau si trouvé
elementsToWrap.push(fieldElement.parentElement); elementsToWrap.push(fieldElement.parentElement);
} }
}); });
// Vérifie que des éléments ont été trouvés // Vérifie que des éléments ont été trouvés
if (elementsToWrap.length > 0) { if (elementsToWrap.length > 0) {
// Crée le conteneur avec la classe 'infos' // Crée le conteneur avec la classe 'infos'
const infosContainer = document.createElement('div'); const infosContainer = document.createElement('div');
infosContainer.className = 'infos'; infosContainer.className = 'infos';
@ -639,47 +623,47 @@ if (document.body.classList.contains('node-type-site')) {
// Déplace chaque élément dans le conteneur `.infos` // Déplace chaque élément dans le conteneur `.infos`
elementsToWrap.forEach(element => infosContainer.appendChild(element)); elementsToWrap.forEach(element => infosContainer.appendChild(element));
} }
} }
//////////////////// end div infos site //////////////////////// //////////////////// end div infos site ////////////////////////
document.addEventListener("DOMContentLoaded", function() { document.addEventListener("DOMContentLoaded", function() {
// Sélectionner les éléments à déplacer // Sélectionner les éléments à déplacer
const documentsField = document.querySelector(".field_field_documents"); const documentsField = document.querySelector(".field_field_documents");
const liensSiteField = document.querySelector(".field_field_liens_site"); const liensSiteField = document.querySelector(".field_field_liens_site");
// Sélectionner la destination // Sélectionner la destination
const thirdRegion = document.querySelector(".block-region-third > div"); const thirdRegion = document.querySelector(".block-region-third > div");
// Créer une nouvelle div pour englober les éléments déplacés // Créer une nouvelle div pour englober les éléments déplacés
const wrapperDiv = document.createElement("div"); const wrapperDiv = document.createElement("div");
wrapperDiv.classList.add("documents-liens-wrapper"); wrapperDiv.classList.add("documents-liens-wrapper");
// Déplacer les éléments dans la nouvelle div // Déplacer les éléments dans la nouvelle div
if (documentsField && liensSiteField && thirdRegion) { if (documentsField && liensSiteField && thirdRegion) {
wrapperDiv.appendChild(documentsField); wrapperDiv.appendChild(documentsField);
wrapperDiv.appendChild(liensSiteField); wrapperDiv.appendChild(liensSiteField);
// Ajouter la nouvelle div dans la destination // Ajouter la nouvelle div dans la destination
thirdRegion.appendChild(wrapperDiv); thirdRegion.appendChild(wrapperDiv);
} }
}); });
document.addEventListener("DOMContentLoaded", function() { document.addEventListener("DOMContentLoaded", function() {
// Sélectionner les éléments pertinents // Sélectionner les éléments pertinents
const documentsLiensWrapper = document.querySelector(".documents-liens-wrapper"); const documentsLiensWrapper = document.querySelector(".documents-liens-wrapper");
const blockRegionThird = document.querySelector(".block-region-third"); const blockRegionThird = document.querySelector(".block-region-third");
// Vérifier que les éléments existent avant de les manipuler // Vérifier que les éléments existent avant de les manipuler
if (documentsLiensWrapper && blockRegionThird) { if (documentsLiensWrapper && blockRegionThird) {
// Déplacer .documents-liens-wrapper en dehors du div contenant les boutons prev/next // Déplacer .documents-liens-wrapper en dehors du div contenant les boutons prev/next
blockRegionThird.appendChild(documentsLiensWrapper); blockRegionThird.appendChild(documentsLiensWrapper);
} }
}); });
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {
// Fonction pour déplacer le bloc en fonction de la taille de l'écran // Fonction pour déplacer le bloc en fonction de la taille de l'écran
function moveLanguageSwitcher() { function moveLanguageSwitcher() {
const languageSwitcher = document.getElementById("block-quartiers-de-demain-selecteurdelangue"); const languageSwitcher = document.getElementById("block-quartiers-de-demain-selecteurdelangue");
const navContainer = document.querySelector(".header_nav_container"); const navContainer = document.querySelector(".header_nav_container");
@ -693,99 +677,14 @@ document.addEventListener("DOMContentLoaded", function () {
headerRightContainer.appendChild(languageSwitcher); // Remet le bloc dans sa position initiale headerRightContainer.appendChild(languageSwitcher); // Remet le bloc dans sa position initiale
} }
} }
} }
// Déclencher au chargement et au redimensionnement // Déclencher au chargement et au redimensionnement
moveLanguageSwitcher(); moveLanguageSwitcher();
window.addEventListener("resize", moveLanguageSwitcher); window.addEventListener("resize", moveLanguageSwitcher);
}); });
//////////////////////////////////////////
/////////// Start script ressources ////////////////////////////////
document.addEventListener("DOMContentLoaded", () => {
const view = document.querySelector(".view");
const elements = Array.from(view.children);
let newView = document.createElement("div");
newView.classList.add("view");
let group = null;
let groupContent = null;
elements.forEach((el) => {
if (el.tagName === "H3") {
if (group) {
newView.appendChild(group);
}
group = document.createElement("div");
group.classList.add("group");
groupContent = document.createElement("div");
groupContent.classList.add("group-content");
groupContent.appendChild(el);
group.appendChild(groupContent);
} else if (el.classList.contains("views-row")) {
groupContent.appendChild(el);
}
});
if (group) {
newView.appendChild(group);
}
view.replaceWith(newView);
// Ajouter un bouton "Voir plus" dans chaque groupe
document.querySelectorAll(".group").forEach((group) => {
const rows = group.querySelectorAll(".views-row");
const button = document.createElement("button");
button.classList.add("toggle-btn");
button.textContent = "Voir plus de";
rows.forEach((row, index) => {
if (index >= 3) {
row.classList.add("hidden");
row.style.maxHeight = "0";
row.style.opacity = "0";
}
});
button.addEventListener("click", () => {
const isExpanded = button.textContent === "Voir moins de";
const hiddenRows = group.querySelectorAll(".views-row.hidden");
if (isExpanded) {
// Cacher les lignes avec un délai pour l'effet de transition
hiddenRows.forEach((row) => {
row.style.maxHeight = "0";
row.style.opacity = "0";
setTimeout(() => row.classList.add("hidden"), 500); // Délai pour la transition
});
} else {
// Afficher les lignes
hiddenRows.forEach((row) => {
row.classList.remove("hidden");
row.style.maxHeight = row.scrollHeight + "px";
row.style.opacity = "1";
});
}
button.textContent = isExpanded ? "Voir plus de" : "Voir moins de";
});
group.appendChild(button);
});
});
/////////// end script ressources ////////////////////////////////
})(jQuery, window); })(jQuery, window);