Merge pull request #1321 from edx/gprice/forum-loading-a11y

Add accessible text to forum loading animations

common/static/coffee/src/discussion/utils.coffee

@@ -3,7 +3,7 @@ $ ->
     window.$$contents = {}
   $.fn.extend
     loading: ->
-      @$_loading = $("<div class='loading-animation'></div>")
+      @$_loading = $("<div class='loading-animation'><span class='sr'>Loading content</span></div>")
       $(this).after(@$_loading)
     loaded: ->
       @$_loading.remove()

common/static/coffee/src/discussion/views/discussion_thread_list_view.coffee

@@ -124,7 +124,7 @@ if Backbone?
     loadMorePages: (event) ->
       if event
         event.preventDefault()
-      @$(".more-pages").html('<div class="loading-animation"></div>')
+      @$(".more-pages").html('<div class="loading-animation"><span class="sr">Loading more threads</span></div>')
       @$(".more-pages").addClass("loading")
       options = {}
       switch @mode
@@ -405,7 +405,7 @@ if Backbone?
         type: "GET"
         $loading: $
         loadingCallback: =>
-          @$(".post-list").html('<li class="loading"><div class="loading-animation"></div></li>')
+          @$(".post-list").html('<li class="loading"><div class="loading-animation"><span class="sr">Loading thread list</span></div></li>')
         loadedCallback: =>
           if callback
             callback.apply @, [value]

lms/templates/discussion/_underscore_templates.html

@@ -6,7 +6,7 @@
         <div class="thread-content-wrapper"></div>
         
         <ol class="responses">
-            <li class="loading"><div class="loading-animation"></div></li>
+            <li class="loading"><div class="loading-animation"><span class="sr">Loading content</span></div></li>
         </ol>
         <div class="post-status-closed bottom-post-status" style="display: none">
           ${_("This thread is closed.")}

lms/templates/discussion/mustache/_inline_thread.mustache

@@ -2,7 +2,7 @@
     <div class="thread-content-wrapper"></div>
 
     <ol class="responses post-extended-content">
-        <li class="loading"><div class="loading-animation"></div></li>
+        <li class="loading"><div class="loading-animation"><span class="sr">Loading content</span></div></li>
     </ol>
     <form class="local discussion-reply-new post-extended-content"  data-id="{{id}}">
         <h4>Post a response:</h4>

lms/templates/discussion/mustache/_inline_thread_cohorted.mustache

@@ -4,7 +4,7 @@
     <div class="thread-content-wrapper"></div>
 
     <ol class="responses post-extended-content">
-        <li class="loading"><div class="loading-animation"></div></li>
+        <li class="loading"><div class="loading-animation"><span class="sr">Loading content</span></div></li>
     </ol>
     <form class="local discussion-reply-new post-extended-content"  data-id="{{id}}">
         <h4>Post a response:</h4>