Dotclear

source: admin/js/_post.js @ 2527:52b330f07bd8

Revision 2527:52b330f07bd8, 9.6 KB checked in by Nicolas <nikrou77@…>, 12 years ago (diff)

Fix a11y when expanding content in lists views (entries, comments, pages)
Closes #1848
Need refactoring and tests !
Line 
1dotclear.commentExpander = function(line) {
2     $('<a href="#"><img src="'+dotclear.img_plus_src+'" alt="'+dotclear.img_plus_alt+'"/></a>')
3          .click(function(e) {
4               dotclear.toggleArrow(this);
5               dotclear.viewCommentContent(line);
6               e.preventDefault();
7          })
8          .prependTo($(line).children().get(0)); // first td
9};
10
11dotclear.toggleArrow = function(link,action) {
12     action = action || '';
13     var img = $(link).children().get(0);
14     if (action=='') {
15          if (img.alt==dotclear.img_plus_alt) {
16               action = 'open';
17          } else {
18               action = 'close';
19          }
20     }
21
22     if (action=='open') {
23          img.src = dotclear.img_minus_src;
24          img.alt = dotclear.img_minus_alt;
25     } else {
26          img.src = dotclear.img_plus_src;
27          img.alt = dotclear.img_plus_alt;
28     }
29
30     return action;
31}
32
33dotclear.viewCommentContent = function(line,action) {
34     var commentId = $(line).attr('id').substr(1);
35     var tr = document.getElementById('ce'+commentId);
36
37     if (!tr) {
38          tr = document.createElement('tr');
39          tr.id = 'ce'+commentId;
40          var td = document.createElement('td');
41          td.colSpan = 6;
42          td.className = 'expand';
43          tr.appendChild(td);
44
45          // Get comment content
46          $.get('services.php',{f:'getCommentById',id: commentId},function(data) {
47               var rsp = $(data).children('rsp')[0];
48
49               if (rsp.attributes[0].value == 'ok') {
50                    var comment = $(rsp).find('comment_display_content').text();
51
52                    if (comment) {
53                         $(td).append(comment);
54                         var comment_email = $(rsp).find('comment_email').text();
55                         var comment_site = $(rsp).find('comment_site').text();
56                         var comment_ip = $(rsp).find('comment_ip').text();
57                         var comment_spam_disp = $(rsp).find('comment_spam_disp').text();
58
59                         $(td).append('<p><strong>' + dotclear.msg.website +
60                         '</strong> ' + comment_site + '<br />' +
61                         '<strong>' + dotclear.msg.email + '</strong> ' +
62                         comment_email + '<br />' + comment_spam_disp + '</p>');
63                    }
64               } else {
65                    alert($(rsp).find('message').text());
66               }
67          });
68
69          $(line).toggleClass('expand');
70          line.parentNode.insertBefore(tr,line.nextSibling);
71     }
72     else if (tr.style.display == 'none')
73     {
74          $(tr).toggle();
75          $(line).toggleClass('expand');
76     }
77     else
78     {
79          $(tr).toggle();
80          $(line).toggleClass('expand');
81     }
82};
83
84$(function() {
85     if (!document.getElementById) { return; }
86
87     if (document.getElementById('edit-entry'))
88     {
89          // Get document format and prepare toolbars
90          var formatField = $('#post_format').get(0);
91          var last_post_format = $(formatField).val();
92          $(formatField).change(function() {
93               // Confirm post format change
94               if(window.confirm(dotclear.msg.confirm_change_post_format_noconvert)){
95                    excerptTb.switchMode(this.value);
96                    contentTb.switchMode(this.value);
97                    last_post_format = $(this).val();
98               }else{
99                    // Restore last format if change cancelled
100                    $(this).val(last_post_format);
101               }
102               
103               $('.format_control > *').addClass('hide');
104               $('.format_control:not(.control_no_'+$(this).val()+') > *').removeClass('hide');
105          });
106
107          var excerptTb = new jsToolBar(document.getElementById('post_excerpt'));
108          var contentTb = new jsToolBar(document.getElementById('post_content'));
109          excerptTb.context = contentTb.context = 'post';
110     }
111
112     if (document.getElementById('comment_content')) {
113          var commentTb = new jsToolBar(document.getElementById('comment_content'));
114     }
115
116     // Post preview
117     $('#post-preview').modalWeb($(window).width()-40,$(window).height()-40);
118
119     // Tabs events
120     $('#edit-entry').onetabload(function() {
121          dotclear.hideLockable();
122
123          // Add date picker
124          var post_dtPick = new datePicker($('#post_dt').get(0));
125          post_dtPick.img_top = '1.5em';
126          post_dtPick.draw();
127
128          // Confirm post deletion
129          $('input[name="delete"]').click(function() {
130               return window.confirm(dotclear.msg.confirm_delete_post);
131          });
132
133          // Markup validator
134          var v = $('<div class="format_control"><p><a id="a-validator"></a></p><div/>').get(0);
135          $('.format_control').before(v);
136          var a = $('#a-validator').get(0);
137          a.href = '#';
138          a.className = 'button ';
139          $(a).click(function() {
140               
141               excerpt_content = $('#post_excerpt').css('display') != 'none' ? $('#post_excerpt').val() : $('#excerpt-area iframe').contents().find('body').html();
142               post_content    = $('#post_content').css('display') != 'none' ? $('#post_content').val() : $('#content-area iframe').contents().find('body').html();
143               
144               var params = {
145                    xd_check: dotclear.nonce,
146                    f: 'validatePostMarkup',
147                    excerpt: excerpt_content,
148                    content: post_content,
149                    format: $('#post_format').get(0).value,
150                    lang: $('#post_lang').get(0).value
151               };
152
153               $.post('services.php',params,function(data) {
154                    if ($(data).find('rsp').attr('status') != 'ok') {
155                         alert($(data).find('rsp message').text());
156                         return false;
157                    }
158                         
159                    $('.message, .success, .error, .warning-msg').remove();
160
161                    if ($(data).find('valid').text() == 1) {
162                         var p = document.createElement('p');
163                         p.id = 'markup-validator';
164                         
165                         $(p).addClass('success');
166                         $(p).text(dotclear.msg.xhtml_valid);
167                         $('#entry-content h3').after(p);
168                         $(p).backgroundFade({sColor: dotclear.fadeColor.beginValidatorMsg, eColor: dotclear.fadeColor.endValidatorMsg, steps: 50},function() {
169                                   $(this).backgroundFade({sColor: dotclear.fadeColor.endValidatorMsg, eColor: dotclear.fadeColor.beginValidatorMsg});
170                         });
171                    } else {
172                         var div = document.createElement('div');
173                         div.id = 'markup-validator';
174                         
175                         $(div).addClass('error');
176                         $(div).html('<p><strong>' + dotclear.msg.xhtml_not_valid + '</strong></p>' + $(data).find('errors').text());
177                         $('#entry-content h3').after(div);
178                         $(div).backgroundFade({sColor: dotclear.fadeColor.beginValidatorErr,eColor: dotclear.fadeColor.endValidatorErr, steps: 50},function() {
179                                   $(this).backgroundFade({sColor: dotclear.fadeColor.endValidatorErr, eColor: dotclear.fadeColor.beginValidatorErr});
180                         });
181                    }
182
183                    if ( $('#post_excerpt').text() != excerpt_content || $('#post_content').text() != post_content ) {
184                         var pn = document.createElement('p');
185                         $(pn).addClass('warning-msg');
186                         $(pn).text(dotclear.msg.warning_validate_no_save_content);
187                         $('#entry-content h3').after(pn);
188                    }
189
190                    return false;
191               });
192
193               return false;
194          });
195
196          a.appendChild(document.createTextNode(dotclear.msg.xhtml_validator));
197         
198          $('.format_control > *').addClass('hide');
199          $('.format_control:not(.control_no_'+last_post_format+') > *').removeClass('hide');
200
201          // Hide some fields
202          $('#notes-area label').toggleWithLegend($('#notes-area').children().not('label'),{
203               user_pref: 'dcx_post_notes',
204               legend_click:true,
205               hide: $('#post_notes').val() == ''
206          });
207          $('#post_lang').parent().children('label').toggleWithLegend($('#post_lang'),{
208               user_pref: 'dcx_post_lang',
209               legend_click: true
210          });
211          $('#post_password').parent().children('label').toggleWithLegend($('#post_password'),{
212               user_pref: 'dcx_post_password',
213               legend_click: true,
214               hide: $('#post_password').val() == ''
215          });
216          $('#post_status').parent().children('label').toggleWithLegend($('#post_status'),{
217               user_pref: 'dcx_post_status',
218               legend_click: true
219          });
220          $('#post_dt').parent().children('label').toggleWithLegend($('#post_dt').parent().children().not('label'),{
221               user_pref: 'dcx_post_dt',
222               legend_click: true
223          });
224          $('#label_format').toggleWithLegend($('#label_format').parent().children().not('#label_format'),{
225               user_pref: 'dcx_post_format',
226               legend_click: true
227          });
228          $('#label_cat_id').toggleWithLegend($('#label_cat_id').parent().children().not('#label_cat_id'),{
229               user_pref: 'dcx_cat_id',
230               legend_click: true
231          });
232          $('#create_cat').toggleWithLegend($('#create_cat').parent().children().not('#create_cat'),{
233               // no cookie on new category as we don't use this every day
234               legend_click: true
235          });
236          $('#label_comment_tb').toggleWithLegend($('#label_comment_tb').parent().children().not('#label_comment_tb'),{
237               user_pref: 'dcx_comment_tb',
238               legend_click: true
239          });
240          $('#post_url').parent().children('label').toggleWithLegend($('#post_url').parent().children().not('label'),{
241               user_pref: 'post_url',
242               legend_click: true
243          });
244          // We load toolbar on excerpt only when it's ready
245          $('#excerpt-area label').toggleWithLegend($('#excerpt-area').children().not('label'),{
246               user_pref: 'dcx_post_excerpt',
247               legend_click: true,
248               hide: $('#post_excerpt').val() == ''
249          });
250
251          // Load toolbars
252          contentTb.switchMode(formatField.value);
253          excerptTb.switchMode(formatField.value);
254
255          // Replace attachment remove links by a POST form submit
256          $('a.attachment-remove').click(function() {
257               this.href = '';
258               var m_name = $(this).parents('ul').find('li:first>a').attr('title');
259               if (window.confirm(dotclear.msg.confirm_remove_attachment.replace('%s',m_name))) {
260                    var f = $('#attachment-remove-hide').get(0);
261                    f.elements['media_id'].value = this.id.substring(11);
262                    f.submit();
263               }
264               return false;
265          });
266
267          // Check unsaved changes before XHTML conversion
268          var excerpt = $('#post_excerpt').val();
269          var content = $('#post_content').val();
270          $('#convert-xhtml').click(function() {
271               if (excerpt != $('#post_excerpt').val() || content != $('#post_content').val()) {
272                    return window.confirm(dotclear.msg.confirm_change_post_format);
273               }
274          });
275     });
276
277     $('#comments').onetabload(function() {
278          $('#form-comments .comments-list tr.line').each(function() {
279               dotclear.commentExpander(this);
280          });
281          $('#form-comments .checkboxes-helpers').each(function() {
282               dotclear.checkboxesHelpers(this);
283          });
284
285          dotclear.commentsActionsHelper();
286     });
287
288     $('#trackbacks').onetabload(function() {
289          $('#form-trackbacks .comments-list tr.line').each(function() {
290               dotclear.commentExpander(this);
291          });
292          $('#form-trackbacks .checkboxes-helpers').each(function() {
293               dotclear.checkboxesHelpers(this);
294          });
295
296          dotclear.commentsActionsHelper();
297     });
298
299     $('#add-comment').onetabload(function() {
300          commentTb.draw('xhtml');
301     });
302});
Note: See TracBrowser for help on using the repository browser.

Sites map