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

Нет описания правки
Нет описания правки
Строка 1: Строка 1:
// Ассинхронная загрузка страницы. Убирает всякие мерцания, показывая сразу готовую страницу. Костыль? Да. Работает? Ну вроде Clueless
// Ассинхронная загрузка страницы. Убирает всякие мерцания, показывая сразу готовую страницу. Костыль? Да. Работает? Ну вроде Clueless
function loadPage(url) {
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function() {
      if (xhr.readyState === XMLHttpRequest.DONE) {
          if (xhr.status === 200) {
              document.body.innerHTML = xhr.responseText;
              window.history.pushState({}, '', url);
             
              createThemeToggleButton();
          }
      }
  };
  xhr.open('GET', url, true);
  xhr.send();
}
document.addEventListener('click', function(event) {
document.addEventListener('click', function(event) {
    var link = event.target.closest('a');
  var link = event.target.closest('a');
    if (link && link.href && link.href.indexOf(window.location.origin) !== -1) {
  if (link && link.href && link.href.indexOf(window.location.origin) !== -1) {
        event.preventDefault();
      event.preventDefault();
 
      loadPage(link.href);
        var xhr = new XMLHttpRequest();
  }
        xhr.onreadystatechange = function() {
            if (xhr.readyState === XMLHttpRequest.DONE) {
                if (xhr.status === 200) {
                    document.body.innerHTML = xhr.responseText;
                    window.history.pushState({}, '', link.href);
 
                    createThemeToggleButton();
                }
            }
        };
        xhr.open('GET', link.href, true);
        xhr.send();
    }
});
});


// Заставляем вперёд/назад работать.
// Заставляем вперёд/назад работать.
window.addEventListener('popstate', function(event) {
window.addEventListener('popstate', function(event) {
    var xhr = new XMLHttpRequest();
  loadPage(window.location.href);
    xhr.onreadystatechange = function() {
        if (xhr.readyState === XMLHttpRequest.DONE) {
            if (xhr.status === 200) {
                document.body.innerHTML = xhr.responseText;
            }
        }
    };
    xhr.open('GET', window.location.href, true);
    xhr.send();
});
});


// Кнопочка для переключения темы на светлую и обратно.
// Кнопочка для переключения темы на светлую и обратно.
$(document).ready(function() {
function createThemeToggleButton() {
    var container = document.getElementById("p-personal");
  var container = document.getElementById("p-personal");
    if (container) {
  if (container) {
        var checkbox = document.createElement("input");
      var checkbox = document.createElement("input");
        checkbox.type = "checkbox";
      checkbox.type = "checkbox";
        checkbox.id = "theme-toggle";
      checkbox.id = "theme-toggle";
       
 
        var label = document.createElement("label");
      var label = document.createElement("label");
        label.htmlFor = "theme-toggle";
      label.htmlFor = "theme-toggle";
        label.id = "theme-button";
      label.id = "theme-button";
       
 
        container.parentNode.insertBefore(checkbox, container);
      container.parentNode.insertBefore(checkbox, container);
        container.parentNode.insertBefore(label, container);
      container.parentNode.insertBefore(label, container);
    }
  }


    var isLightTheme = localStorage.getItem("isLightTheme");
  var isLightTheme = localStorage.getItem("isLightTheme");
    if (isLightTheme === "true") {
  if (isLightTheme === "true") {
        document.documentElement.classList.add('light');
      document.documentElement.classList.add('light');
    } else {
  } else {
        document.documentElement.classList.remove('light');
      document.documentElement.classList.remove('light');
    }
  }
   
 
    $("#theme-toggle").change(function() {
  $("#theme-toggle").change(function() {
        toggleTheme();
      toggleTheme();
    });
  });
});
}


function toggleTheme() {
function toggleTheme() {
    var isLightTheme = document.documentElement.classList.toggle('light');
  var isLightTheme = document.documentElement.classList.toggle('light');
    localStorage.setItem("isLightTheme", isLightTheme);
  localStorage.setItem("isLightTheme", isLightTheme);
}
}
createThemeToggleButton();

Версия от 21:05, 4 мая 2024

// Ассинхронная загрузка страницы. Убирает всякие мерцания, показывая сразу готовую страницу. Костыль? Да. Работает? Ну вроде Clueless
function loadPage(url) {
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function() {
      if (xhr.readyState === XMLHttpRequest.DONE) {
          if (xhr.status === 200) {
              document.body.innerHTML = xhr.responseText;
              window.history.pushState({}, '', url);
              
              createThemeToggleButton();
          }
      }
  };
  xhr.open('GET', url, true);
  xhr.send();
}

document.addEventListener('click', function(event) {
  var link = event.target.closest('a');
  if (link && link.href && link.href.indexOf(window.location.origin) !== -1) {
      event.preventDefault();
      loadPage(link.href);
  }
});

// Заставляем вперёд/назад работать.
window.addEventListener('popstate', function(event) {
  loadPage(window.location.href);
});

// Кнопочка для переключения темы на светлую и обратно.
function createThemeToggleButton() {
  var container = document.getElementById("p-personal");
  if (container) {
      var checkbox = document.createElement("input");
      checkbox.type = "checkbox";
      checkbox.id = "theme-toggle";

      var label = document.createElement("label");
      label.htmlFor = "theme-toggle";
      label.id = "theme-button";

      container.parentNode.insertBefore(checkbox, container);
      container.parentNode.insertBefore(label, container);
  }

  var isLightTheme = localStorage.getItem("isLightTheme");
  if (isLightTheme === "true") {
      document.documentElement.classList.add('light');
  } else {
      document.documentElement.classList.remove('light');
  }

  $("#theme-toggle").change(function() {
      toggleTheme();
  });
}

function toggleTheme() {
  var isLightTheme = document.documentElement.classList.toggle('light');
  localStorage.setItem("isLightTheme", isLightTheme);
}

createThemeToggleButton();