GitHub Toggle Wiki Sidebar

A userscript that adds a button to toggle the GitHub Wiki sidebar

当前为 2016-05-17 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name GitHub Toggle Wiki Sidebar
  3. // @version 1.0.1
  4. // @description A userscript that adds a button to toggle the GitHub Wiki sidebar
  5. // @license https://creativecommons.org/licenses/by-sa/4.0/
  6. // @namespace http://github.com/Mottie
  7. // @include https://github.com/*
  8. // @run-at document-idle
  9. // @grant GM_addStyle
  10. // @grant GM_getValue
  11. // @grant GM_setValue
  12. // @author Rob Garrison
  13. // ==/UserScript==
  14. /* global GM_addStyle, GM_getValue, GM_setValue */
  15. /*jshint unused:true */
  16. (function() {
  17. "use strict";
  18.  
  19. // disable click targeting of button SVG internals
  20. GM_addStyle(".ghtws-button > * { pointer-events: none; }");
  21.  
  22. var busy = false,
  23.  
  24. // sidebar state
  25. isHidden = false,
  26.  
  27. toggleIcon = "<svg class='octicon' xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'><path fill='none' stroke='currentColor' stroke-miterlimit='10' d='M.5 3.5h10v9H.5z'/><path fill='currentColor' stroke='currentColor' stroke-miterlimit='10' d='M7 7.8l1.5-1.2V9zM10.5 3.5h5v9h-5v-9zm4.3 4.3l-4.3-3V11l4.3-3.2z'/></svg>",
  28.  
  29. addToggle = function() {
  30. if (document.querySelector("#wiki-wrapper") && !document.querySelector(".ghtws-button")) {
  31. busy = true;
  32. var el = document.querySelector(".gh-header-actions") || document.querySelector(".gh-header-title"),
  33. button = document.createElement("div");
  34. button.className = "btn btn-sm tooltipped tooltipped-s ghtws-button";
  35. button.innerHTML = toggleIcon;
  36. button.setAttribute("aria-label", "Toggle Sidebar");
  37. if (el.nodeName === "H1") {
  38. // non-editable wiki pages
  39. button.style.float = "right";
  40. el = el.parentNode;
  41. }
  42. // editable wikis have a "header-actions" area
  43. // prepend button
  44. el.insertBefore(button, el.childNodes[0]);
  45. if (isHidden) {
  46. toggleSidebar();
  47. }
  48. busy = false;
  49. }
  50. },
  51.  
  52. toggleSidebar = function() {
  53. busy = true;
  54. var sidebar = document.querySelector("#wiki-rightbar"),
  55. wrapper = sidebar && sidebar.parentNode;
  56. if (sidebar) {
  57. if (isHidden) {
  58. sidebar.style.display = "none";
  59. wrapper.classList.remove("has-rightbar");
  60. } else {
  61. sidebar.style.display = "";
  62. wrapper.classList.add("has-rightbar");
  63. }
  64. GM_setValue("sidebar-state", isHidden);
  65. }
  66. busy = false;
  67. },
  68.  
  69. toggleEvent = function(event) {
  70. var target = event.target;
  71. if (target && target.classList.contains("ghtws-button")) {
  72. isHidden = !isHidden;
  73. toggleSidebar();
  74. }
  75. },
  76.  
  77. init = function() {
  78. busy = true;
  79. isHidden = GM_getValue("sidebar-state", false);
  80. document.querySelector("body").addEventListener("click", toggleEvent);
  81. addToggle();
  82. // busy = false from addToggle();
  83. },
  84.  
  85. // DOM targets - to detect GitHub dynamic ajax page loading
  86. targets = document.querySelectorAll([
  87. "#js-repo-pjax-container",
  88. "#js-pjax-container"
  89. ].join(","));
  90.  
  91. // update TOC when content changes
  92. Array.prototype.forEach.call(targets, function(target) {
  93. new MutationObserver(function(mutations) {
  94. mutations.forEach(function(mutation) {
  95. // preform checks before adding code wrap to minimize function calls
  96. if (!busy && mutation.target === target) {
  97. addToggle();
  98. }
  99. });
  100. }).observe(target, {
  101. childList: true,
  102. subtree: true
  103. });
  104. });
  105.  
  106. init();
  107.  
  108. })();

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址