[LON-CAPA-cvs] cvs: loncom /interface groupsort.pm

[raeburn]

raeburn		Sat Dec 27 20:49:55 2025 EDT

  Modified files:              
    /loncom/interface	groupsort.pm 
  Log:
  - WCAG 2 compliance
    - Support "Skip to main content" when tabbing in page.
    - Include labels for form elements
    - Image icon column not shown to screen readers.
    - Eliminate a nested table used for layout. 
  
  
Index: loncom/interface/groupsort.pm
diff -u loncom/interface/groupsort.pm:1.78 loncom/interface/groupsort.pm:1.79
--- loncom/interface/groupsort.pm:1.78	Sat Dec 27 20:24:18 2025
+++ loncom/interface/groupsort.pm	Sat Dec 27 20:49:55 2025
@@ -2,7 +2,7 @@
 # The LON-CAPA group sort handler
 # Allows for sorting prior to import into RAT.
 #
-# $Id: groupsort.pm,v 1.78 2025/12/27 20:24:18 raeburn Exp $
+# $Id: groupsort.pm,v 1.79 2025/12/27 20:49:55 raeburn Exp $
 # 
 # Copyright Michigan State University Board of Trustees
 #
@@ -37,6 +37,7 @@
 use Apache::loncommon;
 use Apache::lonlocal;
 use Apache::lonnet;
+use HTML::Entities();
 use LONCAPA qw(:DEFAULT :match);
 
 my $iconpath; # variable to be accessible to multiple subroutines
@@ -397,13 +398,15 @@
 		'ip' => 'Import Checked',
 		'ca' => 'Cancel',
 		'co' => 'Change Order',
+                'ty' => 'Type',
 		'ti' => 'Title',
 		'pa' => 'Path',
                 'in' => 'Include'
 		);
 
 	$r->print(&Apache::loncommon::start_page($title, $js));
-	$r->print('<h1>'.&mt($title).'</h1>');
+        $r->print("\n".'<div class="LC_landmark" role="main" id="LC_main_content">'."\n");
+        $r->print('<h1 class="LC_heading_1">'.&mt($title).'</h1>');
 
 	$r->print(<<END);
 <form method='post' action='/adm/groupsort' name='groupsort'
@@ -454,7 +457,7 @@
             } else { 
                 $r->print('<th colspan="2">'.$lt{'co'}.'</th>'."\n"); 
             }
-            $r->print('<th colspan="2">'.$lt{'ti'}.'</th>'."\n");
+            $r->print('<th aria-hidden="true">'.$lt{'ty'}.'</th><th>'.$lt{'ti'}.'</th>'."\n");
             $r->print("<th>$lt{'pa'}</th>");
             $r->print(&Apache::loncommon::end_data_table_header_row()."\n");
         } else {
@@ -469,6 +472,7 @@
     } else {
 	$r->print(&Apache::loncommon::start_page(undef,$js,
 						 {'only_body' => 1}));
+        $r->print("\n".'<div class="LC_landmark" role="main" id="LC_main_content">'."\n");
 #       $r->print('<h1>'.&mt($title).'</h1>');
 	$r->print(<<END);
 <form method='post' action='/adm/groupsort' name='groupsort'
@@ -497,21 +501,21 @@
 			  $resource->{'id'}));
 	if (($clen > 1)  || ($env{'form.readfile'})) {
 	    $r->print("</td>");
-            unless (($env{'form.readfile'})) {
-		$r->print("<td>".
-			  &select_box($clen,$ctr,$disabled).
-			  "</td>");
-	    }
-	    $r->print("<td>");
-	    $r->print('<img src="'.$iconname.'" alt="" />');
-	    $r->print("</td><td>");
+            my $restitle;
             if (($env{'form.recover'}) &&
                 ($resource->{'url'} =~ m{/uploaded/$match_domain/$match_courseid/supplemental/})) {
-                my $title = &Apache::loncommon::parse_supplemental_title($resource->{'title'});
-                $r->print($title);
+                $restitle = &Apache::loncommon::parse_supplemental_title($resource->{'title'});
             } else {
-                $r->print($resource->{'title'});
+                $restitle = $resource->{'title'};
+            }
+            unless (($env{'form.readfile'})) {
+                $r->print('<td>'.
+                          &select_box($clen,$ctr,$disabled,$restitle).
+                          '</td>');
             }
+            $r->print('<td aria-hidden="true"><img src="'.$iconname.'" alt="" /></td>'.
+                      "\n".'<td>');
+            $r->print($restitle);
             $r->print($resource->{'notes'}."</td><td>\n");
 	    $r->print($resource->{'url'}."</td>"
                      .&Apache::loncommon::end_data_table_row()
@@ -533,7 +537,7 @@
 END
     }
 
-    $r->print(&Apache::loncommon::end_page());
+    $r->print('</div>'.&Apache::loncommon::end_page());
 
     return OK;
 }
@@ -557,25 +561,27 @@
     my $usel = $sel+1;
     $usel = 1 if $usel > $total;
     $dsel = $total if $dsel < 1;
-    my $string;
-    $string = (<<END);
-<table border='0' cellspacing='0' cellpadding='0'>
-<tr><td><a href='javascript:move($sel,$dsel)'>
-<img src="${iconpath}move_up.gif" alt='UP' border='0' /></a></td></tr>
-<tr><td><a href='javascript:move($sel,$usel)'>
-<img src="${iconpath}move_down.gif" alt='DOWN' border='0' /></a></td></tr>
-</table>
+    return (<<END);
+<a href='javascript:move($sel,$dsel)'>
+<img src="${iconpath}move_up.gif" alt='UP' border='0' /></a><br />
+<a href='javascript:move($sel,$usel)'>
+<img src="${iconpath}move_down.gif" alt='DOWN' border='0' /></a>
 END
-    return $string;
 }
 
 # ------------------------------------------ Select box (returns scalar string)
 sub select_box {
-    my ($total,$sel,$disabled) = @_;
-    my $string;
-    $string = '<select name="alt'.$sel.'"';
-    $string .= ' onchange="selectchange('."'$sel'".');"'.$disabled.'>';
-    $string .= '<option value="0">'.&mt('discard').'</option>';
+    my ($total,$sel,$disabled,$restitle) = @_;
+    my $labeltext;
+    if ($restitle eq '') {
+        $labeltext = &mt("Change order for untitled resource, currently item #[_2]",$sel);
+    } else {
+        $labeltext = &mt("Change order for '[_1]', currently item #[_2]",$restitle, $sel);
+    }
+    my $string = '<select name="alt'.$sel.'" '
+                .'onchange="selectchange('."'$sel'".');"'.$disabled.' aria-label="'
+                .&HTML::Entities::encode($labeltext,'<>&"').'">'
+                .'<option value="0">'.&mt('discard').'</option>';
     for my $cur (1..$total) {
 	$string .= '<option value="'.$cur.'"';
 	if ($cur == $sel) {