Действия

MediaWiki

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

Материал из ВикиВоины

(Отмена правки 420473, сделанной Laurent Nautilus (обсуждение))
Метка: отмена
 
(не показана 41 промежуточная версия этого же участника)
Строка 1: Строка 1:
 
$(document).ready(function() {
 
$(document).ready(function() {
   var $activeContentItem = null; // Переменная для отслеживания предыдущего активного элемента списка содержания
+
function createContentsList($list, $parentItem) {
 +
   $list.children('li').each(function() {
 +
    var $listItem = $(this);
 +
    var classes = $listItem.attr('class').split(' ');
 +
    var tocLevel = classes.find(function(cls) {
 +
      return cls.startsWith('toclevel-');
 +
    });
  
  function createContentsList($list, $parentItem) {
+
    if (tocLevel) {
    $list.children('li').each(function() {
+
      var $sectionLink = $listItem.children('a').first();
       var $listItem = $(this);
+
      var sectionTitle = $sectionLink.find('.toctext').text().trim();
       var classes = $listItem.attr('class').split(' ');
+
       var listItem = $('<li></li>');
       var tocLevel = classes.find(function(cls) {
+
       var sectionLink = $('').text(sectionTitle);
        return cls.startsWith('toclevel-');
+
       sectionLink.attr('href', $sectionLink.attr('href'));
       });
+
       listItem.append(sectionLink);
  
       if (tocLevel) {
+
       var $subList = $listItem.children('ul').first();
        var $sectionLink = $listItem.children('a').first();
+
      if ($subList.length) {
        var sectionTitle = $sectionLink.find('.toctext').text().trim();
+
         var subLinkList = $('<ul class="side-nav"></ul>');
        var id = $sectionLink.attr('href'); // Получаем id из атрибута href ссылки
+
         listItem.append(subLinkList);
         var listItem = $('<li></li>');
+
         createContentsList($subList, subLinkList);
         var sectionLink = $('').text(sectionTitle);
+
      }
         sectionLink.attr('href', id); // Присваиваем href ссылки id заголовка
 
        listItem.append(sectionLink);
 
  
        var $subList = $listItem.children('ul').first();
+
      $parentItem.append(listItem);
        if ($subList.length) {
+
    }
          var subLinkList = $('<ul class="side-nav"></ul>');
+
  });
          listItem.append(subLinkList);
+
}
          createContentsList($subList, subLinkList);
 
        }
 
 
 
        $parentItem.append(listItem);
 
      }
 
    });
 
  }
 
  
 
   if ($(window).width() < 640) {
 
   if ($(window).width() < 640) {
Строка 49: Строка 46:
 
     contents.append(closeButton);
 
     contents.append(closeButton);
  
     var isContentsOpen = false;
+
     var isContentsOpen = false;  
  
 
     $('.content-button').on('click touchstart', function(e) {
 
     $('.content-button').on('click touchstart', function(e) {
Строка 71: Строка 68:
 
       var contents = $('<div class="contents side-nav"></div>');
 
       var contents = $('<div class="contents side-nav"></div>');
 
       var isFixed = false;
 
       var isFixed = false;
       var activeSection = null;
+
       var activeSection = null;  
  
 
       var linkList = $('<ul class="side-nav"></ul>');
 
       var linkList = $('<ul class="side-nav"></ul>');
Строка 94: Строка 91:
 
         var scrollTop = $(window).scrollTop();
 
         var scrollTop = $(window).scrollTop();
  
        // При прокрутке страницы проверяем каждый заголовок на то, находится ли он в области видимости
 
        $('h1, h2, h3, h4, h5, h6').each(function() {
 
          var $heading = $(this);
 
          var headingTop = $heading.offset().top;
 
          if (headingTop <= scrollTop + 100) { // 100 - отступ от верха экрана
 
            var id = $heading.attr('id');
 
            if (id) {
 
              var $contentItem = $('.side-nav a[href="#' + id + '"]').parent(); // Находим элемент списка содержания, соответствующий текущему заголовку
 
              if ($contentItem.length) {
 
                // Удаляем класс active у предыдущего активного элемента
 
                if ($activeContentItem) {
 
                  $activeContentItem.removeClass('active');
 
                }
 
                // Добавляем класс active текущему элементу списка содержания
 
                $contentItem.addClass('active');
 
                // Обновляем переменную $activeContentItem для следующей итерации
 
                $activeContentItem = $contentItem;
 
              }
 
            }
 
          }
 
        });
 
 
        // Проверяем, нужно ли зафиксировать боковое меню
 
 
         if (scrollTop > sidebarTop && scrollTop > contentsTop && !isFixed) {
 
         if (scrollTop > sidebarTop && scrollTop > contentsTop && !isFixed) {
           contents.addClass('fixed');
+
           contents.addClass('fixed');  
 
           isFixed = true;
 
           isFixed = true;
 
         } else if ((scrollTop <= sidebarTop || scrollTop <= contentsTop) && isFixed) {
 
         } else if ((scrollTop <= sidebarTop || scrollTop <= contentsTop) && isFixed) {
           contents.removeClass('fixed');
+
           contents.removeClass('fixed');  
 
           isFixed = false;
 
           isFixed = false;
 
         }
 
         }
Строка 127: Строка 101:
 
     }
 
     }
 
   }
 
   }
 +
  $(window).scroll(function() {
 +
    var currentPosition = $(this).scrollTop();
 +
 +
    $('h2, h3, h4').each(function() {
 +
        var sectionTop = $(this).offset().top;
 +
        var sectionId = $(this).find('.mw-headline').attr('id');
 +
 +
        if (currentPosition >= sectionTop) {
 +
            $('.side-nav li').removeClass('active');
 +
 +
            $('.side-nav li').find('a[href="#' + sectionId + '"]').parent().addClass('active');
 +
        }
 +
    });
 +
});
 +
        var paths = document.querySelectorAll('path');
 +
        var lis = document.querySelectorAll('.countries li');
 +
 +
        paths.forEach(function(path) {
 +
        path.addEventListener('click', function() {
 +
        var title = this.getAttribute('title');
 +
        var matchingLi = document.querySelector('.countries li[title="' + title + '"]');
 +
        if (matchingLi) {
 +
            if (this.classList.contains('selected-patch-country')) {
 +
                this.classList.remove('selected-patch-country');
 +
            } else {
 +
                document.querySelectorAll('.selected-patch-country').forEach(function(selectedPath) {
 +
                    selectedPath.classList.remove('selected-patch-country');
 +
                });
 +
                this.classList.add('selected-patch-country');
 +
            }
 +
 +
            var matchingActiveLi = document.querySelector('.countries li.active-country-list');
 +
            if (matchingActiveLi && matchingActiveLi !== matchingLi) {
 +
                matchingActiveLi.classList.remove('active-country-list');
 +
            }
 +
            matchingLi.classList.toggle('active-country-list');
 +
            matchingLi.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
 +
        }
 +
    });
 +
});
 +
    lis.forEach(function(li) {
 +
    li.addEventListener('click', function() {
 +
        var title = this.getAttribute('title');
 +
        var matchingPath = document.querySelector('path[title="' + title + '"]');
 +
        if (matchingPath) {
 +
            if (matchingPath.classList.contains('selected-patch-country')) {
 +
                matchingPath.classList.remove('selected-patch-country');
 +
            } else {
 +
                document.querySelectorAll('.countries .selected-patch-country').forEach(function(path) {
 +
                    path.classList.remove('selected-patch-country');
 +
                });
 +
                matchingPath.classList.add('selected-patch-country');
 +
            }
 +
        }
 +
        var matchingLi = document.querySelector('.countries li.active-country-list');
 +
        if (matchingLi && matchingLi.title !== title) {
 +
            matchingLi.classList.remove('active-country-list');
 +
        }
 +
        this.classList.toggle('active-country-list');
 +
        this.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
 +
    });
 +
});
 +
 +
setTimeout(function() {
 +
        $('.button-comment').css('display', 'block');
 +
    }, 1000);
 +
       
 +
 
 
});
 
});

Текущая версия на 18:04, 26 мая 2024

$(document).ready(function() {
function createContentsList($list, $parentItem) {
  $list.children('li').each(function() {
    var $listItem = $(this);
    var classes = $listItem.attr('class').split(' ');
    var tocLevel = classes.find(function(cls) {
      return cls.startsWith('toclevel-');
    });

    if (tocLevel) {
      var $sectionLink = $listItem.children('a').first();
      var sectionTitle = $sectionLink.find('.toctext').text().trim();
      var listItem = $('<li></li>');
      var sectionLink = $('').text(sectionTitle);
      sectionLink.attr('href', $sectionLink.attr('href'));
      listItem.append(sectionLink);

      var $subList = $listItem.children('ul').first();
      if ($subList.length) {
        var subLinkList = $('<ul class="side-nav"></ul>');
        listItem.append(subLinkList);
        createContentsList($subList, subLinkList);
      }

      $parentItem.append(listItem);
    }
  });
}

  if ($(window).width() < 640) {
    var contents = $('<div class="contents-overlay"></div>').hide();
    var sideNav = $('<ul class="side-nav"></ul>');
    var contentsItemWrap = $('<div class="contents-item-wrap"></div>');
    var contentsItemWrapFirst = $('<li></li>');
    var label = $('<label class="sidebar" id="p-tb">Содержание</label>');

    label.appendTo(contentsItemWrapFirst);
    contentsItemWrapFirst.appendTo(sideNav);
    sideNav.appendTo(contents);
    contentsItemWrap.appendTo(sideNav);
    contents.appendTo('.inner-wrap');

    createContentsList($('#toc > ul'), contentsItemWrap);

    var closeButton = $('<button class="close-button"><i class="fa fa-times"></i></button>');
    contents.append(closeButton);

    var isContentsOpen = false; 

    $('.content-button').on('click touchstart', function(e) {
      e.preventDefault();
      contents.toggle();
      updateIconColor();
    });

    $('.close-button').on('click touchstart', function(e) {
      e.preventDefault();
      contents.hide();
      updateIconColor();
    });

    function updateIconColor() {
      var isVisible = contents.is(':visible');
      $('.fa-list-ul').css('color', isVisible ? '#511414' : '');
    }
  } else {
    if ($('#toc').length) {
      var contents = $('<div class="contents side-nav"></div>');
      var isFixed = false;
      var activeSection = null; 

      var linkList = $('<ul class="side-nav"></ul>');
      contents.append(linkList);

      var contentLabel = $('<label class="sidebar" id="p-tb">Содержание</label>');
      var contentListItem = $('<li></li>');
      contentListItem.append(contentLabel);
      linkList.append(contentListItem);

      createContentsList($('#toc > ul'), linkList);

      if (linkList.children().length > 1) {
        $('#sidebar:last').append(contents);
      }

      var sidebarTop = $('.sidebar:last').offset().top;
      var contentsTop = contents.offset().top;
      var windowHeight = $(window).height();

      $(window).scroll(function() {
        var scrollTop = $(window).scrollTop();

        if (scrollTop > sidebarTop && scrollTop > contentsTop && !isFixed) {
          contents.addClass('fixed'); 
          isFixed = true;
        } else if ((scrollTop <= sidebarTop || scrollTop <= contentsTop) && isFixed) {
          contents.removeClass('fixed'); 
          isFixed = false;
        }
      });
    }
  }
  $(window).scroll(function() {
    var currentPosition = $(this).scrollTop();

    $('h2, h3, h4').each(function() {
        var sectionTop = $(this).offset().top;
        var sectionId = $(this).find('.mw-headline').attr('id');

        if (currentPosition >= sectionTop) {
            $('.side-nav li').removeClass('active');

            $('.side-nav li').find('a[href="#' + sectionId + '"]').parent().addClass('active');
        }
    });
});
        var paths = document.querySelectorAll('path');
        var lis = document.querySelectorAll('.countries li');

        paths.forEach(function(path) {
        path.addEventListener('click', function() {
        var title = this.getAttribute('title');
        var matchingLi = document.querySelector('.countries li[title="' + title + '"]');
        if (matchingLi) {
            if (this.classList.contains('selected-patch-country')) {
                this.classList.remove('selected-patch-country');
            } else {
                document.querySelectorAll('.selected-patch-country').forEach(function(selectedPath) {
                    selectedPath.classList.remove('selected-patch-country');
                });
                this.classList.add('selected-patch-country');
            }

            var matchingActiveLi = document.querySelector('.countries li.active-country-list');
            if (matchingActiveLi && matchingActiveLi !== matchingLi) {
                matchingActiveLi.classList.remove('active-country-list');
            }
            matchingLi.classList.toggle('active-country-list');
            matchingLi.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
        }
    });
});
    lis.forEach(function(li) {
    li.addEventListener('click', function() {
        var title = this.getAttribute('title');
        var matchingPath = document.querySelector('path[title="' + title + '"]');
        if (matchingPath) {
            if (matchingPath.classList.contains('selected-patch-country')) {
                matchingPath.classList.remove('selected-patch-country');
            } else {
                document.querySelectorAll('.countries .selected-patch-country').forEach(function(path) {
                    path.classList.remove('selected-patch-country');
                });
                matchingPath.classList.add('selected-patch-country');
            }
        }
        var matchingLi = document.querySelector('.countries li.active-country-list');
        if (matchingLi && matchingLi.title !== title) {
            matchingLi.classList.remove('active-country-list');
        }
        this.classList.toggle('active-country-list');
        this.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
    });
});

setTimeout(function() {
        $('.button-comment').css('display', 'block');
    }, 1000);
        
  
});