From 4c31e7c8af2cf7d171df823f06638394a805d31a Mon Sep 17 00:00:00 2001
From: Olivia206 <olivia.simonet206@gmail.com>
Date: Thu, 12 Sep 2024 11:28:55 +0200
Subject: [PATCH 1/4] added js to details for a11y

---
 assets/js/theme/design-system/accordion.js    | 35 +++++++++++++++++++
 assets/js/theme/index.js                      |  3 +-
 .../blocks/templates/definitions.html         |  4 +--
 3 files changed, 39 insertions(+), 3 deletions(-)
 create mode 100644 assets/js/theme/design-system/accordion.js

diff --git a/assets/js/theme/design-system/accordion.js b/assets/js/theme/design-system/accordion.js
new file mode 100644
index 000000000..75ff75937
--- /dev/null
+++ b/assets/js/theme/design-system/accordion.js
@@ -0,0 +1,35 @@
+function Accordion(element) {
+    this.element = element;
+    this.button = this.element.querySelector('summary');
+
+    this.state = {
+        isOpened: false
+    };
+
+    this.listen();
+}
+
+Accordion.prototype.listen = function() {
+    var self = this;
+
+    this.button.addEventListener('click', function() {
+        self.toggleAccordion();
+    });
+};
+
+Accordion.prototype.toggleAccordion = function(open) {
+    if (typeof open === 'undefined') {
+        open = !this.state.isOpened;
+    }
+    this.state.isOpened = open;
+    this.button.setAttribute('aria-expanded', this.state.isOpened);
+    };
+
+(function () {
+    var accordions = document.querySelectorAll('details');
+    console.log(accordions)
+    Array.prototype.forEach.call(accordions, function(accordion) {
+        console.log(accordion)
+        new Accordion(accordion);
+    });
+}());
diff --git a/assets/js/theme/index.js b/assets/js/theme/index.js
index 3cc191d25..1c1b2c52f 100644
--- a/assets/js/theme/index.js
+++ b/assets/js/theme/index.js
@@ -14,4 +14,5 @@ import './blocks/timeline.js';
 import './blocks/videos.js';
 import './blocks/campus.js';
 import './utils/utils.js';
-import './components/carousel.js';
\ No newline at end of file
+import './components/carousel.js';
+import './design-system/accordion.js';
\ No newline at end of file
diff --git a/layouts/partials/blocks/templates/definitions.html b/layouts/partials/blocks/templates/definitions.html
index d61c4ac01..37c72eb8e 100644
--- a/layouts/partials/blocks/templates/definitions.html
+++ b/layouts/partials/blocks/templates/definitions.html
@@ -12,8 +12,8 @@
         )}}
         <div class="definitions">
           {{- range .elements }}
-            <details itemscope itemtype="https://schema.org/DefinedTerm">
-              <summary itemprop="name">{{ .title | safeHTML }}</summary>
+            <details id="TODO" itemscope itemtype="https://schema.org/DefinedTerm">
+              <summary itemprop="name" aria-controls="#TODO" aria-expanded="false">{{ .title | safeHTML }}</summary>
               <p itemprop="description">{{ .description | safeHTML }}</p>
             </details>
           {{ end -}}

From 7db25babd2e2fbbc78715d64e2d8d33a94b4f1a1 Mon Sep 17 00:00:00 2001
From: Olivia206 <olivia.simonet206@gmail.com>
Date: Thu, 12 Sep 2024 11:52:40 +0200
Subject: [PATCH 2/4] cleaned

---
 assets/js/theme/index.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/assets/js/theme/index.js b/assets/js/theme/index.js
index 1c1b2c52f..64cf4c5f8 100644
--- a/assets/js/theme/index.js
+++ b/assets/js/theme/index.js
@@ -1,4 +1,5 @@
 import './body.js';
+import './design-system/accordion.js';
 import './design-system/clickToCopy';
 import './design-system/dropdowns';
 import './design-system/font';
@@ -14,5 +15,4 @@ import './blocks/timeline.js';
 import './blocks/videos.js';
 import './blocks/campus.js';
 import './utils/utils.js';
-import './components/carousel.js';
-import './design-system/accordion.js';
\ No newline at end of file
+import './components/carousel.js';
\ No newline at end of file

From 719d59129c20ecbefba3c4d9de0705c6ddbbd03a Mon Sep 17 00:00:00 2001
From: Olivia206 <olivia.simonet206@gmail.com>
Date: Thu, 3 Oct 2024 12:12:21 +0200
Subject: [PATCH 3/4] use blocks range to add id to definitions

---
 layouts/partials/blocks/templates/definitions.html | 11 +++++++----
 layouts/partials/contents/list.html                |  7 ++++---
 2 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/layouts/partials/blocks/templates/definitions.html b/layouts/partials/blocks/templates/definitions.html
index 37c72eb8e..ae40eee00 100644
--- a/layouts/partials/blocks/templates/definitions.html
+++ b/layouts/partials/blocks/templates/definitions.html
@@ -1,7 +1,9 @@
 {{- $block := .block -}}
 {{- $block_class := partial "GetBlockClass" .block -}}
+{{- $block_index := .index -}}
 
 {{- with .block.data -}}
+  {{ .Params.position }}
   <div class="{{ $block_class }}">
     <div class="container">
       <div class="block-content">
@@ -11,10 +13,11 @@
           "description" .description
         )}}
         <div class="definitions">
-          {{- range .elements }}
-            <details id="TODO" itemscope itemtype="https://schema.org/DefinedTerm">
-              <summary itemprop="name" aria-controls="#TODO" aria-expanded="false">{{ .title | safeHTML }}</summary>
-              <p itemprop="description">{{ .description | safeHTML }}</p>
+          {{- range $index, $element := .elements }}
+            {{ $id := printf "block-%d-element-%d" $block_index $index}}
+            <details id="{{$id}}" itemscope itemtype="https://schema.org/DefinedTerm">
+              <summary itemprop="name" aria-controls="#{{ $id }}" aria-expanded="false">{{ $element.title | safeHTML }}</summary>
+              <p itemprop="description">{{ $element.description | safeHTML }}</p>
             </details>
           {{ end -}}
         </div>
diff --git a/layouts/partials/contents/list.html b/layouts/partials/contents/list.html
index 1219b413e..c8fde95d9 100644
--- a/layouts/partials/contents/list.html
+++ b/layouts/partials/contents/list.html
@@ -1,12 +1,13 @@
 {{ $context := . }}
 {{- if .Params.contents -}}
   <div class="blocks">
-  {{- range .Params.contents -}}
+  {{- range $index, $content := .Params.contents -}}
     {{ if eq .kind "block" }}
-      {{ $template := printf "blocks/templates/%s.html" .template }}
+      {{ $template := printf "blocks/templates/%s.html" $content.template }}
       {{ partial $template (dict
-          "block" .
+          "block" $content
           "context" $context
+          "index" $index
       )}}
     {{- else if (eq .kind "heading") -}}
       {{ $headingId := .slug | default (urlize .title) }}

From 6708cc5489e0fd3453c44f355709af9919936549 Mon Sep 17 00:00:00 2001
From: Olivia206 <olivia.simonet206@gmail.com>
Date: Thu, 3 Oct 2024 12:17:10 +0200
Subject: [PATCH 4/4] added id to transcription details

---
 layouts/partials/blocks/templates/embed.html | 2 ++
 layouts/partials/blocks/templates/sound.html | 2 ++
 layouts/partials/blocks/templates/video.html | 2 ++
 layouts/partials/commons/transcription.html  | 7 +++++--
 4 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/layouts/partials/blocks/templates/embed.html b/layouts/partials/blocks/templates/embed.html
index 44a59c720..2e68469d1 100644
--- a/layouts/partials/blocks/templates/embed.html
+++ b/layouts/partials/blocks/templates/embed.html
@@ -1,5 +1,6 @@
 {{- $block := .block -}}
 {{- $block_class := partial "GetBlockClass" .block -}}
+{{- $block_index := .index -}}
 
 {{- with .block.data -}}
   <div class="{{ $block_class }}">
@@ -15,6 +16,7 @@
         {{ end -}}
 
         {{ partial "commons/transcription" ( dict
+            "block_index" $block_index
             "transcription" .transcription
           ) }}
       </div>
diff --git a/layouts/partials/blocks/templates/sound.html b/layouts/partials/blocks/templates/sound.html
index c6fc6f025..219deac4e 100644
--- a/layouts/partials/blocks/templates/sound.html
+++ b/layouts/partials/blocks/templates/sound.html
@@ -1,5 +1,6 @@
 {{- $block := .block -}}
 {{- $block_class := partial "GetBlockClass" .block -}}
+{{- $block_index := .index -}}
 
 {{- with .block.data -}}
   <div class="{{ $block_class }}">
@@ -23,6 +24,7 @@
           {{ end }}
 
           {{ partial "commons/transcription" ( dict
+            "block_index" $block_index
             "transcription" .transcription
           ) }}
         </div>
diff --git a/layouts/partials/blocks/templates/video.html b/layouts/partials/blocks/templates/video.html
index 003013599..d38503b2b 100644
--- a/layouts/partials/blocks/templates/video.html
+++ b/layouts/partials/blocks/templates/video.html
@@ -1,5 +1,6 @@
 {{- $block := .block -}}
 {{- $block_class := partial "GetBlockClass" .block -}}
+{{- $block_index := .index -}}
 
 {{- with .block.data -}}
   <div class="{{ $block_class }}">
@@ -31,6 +32,7 @@
         {{ end }}
 
         {{ partial "commons/transcription" ( dict
+          "block_index" $block_index
           "transcription" .transcription
         ) }}
       </div>
diff --git a/layouts/partials/commons/transcription.html b/layouts/partials/commons/transcription.html
index fb2908e6a..1821ec6b1 100644
--- a/layouts/partials/commons/transcription.html
+++ b/layouts/partials/commons/transcription.html
@@ -1,7 +1,10 @@
 {{ if (partial "GetTextFromHTML" .transcription) }}
+{{ $block_index := .block_index }}
+{{ $id := printf "block-%d-transcription" $block_index}}
+
 <div class="transcription">
-  <details>
-    <summary>{{ i18n "commons.accessibility.transcription" }}</summary>
+  <details id="{{$id}}">
+    <summary aria-controls="#{{ $id }}" aria-expanded="false">{{ i18n "commons.accessibility.transcription" }}</summary>
     <p>
       {{- $transcription := partial "PrepareHTML" .transcription -}}
       {{ safeHTML (replace $transcription "\n" "<br/>") }}