Add i18n splide carousel

Hugolify · Mar 27, 2024 · e86357c · e86357c
1 parent 3de2bf3
commit e86357c
Show file tree

Hide file tree

Showing 5 changed files with 58 additions and 6 deletions.
diff --git a/assets/js/components/carousel.js b/assets/js/components/carousel.js
@@ -37,6 +37,17 @@ class Carousel {
   }
 
   init() {
+    this.initI18n();
+    this.initCarousel();
+  }
+
+  initI18n() {
+    Splide.defaults = {
+      i18n: window.i18n.carousel
+    };
+  }
+
+  initCarousel() {
     new Splide(this.carousel).mount();
   }
 }

diff --git a/i18n/en.yml b/i18n/en.yml
@@ -3,6 +3,19 @@ accessibility:
 address:
   direction: How to go?
 breadcrumb: Breadcrumb
+carousel:
+  carousel: Carousel
+  first: Go to first slide
+  last: Go to last slide
+  next: Next slide
+  pagex: Go to page %s
+  pause: Pause autoplay
+  play: Start autoplay
+  previous: Previous slide
+  select: Change slide or slides to show
+  slide: Slide
+  slidelabel: Slide %s of %s
+  slidex: Go to slide %s
 close: Close
 contact:
   email: 'Email:'

diff --git a/i18n/fr.yml b/i18n/fr.yml
@@ -3,6 +3,19 @@ accessibility:
 address:
   direction: Comment y aller ?
 breadcrumb: fil d’Arianne
+carousel:
+  carousel: Carrousel
+  first: Aller à la première diapositive
+  last: Aller à la dernière diapositive
+  next: Diapositive suivante
+  pagex: Aller à la page %s
+  pause: Mettre pause au défilement automatique
+  play: Lancer le défilement automatique
+  previous: Diapositive précédente
+  select: Changer la ou les diapositives à afficher
+  slide: Diapositive
+  slidelabel: Diapositive %s de %s
+  slidex: Aller à la diapositive %s
 close: Fermer
 contact:
   email: 'E-mail :'

diff --git a/layouts/partials/footer/js-i18n.html b/layouts/partials/footer/js-i18n.html
@@ -0,0 +1,20 @@
+<script>
+  window.i18n = {};
+  window.i18n.close = {{ i18n "close" }};
+  window.i18n.next = {{ i18n "next" }};
+  window.i18n.previous = {{ i18n "previous" }};
+  // SPLIDE
+  window.i18n.carousel = {};
+  window.i18n.carousel.carousel = {{ i18n "carousel.carousel" }};
+  window.i18n.carousel.first = {{ i18n "carousel.first" }};
+  window.i18n.carousel.last = {{ i18n "carousel.last" }};
+  window.i18n.carousel.next = {{ i18n "carousel.next" }};
+  window.i18n.carousel.pageX = {{ i18n "carousel.pagex" }};
+  window.i18n.carousel.pause = {{ i18n "carousel.pause" }};
+  window.i18n.carousel.play = {{ i18n "carousel.play" }};
+  window.i18n.carousel.previous = {{ i18n "carousel.previous" }};
+  window.i18n.carousel.select = {{ i18n "carousel.select" }};
+  window.i18n.carousel.slide = {{ i18n "carousel.slide" }};
+  window.i18n.carousel.slideLabel = {{ i18n "carousel.slidelabel" }};
+  window.i18n.carousel.slideX = {{ i18n "carousel.slidex" }};
+</script>
diff --git a/layouts/partials/footer/js.html b/layouts/partials/footer/js.html
@@ -1,9 +1,4 @@
-<script>
-  window.i18n = {};
-  window.i18n.close = {{ i18n "close" }}
-  window.i18n.next = {{ i18n "next" }}
-  window.i18n.previous = {{ i18n "previous" }}
-</script>
+{{ partialCached "footer/js-i18n" . }}
 {{- $jsOpts := (dict 
   "targetPath" "assets/js/main.js" 
   "minify" hugo.IsProduction