Permalink
Browse files

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

…make it easier for screenreader to read it
  • Loading branch information...
1 parent d71b79a commit 0ed9c7456d88ed05a3c6bce83f7ea4430ea8d754 @rwijaya rwijaya committed Mar 1, 2012
Showing with 162 additions and 84 deletions.
  1. +5 −2 mod/choice/lang/en/choice.php
  2. +155 −82 mod/choice/renderer.php
  3. +2 −0 mod/choice/styles.css
View
7 mod/choice/lang/en/choice.php
@@ -68,12 +68,15 @@
* To facilitate student decision-making, for example allowing students to vote on a direction for the course';
$string['modulename_link'] = 'mod/choice/view';
$string['modulenameplural'] = 'Choices';
+$string['moveselectedusersto'] = 'Move selected users to...';
$string['mustchooseone'] = 'You must choose an answer before saving. Nothing was saved.';
$string['noguestchoose'] = 'Sorry, guests are not allowed to make choices.';
$string['noresultsviewable'] = 'The results are not currently viewable.';
$string['notanswered'] = 'Not answered yet';
$string['notenrolledchoose'] = 'Sorry, only enrolled users are allowed to make choices.';
$string['notopenyet'] = 'Sorry, this activity is not available until {$a}';
+$string['numberofuser'] = 'The number of user';
+$string['numberofuserinpercentage'] = 'The number of user in percentage';
$string['option'] = 'Option';
$string['page-mod-choice-x'] = 'Any choice module page';
$string['pluginadministration'] = 'Choice administration';
@@ -89,6 +92,7 @@
$string['removemychoice'] = 'Remove my choice';
$string['removeresponses'] = 'Remove all responses';
$string['responses'] = 'Responses';
+$string['responsesresultgraphheader'] = 'Graph display';
$string['responsesto'] = 'Responses to {$a}';
$string['savemychoice'] = 'Save my choice';
$string['showunanswered'] = 'Show column for unanswered';
@@ -98,7 +102,6 @@
$string['timerestrict'] = 'Restrict answering to this time period';
$string['viewallresponses'] = 'View {$a} responses';
$string['withselected'] = 'With selected';
+$string['userchoosethisoption'] = 'User choose this option';
$string['yourselection'] = 'Your selection';
$string['skipresultgraph'] = 'Skip result graph';
-$string['moveselectedusersto'] = 'Move selected users to...';
-$string['numberofuser'] = 'The number of user';
View
237 mod/choice/renderer.php
@@ -141,34 +141,69 @@ public function display_publish_name_vertical($choices) {
$table->cellspacing = 0;
$table->attributes['class'] = 'results names ';
$table->tablealign = 'center';
+ $table->summary = get_string('responsesto', 'choice', $choices->name);
$table->data = array();
$count = 0;
ksort($choices->options);
$columns = array();
+ $celldefault = new html_table_cell();
+ $celldefault->attributes['class'] = 'data';
+
+ // This extra cell is needed in order to support accessibility for screenreader. MDL-30816
+ $accessiblecell = new html_table_cell();
+ $accessiblecell->scope = 'row';
+ $accessiblecell->text = get_string('choiceoptions', 'choice');
+ $columns['options'][] = $accessiblecell;
+
+ $usernumberheader = clone($celldefault);
+ $usernumberheader->header = true;
+ $usernumberheader->attributes['class'] = 'header data';
+ $usernumberheader->text = get_string('numberofuser', 'choice');
+ $columns['usernumber'][] = $usernumberheader;
+
+
foreach ($choices->options as $optionid => $options) {
- $coldata = '';
+ $celloption = clone($celldefault);
+ $cellusernumber = clone($celldefault);
+ $cellusernumber->style = 'text-align: center;';
+
+ $celltext = '';
if ($choices->showunanswered && $optionid == 0) {
- $coldata .= html_writer::tag('div', format_string(get_string('notanswered', 'choice')), array('class'=>'option'));
+ $celltext = format_string(get_string('notanswered', 'choice'));
} else if ($optionid > 0) {
- $coldata .= html_writer::tag('div', format_string($choices->options[$optionid]->text), array('class'=>'option'));
+ $celltext = format_string($choices->options[$optionid]->text);
}
$numberofuser = 0;
if (!empty($options->user) && count($options->user) > 0) {
$numberofuser = count($options->user);
}
- $coldata .= html_writer::tag('div', ' ('.$numberofuser. ')', array('class'=>'numberofuser', 'title' => get_string('numberofuser', 'choice')));
- $columns[] = $coldata;
+ $celloption->text = $celltext;
+ $cellusernumber->text = $numberofuser;
+
+ $columns['options'][] = $celloption;
+ $columns['usernumber'][] = $cellusernumber;
}
- $table->head = $columns;
+ $table->head = $columns['options'];
+ $table->data[] = new html_table_row($columns['usernumber']);
- $coldata = '';
$columns = array();
+
+ // This extra cell is needed in order to support accessibility for screenreader. MDL-30816
+ $accessiblecell = new html_table_cell();
+ $accessiblecell->text = get_string('userchoosethisoption', 'choice');
+ $accessiblecell->header = true;
+ $accessiblecell->scope = 'row';
+ $accessiblecell->attributes['class'] = 'header data';
+ $columns[] = $accessiblecell;
+
foreach ($choices->options as $optionid => $options) {
- $coldata = '';
+ $cell = new html_table_cell();
+ $cell->attributes['class'] = 'data';
+
if ($choices->showunanswered || $optionid > 0) {
if (!empty($options->user)) {
foreach ($options->user as $user) {
@@ -188,19 +223,16 @@ public function display_publish_name_vertical($choices) {
$name = html_writer::tag('a', fullname($user, $choices->fullnamecapability), array('href'=>$userlink, 'class'=>'username'));
$data .= html_writer::tag('div', $name, array('class'=>'fullname'));
$data .= html_writer::tag('div','', array('class'=>'clearfloat'));
- $coldata .= html_writer::tag('div', $data, array('class'=>'user'));
+ $cell->text = html_writer::tag('div', $data, array('class'=>'user'));
}
}
}
-
- $columns[] = $coldata;
+ $columns[] = $cell;
$count++;
}
+ $row = new html_table_row($columns);
+ $table->data[] = $row;
- $table->data[] = $columns;
- foreach ($columns as $d) {
- $table->colclasses[] = 'data';
- }
$html .= html_writer::tag('div', html_writer::table($table), array('class'=>'response'));
$actiondata = '';
@@ -245,71 +277,88 @@ public function display_publish_anonymous_vertical($choices) {
$table->cellpadding = 5;
$table->cellspacing = 0;
$table->attributes['class'] = 'results anonymous ';
+ $table->summary = get_string('responsesto', 'choice', $choices->name);
$table->data = array();
+
$count = 0;
ksort($choices->options);
$columns = array();
$rows = array();
- foreach ($choices->options as $optionid => $options) {
- $numberofuser = 0;
- if (!empty($options->user)) {
- $numberofuser = count($options->user);
+ $headercelldefault = new html_table_cell();
+ $headercelldefault->scope = 'row';
+ $headercelldefault->header = true;
+ $headercelldefault->attributes = array('class'=>'header data');
+
+ // column header
+ $tableheader = clone($headercelldefault);
+ $tableheader->text = html_writer::tag('div', get_string('choiceoptions', 'choice'), array('class' => 'accesshide'));
+ $rows['header'][] = $tableheader;
+
+ // graph row header
+ $graphheader = clone($headercelldefault);
+ $graphheader->text = html_writer::tag('div', get_string('responsesresultgraphheader', 'choice'), array('class' => 'accesshide'));
+ $rows['graph'][] = $graphheader;
+
+ // user number row header
+ $usernumberheader = clone($headercelldefault);
+ $usernumberheader->text = get_string('numberofuser', 'choice');
+ $rows['usernumber'][] = $usernumberheader;
+
+ // user percentage row header
+ $userpercentageheader = clone($headercelldefault);
+ $userpercentageheader->text = get_string('numberofuserinpercentage', 'choice');
+ $rows['userpercentage'][] = $userpercentageheader;
+
+ $contentcelldefault = new html_table_cell();
+ $contentcelldefault->attributes = array('class'=>'data');
+
+ foreach ($choices->options as $optionid => $option) {
+ // calculate display length
+ $height = $percentageamount = $numberofuser = 0;
+ $usernumber = $userpercentage = '';
+
+ if (!empty($option->user)) {
+ $numberofuser = count($option->user);
}
- $height = 0;
- $percentageamount = 0;
+
if($choices->numberofuser > 0) {
$height = ($CHOICE_COLUMN_HEIGHT * ((float)$numberofuser / (float)$choices->numberofuser));
$percentageamount = ((float)$numberofuser/(float)$choices->numberofuser)*100.0;
}
- $displaydiagram = html_writer::tag('img','', array('style'=>'height:'.$height.'px;width:49px;', 'alt'=>'', 'src'=>$this->output->pix_url('column', 'choice')));
-
- $cell = new html_table_cell();
- $cell->text = $displaydiagram;
- $cell->attributes = array('class'=>'graph vertical data');
- $columns[] = $cell;
- }
- $rowgraph = new html_table_row();
- $rowgraph->cells = $columns;
- $rows[] = $rowgraph;
+ $displaygraph = html_writer::tag('img','', array('style'=>'height:'.$height.'px;width:49px;', 'alt'=>'', 'src'=>$this->output->pix_url('column', 'choice')));
- $columns = array();
- $printskiplink = true;
- foreach ($choices->options as $optionid => $options) {
- $columndata = '';
- $numberofuser = 0;
- if (!empty($options->user)) {
- $numberofuser = count($options->user);
- }
+ // header
+ $headercell = clone($contentcelldefault);
+ $headercell->text = $option->text;
+ $rows['header'][] = $headercell;
- if ($printskiplink) {
- $columndata .= html_writer::tag('div', '', array('class'=>'skip-block-to', 'id'=>'skipresultgraph'));
- $printskiplink = false;
- }
+ // Graph
+ $graphcell = clone($contentcelldefault);
+ $graphcell->attributes = array('class'=>'graph vertical data');
+ $graphcell->text = $displaygraph;
+ $rows['graph'][] = $graphcell;
- if ($choices->showunanswered && $optionid == 0) {
- $columndata .= html_writer::tag('div', format_string(get_string('notanswered', 'choice')), array('class'=>'option'));
- } else if ($optionid > 0) {
- $columndata .= html_writer::tag('div', format_string($choices->options[$optionid]->text), array('class'=>'option'));
- }
- $columndata .= html_writer::tag('div', ' ('.$numberofuser.')', array('class'=>'numberofuser', 'title'=> get_string('numberofuser', 'choice')));
+ $usernumber .= html_writer::tag('div', ' '.$numberofuser.'', array('class'=>'numberofuser', 'title'=> get_string('numberofuser', 'choice')));
+ $userpercentage .= html_writer::tag('div', format_float($percentageamount,1). '%', array('class'=>'percentage'));
- if($choices->numberofuser > 0) {
- $percentageamount = ((float)$numberofuser/(float)$choices->numberofuser)*100.0;
- }
- $columndata .= html_writer::tag('div', format_float($percentageamount,1). '%', array('class'=>'percentage'));
+ // number of user
+ $usernumbercell = clone($contentcelldefault);
+ $usernumbercell->text = $usernumber;
+ $rows['usernumber'][] = $usernumbercell;
- $cell = new html_table_cell();
- $cell->text = $columndata;
- $cell->attributes = array('class'=>'data header');
- $columns[] = $cell;
+ // percentage of user
+ $numbercell = clone($contentcelldefault);
+ $numbercell->text = $userpercentage;
+ $rows['userpercentage'][] = $numbercell;
}
- $rowdata = new html_table_row();
- $rowdata->cells = $columns;
- $rows[] = $rowdata;
- $table->data = $rows;
+ $table->head = $rows['header'];
+ $trgraph = new html_table_row($rows['graph']);
+ $trusernumber = new html_table_row($rows['usernumber']);
+ $truserpercentage = new html_table_row($rows['userpercentage']);
+ $table->data = array($trgraph, $trusernumber, $truserpercentage);
$header = html_writer::tag('h2',format_string(get_string("responses", "choice")));
$html .= html_writer::tag('div', $header, array('class'=>'responseheader'));
@@ -331,52 +380,76 @@ public function display_publish_anonymous_horizontal($choices) {
$table->cellpadding = 5;
$table->cellspacing = 0;
$table->attributes['class'] = 'results anonymous ';
+ $table->summary = get_string('responsesto', 'choice', $choices->name);
$table->data = array();
+ $columnheaderdefault = new html_table_cell();
+ $columnheaderdefault->scope = 'col';
+
+ $tableheadertext = clone($columnheaderdefault);
+ $tableheadertext->text = get_string('choiceoptions', 'choice');
+
+ $tableheadernumber = clone($columnheaderdefault);
+ $tableheadernumber->text = get_string('numberofuser', 'choice');
+
+ $tableheaderpercentage = clone($columnheaderdefault);
+ $tableheaderpercentage->text = get_string('numberofuserinpercentage', 'choice');
+
+ $tableheadergraph = clone($columnheaderdefault);
+ $tableheadergraph->text = get_string('responsesresultgraphheader', 'choice');
+
+ $table->head = array($tableheadertext, $tableheadernumber, $tableheaderpercentage, $tableheadergraph);
+
$count = 0;
ksort($choices->options);
+ $columndefault = new html_table_cell();
+ $columndefault->attributes['class'] = 'data';
+
+ $colheaderdefault = new html_table_cell();
+ $colheaderdefault->scope = 'row';
+ $colheaderdefault->header = true;
+ $colheaderdefault->attributes['class'] = 'header data';
+
$rows = array();
foreach ($choices->options as $optionid => $options) {
- $numberofuser = 0;
- $graphcell = new html_table_cell();
+ $colheader = clone($colheaderdefault);
+ $colheader->text = $options->text;
+
+ $graphcell = clone($columndefault);
+ $datacellnumber = clone($columndefault);
+ $datacellpercentage = clone($columndefault);
+
+ $numberofuser = $width = $percentageamount = 0;
+
if (!empty($options->user)) {
$numberofuser = count($options->user);
}
- $width = 0;
- $percentageamount = 0;
- $columndata = '';
if($choices->numberofuser > 0) {
$width = ($CHOICE_COLUMN_WIDTH * ((float)$numberofuser / (float)$choices->numberofuser));
$percentageamount = ((float)$numberofuser/(float)$choices->numberofuser)*100.0;
}
- $displaydiagram = html_writer::tag('img','', array('style'=>'height:50px; width:'.$width.'px', 'alt'=>'', 'src'=>$this->output->pix_url('row', 'choice')));
- $skiplink = html_writer::tag('a', get_string('skipresultgraph', 'choice'), array('href'=>'#skipresultgraph'. $optionid, 'class'=>'skip-block'));
- $skiphandler = html_writer::tag('span', '', array('class'=>'skip-block-to', 'id'=>'skipresultgraph'.$optionid));
+ $attributes = array();
+ $attributes['style'] = 'height:50px; width:'.$width.'px';
+ $attributes['alt'] = '';
+ $attributes['src'] = $this->output->pix_url('row', 'choice');
+ $displaydiagram = html_writer::tag('img','', $attributes);
- $graphcell->text = $skiplink . $displaydiagram . $skiphandler;
+ $graphcell->text = $displaydiagram;
$graphcell->attributes = array('class'=>'graph horizontal');
- $datacell = new html_table_cell();
- if ($choices->showunanswered && $optionid == 0) {
- $columndata .= html_writer::tag('div', format_string(get_string('notanswered', 'choice')), array('class'=>'option'));
- } else if ($optionid > 0) {
- $columndata .= html_writer::tag('div', format_string($choices->options[$optionid]->text), array('class'=>'option'));
- }
- $columndata .= html_writer::tag('div', ' ('.$numberofuser.')', array('title'=> get_string('numberofuser', 'choice'), 'class'=>'numberofuser'));
-
if($choices->numberofuser > 0) {
$percentageamount = ((float)$numberofuser/(float)$choices->numberofuser)*100.0;
}
- $columndata .= html_writer::tag('div', format_float($percentageamount,1). '%', array('class'=>'percentage'));
- $datacell->text = $columndata;
- $datacell->attributes = array('class'=>'header');
+ $datacellnumber->text = $numberofuser;
+ $datacellpercentage->text = format_float($percentageamount,1). '%';
+
$row = new html_table_row();
- $row->cells = array($datacell, $graphcell);
+ $row->cells = array($colheader, $datacellnumber, $datacellpercentage, $graphcell);
$rows[] = $row;
}
View
2 mod/choice/styles.css
@@ -23,6 +23,8 @@
.path-mod-choice .results.anonymous .graph.vertical,
.path-mod-choice .cell {vertical-align: bottom; text-align: center; }
+.path-mod-choice .results.anonymous th.header {border: 1px solid inherit;}
+
.path-mod-choice .results.names .header{width:10%; white-space: normal;}
.path-mod-choice .results.names .cell{vertical-align: top; text-align: left;}
.path-mod-choice .results.names .user,

0 comments on commit 0ed9c74

Please sign in to comment.