MediaWiki:Common.js: различия между версиями

Отмена правки 52022, сделанной Pok (обсуждение)
Метка: отмена
мНет описания правки
Строка 339: Строка 339:
// Функция для подсветки ячеек в таблице при наведении
// Функция для подсветки ячеек в таблице при наведении
function applyHighlighting() {
function applyHighlighting() {
     // Проверка, является ли устройство мобильным, если да — функция не выполняется
     // Игнорируем обработку для мобильных устройств
     if (/Mobi|Android/i.test(navigator.userAgent)) {
     if (/Mobi|Android/i.test(navigator.userAgent)) {
         return;
         return;
     }
     }


     // Находим все таблицы с классом 'wikitable', кроме тех, что имеют класс 'no-highlight-table'
     // Находим все таблицы с классом .wikitable, кроме тех, у которых есть класс .no-highlight-table
     var tables = document.querySelectorAll('.wikitable:not(.no-highlight-table)');
     var tables = document.querySelectorAll('.wikitable:not(.no-highlight-table)');


    // Проходим по каждой таблице
     Array.prototype.forEach.call(tables, function(table) {
     Array.prototype.forEach.call(tables, function(table) {
         var tbody = table.querySelector('tbody');
         var tbody = table.querySelector('tbody');
Строка 353: Строка 352:
         var noHeader = table.classList.contains('no-header-table');
         var noHeader = table.classList.contains('no-header-table');


        // Проверяем, что тело таблицы существует
         if (tbody) {
         if (tbody) {
             // Получаем все строки <tr> внутри tbody, исключая строки, содержащие вложенные таблицы
             // Получаем все строки <tr> внутри <tbody>, игнорируя вложенные таблицы
             var rows = Array.prototype.slice.call(tbody.querySelectorAll('tr')).filter(function(row) {
             var rows = Array.prototype.slice.call(tbody.querySelectorAll('tr')).filter(function(row) {
                 return !row.querySelector('table');
                 return !row.querySelector('table');
             });
             });


             // Пропускаем первую строку, если нет thead и нет класса 'no-header'
             // Если нет <thead> и таблица не содержит класса .no-header, пропускаем первую строку
             var topLevelRows = (!thead && !noHeader) ? rows.slice(1) : rows;
             var topLevelRows = (!thead && !noHeader) ? rows.slice(1) : rows;


             var hasInvalidRowspan = false;
             var hasInvalidRowspan = false; // Проверка наличия некорректного rowspan
             var hasTooManyRowspan = false;
             var hasTooManyRowspan = false; // Проверка наличия слишком большого количества rowspan


// Проходим по строкам первого уровня
            // Проверяем на наличие некорректных rowspan в таблице
             topLevelRows.forEach(function(row) {
             topLevelRows.forEach(function(row) {
                // Получаем все ячейки строки, исключая те, что имеют класс 'mobile'
                 var cells = Array.prototype.slice.call(row.querySelectorAll('td, th')).filter(function(cell) {
                 var cells = Array.prototype.slice.call(row.querySelectorAll('td, th')).filter(function(cell) {
                return !cell.classList.contains('mobile');
                    return !cell.classList.contains('mobile'); // Игнорируем ячейки с классом .mobile
                 });
                 });
                 var cellCount = cells.length;
                 var cellCount = cells.length;
                // Проверяем, есть ли больше двух ячеек с атрибутом rowspan
                 var rowspanCount = cells.filter(function(cell) {
                 var rowspanCount = cells.filter(function(cell) {
                     return cell.hasAttribute('rowspan') && cell.getAttribute('rowspan') !== '1';
                     return cell.hasAttribute('rowspan') && cell.getAttribute('rowspan') !== '1';
                 }).length;
                 }).length;


                 // Если в строке больше двух ячеек с rowspan, функция не применяется
                 // Слишком много rowspan в одной строке
                 if (rowspanCount > 2) {
                 if (rowspanCount > 2) {
                     hasTooManyRowspan = true;
                     hasTooManyRowspan = true;
Строка 385: Строка 380:
                 }
                 }


                 // Если строка имеет 3 или меньше ячеек и больше одного rowspan, не применяем функцию
                 // Слишком много rowspan в строке с небольшим количеством ячеек
                 if (cellCount <= 3 && rowspanCount > 1) {
                 if (cellCount <= 3 && rowspanCount > 1) {
                     hasTooManyRowspan = true;
                     hasTooManyRowspan = true;
Строка 391: Строка 386:
                 }
                 }


                 // Проверяем, есть ли корректные ячейки с rowspan на краю строки (первый или последний элемент)
                 // Проверка на наличие rowspan на краях строки
                 var hasValidRowspanEdge = cells.some(function(cell, index) {
                 var hasValidRowspanEdge = cells.some(function(cell, index) {
                     return cell.hasAttribute('rowspan') && cell.getAttribute('rowspan') !== '1' && (index === 0 || index === cells.length - 1);
                     return cell.hasAttribute('rowspan') && cell.getAttribute('rowspan') !== '1' && (index === 0 || index === cells.length - 1);
                 });
                 });


                 // Если ячейки с rowspan находятся не на краю, устанавливаем флаг ошибки
                 // Некорректное использование rowspan в середине строки
                 if (!hasValidRowspanEdge && cells.some(function(cell, index) {
                 if (!hasValidRowspanEdge && cells.some(function(cell, index) {
                     return cell.hasAttribute('rowspan') && cell.getAttribute('rowspan') !== '1' && index > 0 && index < cells.length - 1;
                     return cell.hasAttribute('rowspan') && cell.getAttribute('rowspan') !== '1' && index > 0 && index < cells.length - 1;
Строка 404: Строка 399:
             });
             });


             // Если есть некорректные строки с rowspan или слишком много rowspan, выходим
             // Прерываем выполнение, если найдены некорректные rowspan
             if (hasTooManyRowspan || hasInvalidRowspan) return;
             if (hasTooManyRowspan || hasInvalidRowspan) return;


             // Проходим по каждой строке для добавления событий подсветки
             // Обрабатываем каждую строку таблицы
             topLevelRows.forEach(function(row) {
             topLevelRows.forEach(function(row) {
                 var cells = Array.prototype.slice.call(row.querySelectorAll('td, th'));
                 var cells = Array.prototype.slice.call(row.querySelectorAll('td, th'));
                 var originalStyles = cells.map(function(cell) {
                 var originalStyles = cells.map(function(cell) {
                    // Сохраняем оригинальные стили каждой ячейки
                     return {
                     return {
                         backgroundColor: getComputedStyle(cell).backgroundColor,
                         backgroundColor: getComputedStyle(cell).backgroundColor,
Строка 418: Строка 412:
                 });
                 });


                 // Добавляем события 'mouseover' и 'mouseout' для подсветки
                 // Добавляем обработчики для каждой ячейки
                 cells.forEach(function(cell, index) {
                 cells.forEach(function(cell, index) {
                     if (cell.hasAttribute('rowspan') && cell.getAttribute('rowspan') !== '1') return;
                     var rowspan = parseInt(cell.getAttribute('rowspan'), 10) || 1;


                     // Добавляем обработчик события при наведении мыши
                     // Обработчик при наведении на ячейку
                     cell.addEventListener('mouseover', function() {
                     cell.addEventListener('mouseover', function() {
                        // Если ячейка имеет атрибут `rowspan`, подсвечиваем все строки, которые она охватывает
                        if (rowspan > 1) {
                            for (var i = 0; i < rowspan; i++) {
                                var targetRow = topLevelRows[topLevelRows.indexOf(row) + i];
                                if (targetRow) {
                                    var targetCells = targetRow.querySelectorAll('td, th');
                                    Array.prototype.forEach.call(targetCells, function(innerCell) {
                                        innerCell.style.backgroundColor = brightenColor(getComputedStyle(innerCell).backgroundColor);
                                        innerCell.style.color = brightenColor(getComputedStyle(innerCell).color);
                                    });
                                }
                            }
                        }
                        // Подсвечиваем ячейки в текущем ряду
                         cells.forEach(function(innerCell, innerIndex) {
                         cells.forEach(function(innerCell, innerIndex) {
                             if (!innerCell.hasAttribute('rowspan') || innerCell.getAttribute('rowspan') === '1') {
                             innerCell.style.backgroundColor = brightenColor(originalStyles[innerIndex].backgroundColor);
                                // Увеличиваем яркость фона и текста ячейки при наведении
                            innerCell.style.color = brightenColor(originalStyles[innerIndex].color);
                                innerCell.style.backgroundColor = brightenColor(originalStyles[innerIndex].backgroundColor);
                                innerCell.style.color = brightenColor(originalStyles[innerIndex].color);
                            }
                         });
                         });
                     });
                     });


                     // Добавляем обработчик события, когда мышь уходит с ячейки
                     // Обработчик при убирании курсора с ячейки
                     cell.addEventListener('mouseout', function() {
                     cell.addEventListener('mouseout', function() {
                        // Восстанавливаем стили для всех строк, затронутых `rowspan`
                        if (rowspan > 1) {
                            for (var i = 0; i < rowspan; i++) {
                                var targetRow = topLevelRows[topLevelRows.indexOf(row) + i];
                                if (targetRow) {
                                    var targetCells = targetRow.querySelectorAll('td, th');
                                    Array.prototype.forEach.call(targetCells, function(innerCell) {
                                        innerCell.style.backgroundColor = getComputedStyle(innerCell).backgroundColor;
                                        innerCell.style.color = getComputedStyle(innerCell).color;
                                    });
                                }
                            }
                        }
                        // Восстанавливаем стили в текущем ряду
                         cells.forEach(function(innerCell, innerIndex) {
                         cells.forEach(function(innerCell, innerIndex) {
                             if (!innerCell.hasAttribute('rowspan') || innerCell.getAttribute('rowspan') === '1') {
                             innerCell.style.backgroundColor = originalStyles[innerIndex].backgroundColor;
                                // Восстанавливаем оригинальные стили после наведения
                            innerCell.style.color = originalStyles[innerIndex].color;
                                innerCell.style.backgroundColor = originalStyles[innerIndex].backgroundColor;
                                innerCell.style.color = originalStyles[innerIndex].color;
                            }
                         });
                         });
                     });
                     });