MDL-58167 block_myoverview: improve block accessibility

moodle · May 1, 2017 · cff78dc · cff78dc
1 parent 06e3b6d
commit cff78dc
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 10 deletions.
diff --git a/blocks/myoverview/lang/en/block_myoverview.php b/blocks/myoverview/lang/en/block_myoverview.php
@@ -41,3 +41,4 @@
 $string['sortbydates'] = 'Sort by dates';
 $string['timeline'] = 'Timeline';
 $string['viewcourse'] = 'View course';
+$string['viewcoursename'] = 'View course {$a}';
diff --git a/blocks/myoverview/templates/course-event-list.mustache b/blocks/myoverview/templates/course-event-list.mustache
@@ -90,9 +90,11 @@
     <div class="hidden text-xs-center text-center" data-region="empty-message">
         <img class="empty-placeholder-image-sm"
              src="{{urls.noevents}}"
-             alt="{{#str}} noevents, block_myoverview {{/str}}">
+             alt="{{#str}} noevents, block_myoverview {{/str}}"
+             role="presentation">
         <p class="text-muted m-t-1">{{#str}} noevents, block_myoverview {{/str}}</p>
-        <a href="{{viewurl}}" class="btn btn-secondary text-primary">
+        <a href="{{viewurl}}" class="btn btn-secondary text-primary"
+           aria-label="{{#str}} viewcoursename, block_myoverview, {{fullnamedisplay}} {{/str}}">
             {{#str}} viewcourse, block_myoverview {{/str}}
         </a>
     </div>

diff --git a/blocks/myoverview/templates/courses-view.mustache b/blocks/myoverview/templates/courses-view.mustache
@@ -51,7 +51,8 @@
                 <div class="text-xs-center text-center m-t-3">
                     <img class="empty-placeholder-image-lg"
                          src="{{urls.nocourses}}"
-                         alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}">
+                         alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}"
+                         role="presentation">
                     <p class="text-muted m-t-1">{{#str}} nocoursesinprogress, block_myoverview {{/str}}</p>
                 </div>
             {{/inprogress}}
@@ -69,7 +70,8 @@
                 <div class="text-xs-center text-center m-t-3">
                     <img class="empty-placeholder-image-lg"
                          src="{{urls.nocourses}}"
-                         alt="{{#str}} nocoursesfuture, block_myoverview {{/str}}">
+                         alt="{{#str}} nocoursesfuture, block_myoverview {{/str}}"
+                         role="presentation">
                     <p class="text-muted m-t-1">{{#str}} nocoursesfuture, block_myoverview {{/str}}</p>
                 </div>
             {{/future}}
@@ -87,7 +89,8 @@
                 <div class="text-xs-center text-center m-t-3">
                     <img class="empty-placeholder-image-lg"
                          src="{{urls.nocourses}}"
-                         alt="{{#str}} nocoursespast, block_myoverview {{/str}}">
+                         alt="{{#str}} nocoursespast, block_myoverview {{/str}}"
+                         role="presentation">
                     <p class="text-muted m-t-1">{{#str}} nocoursespast, block_myoverview {{/str}}</p>
                 </div>
             {{/past}}
@@ -98,7 +101,8 @@
     <div class="text-xs-center text-center m-t-3">
         <img class="empty-placeholder-image-lg"
              src="{{urls.nocourses}}"
-             alt="{{#str}} nocourses, block_myoverview {{/str}}">
+             alt="{{#str}} nocourses, block_myoverview {{/str}}"
+             role="presentation">
         <p class="text-muted m-t-1">{{#str}} nocourses, block_myoverview {{/str}}</p>
     </div>
     {{/hascourses}}

diff --git a/blocks/myoverview/templates/event-list.mustache b/blocks/myoverview/templates/event-list.mustache
@@ -74,7 +74,8 @@
     <div class="hidden text-xs-center text-center m-t-3" data-region="empty-message">
         <img class="empty-placeholder-image-lg"
              src="{{urls.noevents}}"
-             alt="{{#str}} noevents, block_myoverview {{/str}}">
+             alt="{{#str}} noevents, block_myoverview {{/str}}"
+             role="presentation">
         <p class="text-muted m-t-1">{{#str}} noevents, block_myoverview {{/str}}</p>
     </div>
 </div>

diff --git a/blocks/myoverview/templates/progress-chart.mustache b/blocks/myoverview/templates/progress-chart.mustache
@@ -32,7 +32,7 @@
         <div class="progress-indicator">
             <svg xmlns="http://www.w3.org/2000/svg">
                 <g>
-                    <title>{{progress}}&#37;</title>
+                    <title aria-hidden="true">{{progress}}&#37;</title>
                     <circle class="circle percent-{{progress}}"
                             r="27.5"
                             cx="35"

diff --git a/blocks/myoverview/templates/timeline-view-courses.mustache b/blocks/myoverview/templates/timeline-view-courses.mustache
@@ -44,7 +44,8 @@
                 <div class="text-xs-center text-center m-t-3">
                     <img class="empty-placeholder-image-lg"
                          src="{{urls.noevents}}"
-                         alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}">
+                         alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}"
+                         role="presentation">
                     <p class="text-muted m-t-1">{{#str}} nocoursesinprogress, block_myoverview {{/str}}</p>
                 </div>
             {{/haspages}}
@@ -53,7 +54,8 @@
             <div class="text-xs-center text-center m-t-3">
                 <img class="empty-placeholder-image-lg"
                      src="{{urls.noevents}}"
-                     alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}">
+                     alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}"
+                     role="presentation">
                 <p class="text-muted m-t-1">{{#str}} nocoursesinprogress, block_myoverview {{/str}}</p>
             </div>
         {{/inprogress}}