Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse code

MDL-30816 choice module: fixed accessibility for responses table and …

…make it easier for screenreader to read it
  • Loading branch information...
commit 0ed9c7456d88ed05a3c6bce83f7ea4430ea8d754 1 parent d71b79a
rwijaya rwijaya authored
7 mod/choice/lang/en/choice.php
@@ -68,12 +68,15 @@
68 68 * To facilitate student decision-making, for example allowing students to vote on a direction for the course';
69 69 $string['modulename_link'] = 'mod/choice/view';
70 70 $string['modulenameplural'] = 'Choices';
  71 +$string['moveselectedusersto'] = 'Move selected users to...';
71 72 $string['mustchooseone'] = 'You must choose an answer before saving. Nothing was saved.';
72 73 $string['noguestchoose'] = 'Sorry, guests are not allowed to make choices.';
73 74 $string['noresultsviewable'] = 'The results are not currently viewable.';
74 75 $string['notanswered'] = 'Not answered yet';
75 76 $string['notenrolledchoose'] = 'Sorry, only enrolled users are allowed to make choices.';
76 77 $string['notopenyet'] = 'Sorry, this activity is not available until {$a}';
  78 +$string['numberofuser'] = 'The number of user';
  79 +$string['numberofuserinpercentage'] = 'The number of user in percentage';
77 80 $string['option'] = 'Option';
78 81 $string['page-mod-choice-x'] = 'Any choice module page';
79 82 $string['pluginadministration'] = 'Choice administration';
@@ -89,6 +92,7 @@
89 92 $string['removemychoice'] = 'Remove my choice';
90 93 $string['removeresponses'] = 'Remove all responses';
91 94 $string['responses'] = 'Responses';
  95 +$string['responsesresultgraphheader'] = 'Graph display';
92 96 $string['responsesto'] = 'Responses to {$a}';
93 97 $string['savemychoice'] = 'Save my choice';
94 98 $string['showunanswered'] = 'Show column for unanswered';
@@ -98,7 +102,6 @@
98 102 $string['timerestrict'] = 'Restrict answering to this time period';
99 103 $string['viewallresponses'] = 'View {$a} responses';
100 104 $string['withselected'] = 'With selected';
  105 +$string['userchoosethisoption'] = 'User choose this option';
101 106 $string['yourselection'] = 'Your selection';
102 107 $string['skipresultgraph'] = 'Skip result graph';
103   -$string['moveselectedusersto'] = 'Move selected users to...';
104   -$string['numberofuser'] = 'The number of user';
237 mod/choice/renderer.php
@@ -141,34 +141,69 @@ public function display_publish_name_vertical($choices) {
141 141 $table->cellspacing = 0;
142 142 $table->attributes['class'] = 'results names ';
143 143 $table->tablealign = 'center';
  144 + $table->summary = get_string('responsesto', 'choice', $choices->name);
144 145 $table->data = array();
145 146
146 147 $count = 0;
147 148 ksort($choices->options);
148 149
149 150 $columns = array();
  151 + $celldefault = new html_table_cell();
  152 + $celldefault->attributes['class'] = 'data';
  153 +
  154 + // This extra cell is needed in order to support accessibility for screenreader. MDL-30816
  155 + $accessiblecell = new html_table_cell();
  156 + $accessiblecell->scope = 'row';
  157 + $accessiblecell->text = get_string('choiceoptions', 'choice');
  158 + $columns['options'][] = $accessiblecell;
  159 +
  160 + $usernumberheader = clone($celldefault);
  161 + $usernumberheader->header = true;
  162 + $usernumberheader->attributes['class'] = 'header data';
  163 + $usernumberheader->text = get_string('numberofuser', 'choice');
  164 + $columns['usernumber'][] = $usernumberheader;
  165 +
  166 +
150 167 foreach ($choices->options as $optionid => $options) {
151   - $coldata = '';
  168 + $celloption = clone($celldefault);
  169 + $cellusernumber = clone($celldefault);
  170 + $cellusernumber->style = 'text-align: center;';
  171 +
  172 + $celltext = '';
152 173 if ($choices->showunanswered && $optionid == 0) {
153   - $coldata .= html_writer::tag('div', format_string(get_string('notanswered', 'choice')), array('class'=>'option'));
  174 + $celltext = format_string(get_string('notanswered', 'choice'));
154 175 } else if ($optionid > 0) {
155   - $coldata .= html_writer::tag('div', format_string($choices->options[$optionid]->text), array('class'=>'option'));
  176 + $celltext = format_string($choices->options[$optionid]->text);
156 177 }
157 178 $numberofuser = 0;
158 179 if (!empty($options->user) && count($options->user) > 0) {
159 180 $numberofuser = count($options->user);
160 181 }
161 182
162   - $coldata .= html_writer::tag('div', ' ('.$numberofuser. ')', array('class'=>'numberofuser', 'title' => get_string('numberofuser', 'choice')));
163   - $columns[] = $coldata;
  183 + $celloption->text = $celltext;
  184 + $cellusernumber->text = $numberofuser;
  185 +
  186 + $columns['options'][] = $celloption;
  187 + $columns['usernumber'][] = $cellusernumber;
164 188 }
165 189
166   - $table->head = $columns;
  190 + $table->head = $columns['options'];
  191 + $table->data[] = new html_table_row($columns['usernumber']);
167 192
168   - $coldata = '';
169 193 $columns = array();
  194 +
  195 + // This extra cell is needed in order to support accessibility for screenreader. MDL-30816
  196 + $accessiblecell = new html_table_cell();
  197 + $accessiblecell->text = get_string('userchoosethisoption', 'choice');
  198 + $accessiblecell->header = true;
  199 + $accessiblecell->scope = 'row';
  200 + $accessiblecell->attributes['class'] = 'header data';
  201 + $columns[] = $accessiblecell;
  202 +
170 203 foreach ($choices->options as $optionid => $options) {
171   - $coldata = '';
  204 + $cell = new html_table_cell();
  205 + $cell->attributes['class'] = 'data';
  206 +
172 207 if ($choices->showunanswered || $optionid > 0) {
173 208 if (!empty($options->user)) {
174 209 foreach ($options->user as $user) {
@@ -188,19 +223,16 @@ public function display_publish_name_vertical($choices) {
188 223 $name = html_writer::tag('a', fullname($user, $choices->fullnamecapability), array('href'=>$userlink, 'class'=>'username'));
189 224 $data .= html_writer::tag('div', $name, array('class'=>'fullname'));
190 225 $data .= html_writer::tag('div','', array('class'=>'clearfloat'));
191   - $coldata .= html_writer::tag('div', $data, array('class'=>'user'));
  226 + $cell->text = html_writer::tag('div', $data, array('class'=>'user'));
192 227 }
193 228 }
194 229 }
195   -
196   - $columns[] = $coldata;
  230 + $columns[] = $cell;
197 231 $count++;
198 232 }
  233 + $row = new html_table_row($columns);
  234 + $table->data[] = $row;
199 235
200   - $table->data[] = $columns;
201   - foreach ($columns as $d) {
202   - $table->colclasses[] = 'data';
203   - }
204 236 $html .= html_writer::tag('div', html_writer::table($table), array('class'=>'response'));
205 237
206 238 $actiondata = '';
@@ -245,71 +277,88 @@ public function display_publish_anonymous_vertical($choices) {
245 277 $table->cellpadding = 5;
246 278 $table->cellspacing = 0;
247 279 $table->attributes['class'] = 'results anonymous ';
  280 + $table->summary = get_string('responsesto', 'choice', $choices->name);
248 281 $table->data = array();
  282 +
249 283 $count = 0;
250 284 ksort($choices->options);
251 285 $columns = array();
252 286 $rows = array();
253 287
254   - foreach ($choices->options as $optionid => $options) {
255   - $numberofuser = 0;
256   - if (!empty($options->user)) {
257   - $numberofuser = count($options->user);
  288 + $headercelldefault = new html_table_cell();
  289 + $headercelldefault->scope = 'row';
  290 + $headercelldefault->header = true;
  291 + $headercelldefault->attributes = array('class'=>'header data');
  292 +
  293 + // column header
  294 + $tableheader = clone($headercelldefault);
  295 + $tableheader->text = html_writer::tag('div', get_string('choiceoptions', 'choice'), array('class' => 'accesshide'));
  296 + $rows['header'][] = $tableheader;
  297 +
  298 + // graph row header
  299 + $graphheader = clone($headercelldefault);
  300 + $graphheader->text = html_writer::tag('div', get_string('responsesresultgraphheader', 'choice'), array('class' => 'accesshide'));
  301 + $rows['graph'][] = $graphheader;
  302 +
  303 + // user number row header
  304 + $usernumberheader = clone($headercelldefault);
  305 + $usernumberheader->text = get_string('numberofuser', 'choice');
  306 + $rows['usernumber'][] = $usernumberheader;
  307 +
  308 + // user percentage row header
  309 + $userpercentageheader = clone($headercelldefault);
  310 + $userpercentageheader->text = get_string('numberofuserinpercentage', 'choice');
  311 + $rows['userpercentage'][] = $userpercentageheader;
  312 +
  313 + $contentcelldefault = new html_table_cell();
  314 + $contentcelldefault->attributes = array('class'=>'data');
  315 +
  316 + foreach ($choices->options as $optionid => $option) {
  317 + // calculate display length
  318 + $height = $percentageamount = $numberofuser = 0;
  319 + $usernumber = $userpercentage = '';
  320 +
  321 + if (!empty($option->user)) {
  322 + $numberofuser = count($option->user);
258 323 }
259   - $height = 0;
260   - $percentageamount = 0;
  324 +
261 325 if($choices->numberofuser > 0) {
262 326 $height = ($CHOICE_COLUMN_HEIGHT * ((float)$numberofuser / (float)$choices->numberofuser));
263 327 $percentageamount = ((float)$numberofuser/(float)$choices->numberofuser)*100.0;
264 328 }
265 329
266   - $displaydiagram = html_writer::tag('img','', array('style'=>'height:'.$height.'px;width:49px;', 'alt'=>'', 'src'=>$this->output->pix_url('column', 'choice')));
267   -
268   - $cell = new html_table_cell();
269   - $cell->text = $displaydiagram;
270   - $cell->attributes = array('class'=>'graph vertical data');
271   - $columns[] = $cell;
272   - }
273   - $rowgraph = new html_table_row();
274   - $rowgraph->cells = $columns;
275   - $rows[] = $rowgraph;
  330 + $displaygraph = html_writer::tag('img','', array('style'=>'height:'.$height.'px;width:49px;', 'alt'=>'', 'src'=>$this->output->pix_url('column', 'choice')));
276 331
277   - $columns = array();
278   - $printskiplink = true;
279   - foreach ($choices->options as $optionid => $options) {
280   - $columndata = '';
281   - $numberofuser = 0;
282   - if (!empty($options->user)) {
283   - $numberofuser = count($options->user);
284   - }
  332 + // header
  333 + $headercell = clone($contentcelldefault);
  334 + $headercell->text = $option->text;
  335 + $rows['header'][] = $headercell;
285 336
286   - if ($printskiplink) {
287   - $columndata .= html_writer::tag('div', '', array('class'=>'skip-block-to', 'id'=>'skipresultgraph'));
288   - $printskiplink = false;
289   - }
  337 + // Graph
  338 + $graphcell = clone($contentcelldefault);
  339 + $graphcell->attributes = array('class'=>'graph vertical data');
  340 + $graphcell->text = $displaygraph;
  341 + $rows['graph'][] = $graphcell;
290 342
291   - if ($choices->showunanswered && $optionid == 0) {
292   - $columndata .= html_writer::tag('div', format_string(get_string('notanswered', 'choice')), array('class'=>'option'));
293   - } else if ($optionid > 0) {
294   - $columndata .= html_writer::tag('div', format_string($choices->options[$optionid]->text), array('class'=>'option'));
295   - }
296   - $columndata .= html_writer::tag('div', ' ('.$numberofuser.')', array('class'=>'numberofuser', 'title'=> get_string('numberofuser', 'choice')));
  343 + $usernumber .= html_writer::tag('div', ' '.$numberofuser.'', array('class'=>'numberofuser', 'title'=> get_string('numberofuser', 'choice')));
  344 + $userpercentage .= html_writer::tag('div', format_float($percentageamount,1). '%', array('class'=>'percentage'));
297 345
298   - if($choices->numberofuser > 0) {
299   - $percentageamount = ((float)$numberofuser/(float)$choices->numberofuser)*100.0;
300   - }
301   - $columndata .= html_writer::tag('div', format_float($percentageamount,1). '%', array('class'=>'percentage'));
  346 + // number of user
  347 + $usernumbercell = clone($contentcelldefault);
  348 + $usernumbercell->text = $usernumber;
  349 + $rows['usernumber'][] = $usernumbercell;
302 350
303   - $cell = new html_table_cell();
304   - $cell->text = $columndata;
305   - $cell->attributes = array('class'=>'data header');
306   - $columns[] = $cell;
  351 + // percentage of user
  352 + $numbercell = clone($contentcelldefault);
  353 + $numbercell->text = $userpercentage;
  354 + $rows['userpercentage'][] = $numbercell;
307 355 }
308   - $rowdata = new html_table_row();
309   - $rowdata->cells = $columns;
310   - $rows[] = $rowdata;
311 356
312   - $table->data = $rows;
  357 + $table->head = $rows['header'];
  358 + $trgraph = new html_table_row($rows['graph']);
  359 + $trusernumber = new html_table_row($rows['usernumber']);
  360 + $truserpercentage = new html_table_row($rows['userpercentage']);
  361 + $table->data = array($trgraph, $trusernumber, $truserpercentage);
313 362
314 363 $header = html_writer::tag('h2',format_string(get_string("responses", "choice")));
315 364 $html .= html_writer::tag('div', $header, array('class'=>'responseheader'));
@@ -331,52 +380,76 @@ public function display_publish_anonymous_horizontal($choices) {
331 380 $table->cellpadding = 5;
332 381 $table->cellspacing = 0;
333 382 $table->attributes['class'] = 'results anonymous ';
  383 + $table->summary = get_string('responsesto', 'choice', $choices->name);
334 384 $table->data = array();
335 385
  386 + $columnheaderdefault = new html_table_cell();
  387 + $columnheaderdefault->scope = 'col';
  388 +
  389 + $tableheadertext = clone($columnheaderdefault);
  390 + $tableheadertext->text = get_string('choiceoptions', 'choice');
  391 +
  392 + $tableheadernumber = clone($columnheaderdefault);
  393 + $tableheadernumber->text = get_string('numberofuser', 'choice');
  394 +
  395 + $tableheaderpercentage = clone($columnheaderdefault);
  396 + $tableheaderpercentage->text = get_string('numberofuserinpercentage', 'choice');
  397 +
  398 + $tableheadergraph = clone($columnheaderdefault);
  399 + $tableheadergraph->text = get_string('responsesresultgraphheader', 'choice');
  400 +
  401 + $table->head = array($tableheadertext, $tableheadernumber, $tableheaderpercentage, $tableheadergraph);
  402 +
336 403 $count = 0;
337 404 ksort($choices->options);
338 405
  406 + $columndefault = new html_table_cell();
  407 + $columndefault->attributes['class'] = 'data';
  408 +
  409 + $colheaderdefault = new html_table_cell();
  410 + $colheaderdefault->scope = 'row';
  411 + $colheaderdefault->header = true;
  412 + $colheaderdefault->attributes['class'] = 'header data';
  413 +
339 414 $rows = array();
340 415 foreach ($choices->options as $optionid => $options) {
341   - $numberofuser = 0;
342   - $graphcell = new html_table_cell();
  416 + $colheader = clone($colheaderdefault);
  417 + $colheader->text = $options->text;
  418 +
  419 + $graphcell = clone($columndefault);
  420 + $datacellnumber = clone($columndefault);
  421 + $datacellpercentage = clone($columndefault);
  422 +
  423 + $numberofuser = $width = $percentageamount = 0;
  424 +
343 425 if (!empty($options->user)) {
344 426 $numberofuser = count($options->user);
345 427 }
346 428
347   - $width = 0;
348   - $percentageamount = 0;
349   - $columndata = '';
350 429 if($choices->numberofuser > 0) {
351 430 $width = ($CHOICE_COLUMN_WIDTH * ((float)$numberofuser / (float)$choices->numberofuser));
352 431 $percentageamount = ((float)$numberofuser/(float)$choices->numberofuser)*100.0;
353 432 }
354   - $displaydiagram = html_writer::tag('img','', array('style'=>'height:50px; width:'.$width.'px', 'alt'=>'', 'src'=>$this->output->pix_url('row', 'choice')));
355 433
356   - $skiplink = html_writer::tag('a', get_string('skipresultgraph', 'choice'), array('href'=>'#skipresultgraph'. $optionid, 'class'=>'skip-block'));
357   - $skiphandler = html_writer::tag('span', '', array('class'=>'skip-block-to', 'id'=>'skipresultgraph'.$optionid));
  434 + $attributes = array();
  435 + $attributes['style'] = 'height:50px; width:'.$width.'px';
  436 + $attributes['alt'] = '';
  437 + $attributes['src'] = $this->output->pix_url('row', 'choice');
  438 + $displaydiagram = html_writer::tag('img','', $attributes);
358 439
359   - $graphcell->text = $skiplink . $displaydiagram . $skiphandler;
  440 + $graphcell->text = $displaydiagram;
360 441 $graphcell->attributes = array('class'=>'graph horizontal');
361 442
362   - $datacell = new html_table_cell();
363   - if ($choices->showunanswered && $optionid == 0) {
364   - $columndata .= html_writer::tag('div', format_string(get_string('notanswered', 'choice')), array('class'=>'option'));
365   - } else if ($optionid > 0) {
366   - $columndata .= html_writer::tag('div', format_string($choices->options[$optionid]->text), array('class'=>'option'));
367   - }
368   - $columndata .= html_writer::tag('div', ' ('.$numberofuser.')', array('title'=> get_string('numberofuser', 'choice'), 'class'=>'numberofuser'));
369   -
370 443 if($choices->numberofuser > 0) {
371 444 $percentageamount = ((float)$numberofuser/(float)$choices->numberofuser)*100.0;
372 445 }
373   - $columndata .= html_writer::tag('div', format_float($percentageamount,1). '%', array('class'=>'percentage'));
374 446
375   - $datacell->text = $columndata;
376   - $datacell->attributes = array('class'=>'header');
  447 + $datacellnumber->text = $numberofuser;
  448 + $datacellpercentage->text = format_float($percentageamount,1). '%';
  449 +
377 450
378 451 $row = new html_table_row();
379   - $row->cells = array($datacell, $graphcell);
  452 + $row->cells = array($colheader, $datacellnumber, $datacellpercentage, $graphcell);
380 453 $rows[] = $row;
381 454 }
382 455
2  mod/choice/styles.css
@@ -23,6 +23,8 @@
23 23
24 24 .path-mod-choice .results.anonymous .graph.vertical,
25 25 .path-mod-choice .cell {vertical-align: bottom; text-align: center; }
  26 +.path-mod-choice .results.anonymous th.header {border: 1px solid inherit;}
  27 +
26 28 .path-mod-choice .results.names .header{width:10%; white-space: normal;}
27 29 .path-mod-choice .results.names .cell{vertical-align: top; text-align: left;}
28 30 .path-mod-choice .results.names .user,

0 comments on commit 0ed9c74

Please sign in to comment.
Something went wrong with that request. Please try again.