From 4881c76df97f6d2f919ec33ab29a10806bb360d8 Mon Sep 17 00:00:00 2001
From: erxclau <ericlau41802@gmail.com>
Date: Thu, 28 Jul 2022 15:12:43 -0500
Subject: [PATCH 1/8] Add alttext parameter to createBase

---
 templates/__common__/app/scripts/utils/d3-base.js | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/templates/__common__/app/scripts/utils/d3-base.js b/templates/__common__/app/scripts/utils/d3-base.js
index e4405d28..81a1c57b 100644
--- a/templates/__common__/app/scripts/utils/d3-base.js
+++ b/templates/__common__/app/scripts/utils/d3-base.js
@@ -8,6 +8,7 @@ export default function createBase({
   height,
   x,
   y,
+  alttext,
   xAxis = axisBottom(),
   yAxis = axisLeft(),
   xAxisGap = 5,
@@ -29,6 +30,17 @@ export default function createBase({
     .attr('width', containerWidth)
     .attr('height', containerHeight);
 
+  if (!alttext) {
+    console.warn('Alternative text was not provided');
+  } else {
+    svg
+      .attr('role', 'img')
+      .attr('aria-describedby', 'description')
+      .append('desc')
+      .attr('id', 'descrption')
+      .text(alttext);
+  }
+
   const g = svg
     .append('g')
     .attr('transform', `translate(${margin.left},${margin.top})`);

From 5e845d9339acf908104ff161ccdd2f56dc2cd461 Mon Sep 17 00:00:00 2001
From: erxclau <ericlau41802@gmail.com>
Date: Thu, 28 Jul 2022 16:05:41 -0500
Subject: [PATCH 2/8] Add accessibility filter for ai2html files

---
 templates/__common__/config/tasks/nunjucks.js | 19 +++++++++++++++++++
 .../graphic/app/templates/graphic-static.html |  8 ++++++--
 2 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/templates/__common__/config/tasks/nunjucks.js b/templates/__common__/config/tasks/nunjucks.js
index 56e0a347..2c9562ba 100644
--- a/templates/__common__/config/tasks/nunjucks.js
+++ b/templates/__common__/config/tasks/nunjucks.js
@@ -149,6 +149,25 @@ env.addGlobal(
 
 env.addFilter('makeArray', input => (Array.isArray(input) ? input : [input]));
 
+/*
+ Adds accessibility tags to ai2html output
+ */
+env.addFilter('addA11yAttributes', (html, alttext) => {
+  return html
+    .replace(
+      /<div id="g-(.+)-box" class="ai2html">/,
+      `<div id="g-$1-box" class="ai2html" aria-descrption="${alttext}" role="img">`
+    )
+    .replace(
+      /<div id="g-(.+)-664" class="g-artboard"/,
+      '<div id="g-$1-664" class="g-artboard" aria-hidden="true"'
+    )
+    .replace(
+      /<div id="g-(.+)-360" class="g-artboard"/,
+      '<div id="g-$1-360" class="g-artboard" aria-hidden="true"'
+    );
+});
+
 let manifest = null;
 
 env.addGlobal(
diff --git a/templates/graphic/app/templates/graphic-static.html b/templates/graphic/app/templates/graphic-static.html
index 922544dd..720f1486 100644
--- a/templates/graphic/app/templates/graphic-static.html
+++ b/templates/graphic/app/templates/graphic-static.html
@@ -32,8 +32,12 @@ <h1 class="graphic-title" data-title>{{ context.headline | widont or 'The only m
   <span data-caption>{{ prose(context.prose, context, graphicData) }}</span>
 
   {# add name of your ai2html file here #}
-  {# {% set ai2html = "" %}
-  {% include "ai2html-output/" + ai2html + ".html" %} #}
+  {# remember to uncomment by turning the hashtags into percent signs #}
+
+  {# filter addA11yAttributes(graphicAltText) #}
+  {# set ai2html = "" #}
+  {# include "ai2html-output/" + ai2html + ".html" #}
+  {# endfilter #}
 
   {# data-source and data-credit are also used in the CMS #}
   <ul class="graphic-footer">

From 63467449d12dc13df40e620a61fbd6dd3d359f71 Mon Sep 17 00:00:00 2001
From: erxclau <ericlau41802@gmail.com>
Date: Thu, 28 Jul 2022 16:11:41 -0500
Subject: [PATCH 3/8] Fix formatting

---
 templates/graphic/app/templates/base.html | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/templates/graphic/app/templates/base.html b/templates/graphic/app/templates/base.html
index 6fb34a20..b5fe774d 100644
--- a/templates/graphic/app/templates/base.html
+++ b/templates/graphic/app/templates/base.html
@@ -33,11 +33,11 @@
 
   <!-- Start fonts -->
   <script>
-  window.WebFontConfig = {
-  google: { families: ['Open Sans:300,400,700'] },
-  timeout: 10000,
-};
-</script>
+    window.WebFontConfig = {
+    google: { families: ['Open Sans:300,400,700'] },
+    timeout: 10000,
+  };
+  </script>
   <script async src="https://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js"></script>
   <!-- End fonts -->
   <link rel="stylesheet" href="{{ static('styles/main.css') }}">

From 4e74622ed5470ac1502e77369ea569e5935b189f Mon Sep 17 00:00:00 2001
From: erxclau <ericlau41802@gmail.com>
Date: Thu, 28 Jul 2022 16:16:13 -0500
Subject: [PATCH 4/8] Set document title to graphic title

---
 templates/graphic/app/templates/base.html | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/templates/graphic/app/templates/base.html b/templates/graphic/app/templates/base.html
index b5fe774d..a0d0cab9 100644
--- a/templates/graphic/app/templates/base.html
+++ b/templates/graphic/app/templates/base.html
@@ -4,7 +4,13 @@
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-  <title>The Texas Tribune</title>
+  <title>
+    {% if graphicTitle %}
+      {{ graphicTitle }}
+    {% else %}
+      The Texas Tribune
+    {% endif %}
+  </title>
   <base target='_parent'>
 
   {% if graphicTitle %}

From 4f1fee37f7ff6f60e975553553f6ea5c8a7aefdf Mon Sep 17 00:00:00 2001
From: Eric Lau <44459660+erxclau@users.noreply.github.com>
Date: Thu, 4 Aug 2022 16:20:46 -0400
Subject: [PATCH 5/8] Fix typo

---
 templates/__common__/app/scripts/utils/d3-base.js | 2 +-
 templates/__common__/config/tasks/nunjucks.js     | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/templates/__common__/app/scripts/utils/d3-base.js b/templates/__common__/app/scripts/utils/d3-base.js
index 81a1c57b..71d54583 100644
--- a/templates/__common__/app/scripts/utils/d3-base.js
+++ b/templates/__common__/app/scripts/utils/d3-base.js
@@ -37,7 +37,7 @@ export default function createBase({
       .attr('role', 'img')
       .attr('aria-describedby', 'description')
       .append('desc')
-      .attr('id', 'descrption')
+      .attr('id', 'description')
       .text(alttext);
   }
 
diff --git a/templates/__common__/config/tasks/nunjucks.js b/templates/__common__/config/tasks/nunjucks.js
index 2c9562ba..27080053 100644
--- a/templates/__common__/config/tasks/nunjucks.js
+++ b/templates/__common__/config/tasks/nunjucks.js
@@ -156,7 +156,7 @@ env.addFilter('addA11yAttributes', (html, alttext) => {
   return html
     .replace(
       /<div id="g-(.+)-box" class="ai2html">/,
-      `<div id="g-$1-box" class="ai2html" aria-descrption="${alttext}" role="img">`
+      `<div id="g-$1-box" class="ai2html" aria-description="${alttext}" role="img">`
     )
     .replace(
       /<div id="g-(.+)-664" class="g-artboard"/,

From 0b409a058fc24ab5fcacbeaff1c4f104e0728ae0 Mon Sep 17 00:00:00 2001
From: Eric Lau <44459660+erxclau@users.noreply.github.com>
Date: Thu, 4 Aug 2022 17:11:23 -0400
Subject: [PATCH 6/8] Use aria-describedby over aria-description

---
 templates/__common__/config/tasks/nunjucks.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/templates/__common__/config/tasks/nunjucks.js b/templates/__common__/config/tasks/nunjucks.js
index 27080053..e26adff2 100644
--- a/templates/__common__/config/tasks/nunjucks.js
+++ b/templates/__common__/config/tasks/nunjucks.js
@@ -156,7 +156,8 @@ env.addFilter('addA11yAttributes', (html, alttext) => {
   return html
     .replace(
       /<div id="g-(.+)-box" class="ai2html">/,
-      `<div id="g-$1-box" class="ai2html" aria-description="${alttext}" role="img">`
+      `<div id="g-$1-box" class="ai2html" aria-describedby="description" role="img">
+        <desc id="description" class="sr-only">${alttext}</desc>`
     )
     .replace(
       /<div id="g-(.+)-664" class="g-artboard"/,

From deb76f0b23e9b4daac78d939ed9fc88ad878edc5 Mon Sep 17 00:00:00 2001
From: Eric Lau <44459660+erxclau@users.noreply.github.com>
Date: Tue, 16 Aug 2022 16:06:43 -0400
Subject: [PATCH 7/8] Update changelog for 7.5.0

---
 CHANGELOG.md | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 032080b6..4b994cb4 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,18 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Fixed
 
+## [7.5.0] - 2022-08-12
+
+### Added
+
+- `templates/__common__/app/scripts/utils/d3-base.js` - add `alttext` parameter for `createBase` for screen reader description.
+- `templates/__common__/config/tasks/nunjucks.js` - add Nunjucks filter ai2html graphic screen reader alttext.
+
+### Changed
+
+- `templates/graphic/app/templates/base.html` - change document title to the graphic's title by default.
+- `templates/graphic/app/templates/graphic-static.html` - apply new Nunjucks filter to ai2html graphics.
+
 ## [7.4.0] - 2022-06-06
 
 ### Changed

From df24e9cd5e940a129c1d2078f63e605515c1ba1d Mon Sep 17 00:00:00 2001
From: Eric Lau <44459660+erxclau@users.noreply.github.com>
Date: Tue, 16 Aug 2022 16:19:31 -0400
Subject: [PATCH 8/8] Bump version

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index ca173e97..b8d952fe 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@data-visuals/create",
-  "version": "7.4.0",
+  "version": "7.5.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@data-visuals/create",
-      "version": "7.4.0",
+      "version": "7.5.0",
       "license": "MIT",
       "dependencies": {
         "ansi-colors": "^3.2.4",
diff --git a/package.json b/package.json
index d1ac62c2..aa6e4531 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@data-visuals/create",
-  "version": "7.4.0",
+  "version": "7.5.0",
   "description": "Create graphics and features the Data Visuals way.",
   "scripts": {
     "build:docs": "doctoc README.md --github",