diff --git a/mod/assign/module.js b/mod/assign/module.js index f0ee769b8b2..a44f7d00dd3 100644 --- a/mod/assign/module.js +++ b/mod/assign/module.js @@ -168,10 +168,12 @@ M.mod_assign.init_plugin_summary = function(Y, subtype, type, submissionid) { contract = Y.one('.' + classname); if (contract) { contract.on('click', function(e) { - img = e.target; - imgclasses = img.getAttribute('class').split(' '); - for (i = 0; i < imgclasses.length; i++) { - classname = imgclasses[i]; + e.preventDefault(); + link = e.target; + linkclasses = link.getAttribute('class').split(' '); + thissuffix = ''; + for (i = 0; i < linkclasses.length; i++) { + classname = linkclasses[i]; if (classname.indexOf('contract_') == 0) { thissuffix = classname.substr(9); } @@ -185,6 +187,7 @@ M.mod_assign.init_plugin_summary = function(Y, subtype, type, submissionid) { summary = Y.one('.' + summaryclassname); if (summary) { summary.show(false); + summary.one('a.expand_' + thissuffix).focus(); } }); } @@ -198,10 +201,12 @@ M.mod_assign.init_plugin_summary = function(Y, subtype, type, submissionid) { } if (expand) { expand.on('click', function(e) { - img = e.target; - imgclasses = img.getAttribute('class').split(' '); - for (i = 0; i < imgclasses.length; i++) { - classname = imgclasses[i]; + e.preventDefault(); + link = e.target; + linkclasses = link.getAttribute('class').split(' '); + thissuffix = ''; + for (i = 0; i < linkclasses.length; i++) { + classname = linkclasses[i]; if (classname.indexOf('expand_') == 0) { thissuffix = classname.substr(7); } @@ -215,6 +220,7 @@ M.mod_assign.init_plugin_summary = function(Y, subtype, type, submissionid) { full = Y.one('.' + fullclassname); if (full) { full.show(false); + full.one('a.contract_' + thissuffix).focus(); } }); } diff --git a/mod/assign/renderer.php b/mod/assign/renderer.php index 32de4ef12b0..01e98c56b10 100644 --- a/mod/assign/renderer.php +++ b/mod/assign/renderer.php @@ -1182,8 +1182,14 @@ class mod_assign_renderer extends plugin_renderer_base { $icon = $this->output->pix_icon('t/preview', $previewstr); $expandstr = get_string('viewfull', 'assign'); - $options = array('class'=>'expandsummaryicon expand_' . $classsuffix); - $o .= $this->output->pix_icon('t/switch_plus', $expandstr, null, $options); + $expandicon = $this->output->pix_icon('t/switch_plus', $expandstr); + $options = array( + 'class' => 'expandsummaryicon expand_' . $classsuffix, + 'aria-label' => $expandstr, + 'role' => 'button', + 'aria-expanded' => 'false' + ); + $o .= html_writer::link('', $expandicon, $options); $jsparams = array($submissionplugin->plugin->get_subtype(), $submissionplugin->plugin->get_type(), @@ -1211,11 +1217,16 @@ class mod_assign_renderer extends plugin_renderer_base { $o .= $this->output->box_end(); if ($showviewlink) { $o .= $this->output->box_start('boxaligncenter hidefull full_' . $classsuffix); - $classes = 'expandsummaryicon contract_' . $classsuffix; - $o .= $this->output->pix_icon('t/switch_minus', - get_string('viewsummary', 'assign'), - null, - array('class'=>$classes)); + $collapsestr = get_string('viewsummary', 'assign'); + $options = array( + 'class' => 'expandsummaryicon contract_' . $classsuffix, + 'aria-label' => $collapsestr, + 'role' => 'button', + 'aria-expanded' => 'true' + ); + $collapseicon = $this->output->pix_icon('t/switch_minus', $collapsestr); + $o .= html_writer::link('', $collapseicon, $options); + $o .= $submissionplugin->plugin->view($submissionplugin->submission); $o .= $this->output->box_end(); } @@ -1288,8 +1299,14 @@ class mod_assign_renderer extends plugin_renderer_base { $icon = $this->output->pix_icon('t/preview', $previewstr); $expandstr = get_string('viewfull', 'assign'); - $options = array('class'=>'expandsummaryicon expand_' . $classsuffix); - $o .= $this->output->pix_icon('t/switch_plus', $expandstr, null, $options); + $expandicon = $this->output->pix_icon('t/switch_plus', $expandstr); + $options = array( + 'class' => 'expandsummaryicon expand_' . $classsuffix, + 'aria-label' => $expandstr, + 'role' => 'button', + 'aria-expanded' => 'false' + ); + $o .= html_writer::link('', $expandicon, $options); $jsparams = array($feedbackplugin->plugin->get_subtype(), $feedbackplugin->plugin->get_type(), @@ -1314,11 +1331,16 @@ class mod_assign_renderer extends plugin_renderer_base { $o .= $this->output->box_end(); if ($showviewlink) { $o .= $this->output->box_start('boxaligncenter hidefull full_' . $classsuffix); - $classes = 'expandsummaryicon contract_' . $classsuffix; - $o .= $this->output->pix_icon('t/switch_minus', - get_string('viewsummary', 'assign'), - null, - array('class'=>$classes)); + $collapsestr = get_string('viewsummary', 'assign'); + $options = array( + 'class' => 'expandsummaryicon contract_' . $classsuffix, + 'aria-label' => $collapsestr, + 'role' => 'button', + 'aria-expanded' => 'true' + ); + $collapseicon = $this->output->pix_icon('t/switch_minus', $collapsestr); + $o .= html_writer::link('', $collapseicon, $options); + $o .= $feedbackplugin->plugin->view($feedbackplugin->grade); $o .= $this->output->box_end(); } diff --git a/mod/assign/styles.css b/mod/assign/styles.css index 0c5d724ba54..2bd3410acfc 100644 --- a/mod/assign/styles.css +++ b/mod/assign/styles.css @@ -187,10 +187,13 @@ } .path-mod-assign .expandsummaryicon { - cursor: pointer; display: none; } +.path-mod-assign .expandsummaryicon i { + pointer-events: none; +} + .path-mod-assign.jsenabled .expandsummaryicon { display: inline; }