From c27ccc856484574dfee87e773dc589a09248dc5f Mon Sep 17 00:00:00 2001
From: zorkow <volker.sorge@gmail.com>
Date: Mon, 3 Apr 2017 16:20:14 +0800
Subject: [PATCH] Changes templates to provide button roles, labels and
 labelled-by attributes. Adds new id.

---
 views/js/controller/creator/templates/itemref.tpl     | 10 +++++-----
 views/js/controller/creator/templates/rubricblock.tpl |  4 ++--
 views/js/controller/creator/templates/section.tpl     | 10 +++++-----
 views/js/controller/creator/templates/testpart.tpl    |  8 ++++----
 4 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/views/js/controller/creator/templates/itemref.tpl b/views/js/controller/creator/templates/itemref.tpl
index 7e128df96a..aa5839a275 100644
--- a/views/js/controller/creator/templates/itemref.tpl
+++ b/views/js/controller/creator/templates/itemref.tpl
@@ -1,5 +1,5 @@
 <li id='{{identifier}}' data-uri='{{href}}' class='itemref'>
-    <span class='title truncate'>{{label}}</span>
+    <span id='{{identifier}}-title' class='title truncate'>{{label}}</span>
     <div class="actions"> 
         <div class="tlb">
             <div class="tlb-top">
@@ -7,12 +7,12 @@
                     <span class="tlb-bar">
                         <span class="tlb-start"></span>
                         <span class="tlb-group">
-                            <a href="#" class="tlb-button-off property-toggler" title="{{__ 'Item Reference Properties'}}"><span class="icon-settings"></span></a>
+                            <a aria-describedby='{{identifier}}-title' href="#" class="tlb-button-off property-toggler" title="{{__ 'Item Reference Properties'}}"role="button" aria-label="{{__ 'Item Reference Properties'}}"><span class="icon-settings"></span></a>
                             <span class="tlb-separator"></span>
-                            <a href="#" class="tlb-button-off move-up" title="{{__ 'Move Up'}}"><span class="icon-up"></span></a>
-                            <a href="#" class="tlb-button-off move-down" title="{{__ 'Move Down'}}"><span class="icon-down"></span></a>
+                            <a aria-describedby='{{identifier}}-title' href="#" class="tlb-button-off move-up" title="{{__ 'Move Up'}}"role="button" aria-label="{{__ 'Move Up'}}"><span class="icon-up"></span></a>
+                            <a aria-describedby='{{identifier}}-title' href="#" class="tlb-button-off move-down" title="{{__ 'Move Down'}}"role="button" aria-label="{{__ 'Move Down'}}"><span class="icon-down"></span></a>
                             <span class="tlb-separator"></span> 
-                            <a href="#" class="tlb-button-off" title="{{__ 'Remove Item Reference'}}" data-delete=":parent .itemref"><span class="icon-bin"></span></a>
+                            <a aria-describedby='{{identifier}}-title' href="#" class="tlb-button-off" title="{{__ 'Remove Item Reference'}}"role="button" aria-label="{{__ 'Remove Item Reference'}}" data-delete=":parent .itemref"><span class="icon-bin"></span></a>
                         </span>
                         <span class="tlb-end"></span>
                     </span>  
diff --git a/views/js/controller/creator/templates/rubricblock.tpl b/views/js/controller/creator/templates/rubricblock.tpl
index 4d5e7c0397..e6c31a8bef 100755
--- a/views/js/controller/creator/templates/rubricblock.tpl
+++ b/views/js/controller/creator/templates/rubricblock.tpl
@@ -6,9 +6,9 @@
                     <span class="tlb-bar">
                         <span class="tlb-start"></span>
                         <span class="tlb-group">
-                            <a href="#" class="tlb-button-off property-toggler" title="{{__ 'Rubric Block Properties'}}"><span class="icon-settings"></span></a>
+                            <a href="#" class="tlb-button-off property-toggler" title="{{__ 'Rubric Block Properties'}}"role="button" aria-label="{{__ 'Rubric Block Properties'}}"><span class="icon-settings"></span></a>
                             <span class="tlb-separator"></span>
-                            <a href="#" class="tlb-button-off" title="{{__ 'Remove Rubric Block'}}" data-delete=":parent .rubricblock"><span class="icon-bin"></span></a>
+                            <a href="#" class="tlb-button-off" title="{{__ 'Remove Rubric Block'}}" role="button" aria-label="{{__ 'Remove Rubric Block'}}" data-delete=":parent .rubricblock"><span class="icon-bin"></span></a>
                         </span>
                         <span class="tlb-end"></span>
                     </span>
diff --git a/views/js/controller/creator/templates/section.tpl b/views/js/controller/creator/templates/section.tpl
index cf7f86330c..f92a16c2f9 100644
--- a/views/js/controller/creator/templates/section.tpl
+++ b/views/js/controller/creator/templates/section.tpl
@@ -9,14 +9,14 @@
                         <span class="tlb-bar">
                             <span class="tlb-start"></span>
                             <span class="tlb-group">
-                                <a href="#" class="tlb-button-off rub-toggler" title="{{__ 'Manage Rubric Blocks'}}" data-toggle="#rublocks-{{identifier}}" ><span class="icon-rubric"></span></a>
+                                <a href="#" class="tlb-button-off rub-toggler" title="{{__ 'Manage Rubric Blocks'}}" role="button" aria-label="{{__ 'Manage Rubric Blocks'}}" data-toggle="#rublocks-{{identifier}}" ><span class="icon-rubric"></span></a>
                                 <span class="tlb-separator"></span>
-                                <a href="#" class="tlb-button-off property-toggler" title="{{__ 'Section Properties'}}"><span class="icon-settings"></span></a>
+                                <a href="#" class="tlb-button-off property-toggler" title="{{__ 'Section Properties'}}"role="button" aria-label="{{title}} Properties"><span class="icon-settings"></span></a>
                                 <span class="tlb-separator"></span>
-                                <a href="#" class="tlb-button-off move-up disabled" title="{{__ 'Move Up'}}"><span class="icon-up"></span></a>
-                                <a href="#" class="tlb-button-off move-down disabled" title="{{__ 'Move Down'}}"><span class="icon-down"></span></a>
+                                <a href="#" class="tlb-button-off move-up disabled" title="{{__ 'Move Up'}}"role="button" aria-label="Move Up {{title}}"><span class="icon-up"></span></a>
+                                <a href="#" class="tlb-button-off move-down disabled" title="{{__ 'Move Down'}}"role="button" aria-label="Move Down {{title}}"><span class="icon-down"></span></a>
                                 <span class="tlb-separator"></span>
-                                <a href="#" class="tlb-button-off disabled" title="{{__ 'Remove Section'}}" data-delete=":parent .section"><span class="icon-bin"></span></a>
+                                <a href="#" class="tlb-button-off disabled" title="{{__ 'Remove Section'}}"role="button" aria-label="Remove {{title}}" data-delete=":parent .section"><span class="icon-bin"></span></a>
                             </span>
                             <span class="tlb-end"></span>
                         </span>
diff --git a/views/js/controller/creator/templates/testpart.tpl b/views/js/controller/creator/templates/testpart.tpl
index c55e974025..fe306c1ad1 100644
--- a/views/js/controller/creator/templates/testpart.tpl
+++ b/views/js/controller/creator/templates/testpart.tpl
@@ -8,12 +8,12 @@
                         <span class="tlb-bar">
                             <span class="tlb-start"></span>
                             <span class="tlb-group">
-                                <a href="#" class="tlb-button-off property-toggler" title="Test Part Properties"><span class="icon-settings"></span></a>
+                                <a href="#" class="tlb-button-off property-toggler" title="Test Part Properties"role="button" aria-label="Test Part Properties"><span class="icon-settings"></span></a>
                                 <span class="tlb-separator"></span>
-                                <a href="#" class="tlb-button-off move-up" title="Move Up"><span class="icon-up"></span></a>
-                                <a href="#" class="tlb-button-off move-down" title="Move Down"><span class="icon-down"></span></a>
+                                <a href="#" class="tlb-button-off move-up" title="Move Up"role="button" aria-label="Move Up {{identifier}}"><span class="icon-up"></span></a>
+                                <a href="#" class="tlb-button-off move-down" title="Move Down"role="button" aria-label="Move Down {{identifier}}"><span class="icon-down"></span></a>
                                 <span class="tlb-separator"></span> 
-                                <a href="#" class="tlb-button-off" title="Remove Test Part" data-delete="#{{identifier}}"><span class="icon-bin"></span></a>
+                                <a href="#" class="tlb-button-off" title="Remove Test Part" role="button" aria-label="Remove Test Part {{identifier}}" data-delete="#{{identifier}}"><span class="icon-bin"></span></a>
                             </span>
                             <span class="tlb-end"></span>
                         </span>