MediaWiki:Mobile.js: Difference between revisions

no edit summary
No edit summary
No edit summary
Line 38: Line 38:
                 });
                 });
                  
                  
                 // Add click handlers
                 // Use event delegation to ensure handlers persist after DOM changes
                 $headers.off('click.tablesort').on('click.tablesort', function() {
                 $table.off('click.tablesort', 'th').on('click.tablesort', 'th', function() {
                     var $header = $(this);
                     var $header = $(this);
                    var $currentTable = $header.closest('table');
                     var columnIndex = $header.index();
                     var columnIndex = $header.index();
                    var $rows = $table.find('tbody tr');
                      
                      
                     // If no tbody, get all rows except the header row
                     // Get all headers from the current table
                    var $allHeaders = $currentTable.find('th');
                   
                    // Get rows to sort
                    var $rows = $currentTable.find('tbody tr');
                     if ($rows.length === 0) {
                     if ($rows.length === 0) {
                         $rows = $table.find('tr:not(:first)');
                         $rows = $currentTable.find('tr:not(:first)');
                     }
                     }
                      
                      
Line 56: Line 60:
                     var isAscending = !$header.hasClass('sort-desc');
                     var isAscending = !$header.hasClass('sort-desc');
                      
                      
                     // Reset all headers
                     // Reset all headers in this table
                     $headers.removeClass('sort-asc sort-desc');
                     $allHeaders.removeClass('sort-asc sort-desc');
                     $headers.find('.sort-arrow').text('⇅').css('color', '#666');
                     $allHeaders.find('.sort-arrow').text('⇅').css('color', '#666');
                      
                      
                     // Mark current header
                     // Mark current header
Line 64: Line 68:
                     $header.find('.sort-arrow').text(isAscending ? '⇑' : '⇓').css('color', '#000');
                     $header.find('.sort-arrow').text(isAscending ? '⇑' : '⇓').css('color', '#000');
                      
                      
                     // Sort rows
                     // Sort rows array
                     var sortedRows = Array.from($rows).sort(function(a, b) {
                     var rowsArray = Array.from($rows);
                         var aText = $(a).find('td').eq(columnIndex).text().trim();
                    rowsArray.sort(function(a, b) {
                         var bText = $(b).find('td').eq(columnIndex).text().trim();
                         var $aCells = $(a).find('td');
                        var $bCells = $(b).find('td');
                       
                        if ($aCells.length <= columnIndex || $bCells.length <= columnIndex) {
                            return 0;
                        }
                       
                        var aText = $aCells.eq(columnIndex).text().trim();
                         var bText = $bCells.eq(columnIndex).text().trim();
                          
                          
                         // Try numeric comparison first
                         // Try numeric comparison first
Line 85: Line 97:
                     });
                     });
                      
                      
                     // Re-append sorted rows
                     // Re-append sorted rows while preserving structure
                     var $tbody = $table.find('tbody');
                     var $tbody = $currentTable.find('tbody');
                     if ($tbody.length > 0) {
                     if ($tbody.length > 0) {
                         $tbody.empty().append(sortedRows);
                         $tbody.empty();
                        $(rowsArray).each(function() {
                            $tbody.append(this);
                        });
                     } else {
                     } else {
                         // If no tbody, append after first row (header)
                         // Remove existing data rows but keep header
                         $table.find('tr:not(:first)').remove();
                         $currentTable.find('tr:not(:first)').remove();
                         $table.append(sortedRows);
                         // Append sorted rows
                        $(rowsArray).each(function() {
                            $currentTable.append(this);
                        });
                     }
                     }
                      
                      
                     console.log('Sorting completed');
                     console.log('Sorting completed - table should remain sortable');
                 });
                 });