Merge pull request #22 from pmitros/accessibility

add accessibility

recommender/recommender.py

@@ -214,6 +214,8 @@ class RecommenderXBlock(XBlock):
         being defined. However, It's the only way to get the data right now.
         TODO: Should be proper handled in future
         """
+        if "workbench" in str(type(self.runtime)):
+            return 'user1'
         return self.xmodule_runtime.anonymous_student_id
 
     def resource_string(self, path):
@@ -576,7 +578,6 @@ class RecommenderXBlock(XBlock):
         result['reason'] = data['reason']
 
         user_id = self.get_user_id()
-
         if data['isProblematic']:
             if data['id'] in self.flagged_ids:
                 result['oldReason'] = self.flagged_reasons[

recommender/static/css/recommender.css

@@ -39,8 +39,6 @@
   color: #948f8f;
 }
 
-.hideShow:before { content: 'Show'; }
-.hideShow.resourceListExpanded:before { content: 'Hide'; }
 .hideShow.resourceListExpanded { cursor: n-resize; }
 .hideShow:not(.resourceListExpanded) { cursor: s-resize; }
 .resourceListExpanded .expanded { display: block; }
@@ -124,6 +122,11 @@
   text-align:center;
 }
 
+.recommenderVoteArrowDown:before {
+  content: '↓';
+  font-weight: bold;
+}
+
 .recommenderVoteArrowUp {
   width: 100%; 
   margin-left:auto;
@@ -131,6 +134,11 @@
   text-align:center;
 }
 
+.recommenderVoteArrowUp:before {
+  content: '↑';
+  font-weight: bold;
+}
+
 .recommenderVoteScore {
   width: 100%; 
   text-align: center;
@@ -254,7 +262,7 @@ input[type="button"]:not([DISABLED]){
 .plusIcon:before { content: '+'; }
 .nextPageIcon:before { content: '►'; }
 .previousPageIcon:before { content: '◄'; }
-.morePageIcon:before { content: '...'; }
+/*.morePageIcon:before { content: '...'; }*/
 .highlightActivePageNumber { background-color: #948f8f; }
 
 .my-custom-theme {

recommender/static/html/resourcebox.html

 <%page args="title,votes,url,description,descriptionText,id,isProblematic,problematicReason,voteMode,endorseMode,endorsedReason"/> 
 <div class="recommenderResource">
     <div class="recommenderVoteBox">
-        <div class="recommenderVoteArrowUp ${voteMode}" role="button" aria-label="upvote" tabindex="0"><b>↑</b></div>
-        <div class="recommenderVoteScore ${voteMode}">${votes}</div>
-        <div class="recommenderVoteArrowDown ${voteMode}" role="button" aria-label="downvote" tabindex="0"><b>↓</b></div>
+        <div class="recommenderVoteArrowUp ${voteMode}" role="button" aria-label="upvote" tabindex="0"></div>
+        <div class="recommenderVoteScore ${voteMode}" aria-label="Votes: ">${votes}</div>
+        <div class="recommenderVoteArrowDown ${voteMode}" role="button" aria-label="downvote" tabindex="0"></div>
     </div>
     <div class="recommenderBlurb">
-        <div class="recommenderTitle"><a href="${url}" target="_blank">${title}</a></div>
+        <div class="recommenderTitle"><a href="${url}" target="_blank" role="button" aria-label="Resource: " tabindex="0">${title}</a></div>
         <div class="recommenderDescriptionText">${descriptionText}</div>
         <div class="recommenderDescriptionImg">${description}</div>
         <div class="recommenderEntryId">${id}</div>
@@ -17,7 +17,7 @@
         <div class="endorse ${endorseMode}"></div>
     </div>
     <div class="recommenderEdit">
-        <span class="ui-icon ui-icon-pencil resourceEditButton"></span>
-        <span class="ui-icon ui-icon-flag flagResource ${isProblematic}"></span>
+        <span class="ui-icon ui-icon-pencil resourceEditButton" role="button" aria-label="edit resource" tabindex="0"></span>
+        <span class="ui-icon ui-icon-flag flagResource ${isProblematic}" role="button" aria-label="flag resource" tabindex="0"></span>
     </div>
 </div>
\ No newline at end of file

recommender/static/js/src/cats.js

@@ -99,12 +99,12 @@ var exportResourceFileInfo = {
 var confirmInterruptSubmission = 'The content you typed has not been submitted yet. Are you sure to go back?';
 
 var headerText = {
-    'importResource': 'Import resources',
-    'addResource': 'Suggest resource',
-    'editResource': 'Edit existing resource',
-    'flagResource': 'Flag Resource',
-    'endorseResource': 'Endorse Resource',
-    'deendorseResource': 'Deendorse Resource'
+    '.importResourcePage': 'Import resources',
+    '.addResourcePage': 'Suggest resource',
+    '.editResourcePage': 'Edit existing resource',
+    '.flagResourcePage': 'Flag Resource',
+    '.endorsePage': 'Endorse Resource',
+    '.deendorsePage': 'Deendorse Resource'
 };
 
 var writeDatabaseEnum = {
@@ -139,6 +139,23 @@ var voteConfigs = {
     }
 };
 
+var resourceListHeader = {
+    'hide': 'Hide related resources',
+    'show': 'Show related resources'
+}
+
+var ariaLabelText = {
+    'upvote': 'upvote',
+    'downvote': 'downvote',
+    'undoUpvote': 'undo upvote',
+    'undoDownvote': 'undo downvote',
+    'problematicResource': 'problematic resource',
+    'endorsedResource': 'endorsed resource',
+    'endorseResource': 'endorse resource',
+    'undoEndorseResource': 'undo endorse resource',
+    'deendorseResource': 'deendorse resource'
+}
+
 var toggleVoteFlag = 'toggle';
 var endorseFlag = 'reason';
 var deendorseIcon = '<span class="ui-icon ui-icon-gear deendorse"></span>';