Changeset 2526:a96260306d4e

Timestamp:

11/08/13 16:41:47 (12 years ago)

Author:

Nicolas <nikrou77@…>

Branch:

2.6

Message:

Add link around expand image for a11y; comments list. Addresses #1848
Fix toggle status (open or close) when clicking main arrow

Location:

admin/js

Files:

• _comments.js (modified) (5 diffs)
• _posts_list.js (modified) (1 diff)

admin/js/_comments.js

@@ -1 +1 @@
 dotclear.commentExpander = function(line) {
-     var td = line.firstChild;
-     
-     var img = document.createElement('img');
-     img.src = dotclear.img_plus_src;
-     img.alt = dotclear.img_plus_alt;
-     img.className = 'expand';
-     $(img).css('cursor','pointer');
-     img.line = line;
-     img.onclick = function() { dotclear.viewCommentContent(this,this.line); };
-     
-     td.insertBefore(img,td.firstChild);
+     $('<a href="#"><img src="'+dotclear.img_plus_src+'" alt="'+dotclear.img_plus_alt+'"/></a>')
+          .click(function() {
+               dotclear.toggleArrow(this);
+               dotclear.viewCommentContent(line);
+          })
+          .prependTo($(line).children().get(0)); // first td
 };
 
 dotclear.commentsExpander = function(line,lines) {
-     var td = line.firstChild;
-     
-     var img = document.createElement('img');
-     img.src = dotclear.img_plus_src;
-     img.alt = dotclear.img_plus_alt;
-     img.className = 'expand';
-     $(img).css('cursor','pointer');
-     img.lines = lines;
-     img.onclick = function() { dotclear.viewCommentsContent(this,this.lines); };
-     
-     td.insertBefore(img,td.firstChild);
+     $('<a href="#"><img src="'+dotclear.img_plus_src+'" alt="'+dotclear.img_plus_alt+'"/></a>')
+          .click(function() {
+               dotclear.toggleArrow(this);
+               lines.each(function() {
+                    var action = dotclear.toggleArrow(this.firstChild.firstChild);
+                    dotclear.viewCommentContent(this,action);
+               });
+          })
+          .prependTo($(line).children().get(0)); // first td
 };
 
-dotclear.viewCommentsContent = function(img,lines) {
-     lines.each(function() {
-          var td = this.firstChild;
-          td.firstChild.click();
-     });
+dotclear.toggleArrow = function(link,action) {
+     action = action || '';
+     var img = $(link).children().get(0);
+     if (action=='') {
+          if (img.alt==dotclear.img_plus_alt) {
+               action = 'open';
+          } else {
+               action = 'close';
+          }
+     }
 
-     if (img.alt == dotclear.img_plus_alt) {
+     if (action=='open') {
           img.src = dotclear.img_minus_src;
           img.alt = dotclear.img_minus_alt;
@@ -40 +38 @@
           img.alt = dotclear.img_plus_alt;
      }
-};
 
-dotclear.viewCommentContent = function(img,line) {
-     var commentId = line.id.substr(1);
-     
+     return action;
+}
+
+dotclear.viewCommentContent = function(line,action) {
+     var commentId = $(line).attr('id').substr(1);     
      var tr = document.getElementById('ce'+commentId);
      
@@ -54 +53 @@
           td.className = 'expand';
           tr.appendChild(td);
-          
-          img.src = dotclear.img_minus_src;
-          img.alt = dotclear.img_minus_alt;
           
           // Get comment content
@@ -91 +87 @@
           $(tr).toggle();
           $(line).toggleClass('expand');
-          img.src = dotclear.img_minus_src;
-          img.alt = dotclear.img_minus_alt;
      }
      else
@@ -98 +92 @@
           $(tr).toggle();
           $(line).toggleClass('expand');
-          img.src = dotclear.img_plus_src;
-          img.alt = dotclear.img_plus_alt;
      }
 };

admin/js/_posts_list.js

@@ -11 +11 @@
      $('<a href="#"><img src="'+dotclear.img_plus_src+'" alt="'+dotclear.img_plus_alt+'"/></a>')
           .click(function() {
-               var action = dotclear.toggleArrow(this);
+               dotclear.toggleArrow(this);
                lines.each(function() {
-                    dotclear.toggleArrow(this.firstChild.firstChild,action);
+                    var action = dotclear.toggleArrow(this.firstChild.firstChild);
                     dotclear.viewPostContent(this,action);
                });