Github Word Wrapping for CODE blocks

Switches word wrapping for CODE blocks in comments on github.com

  1. // ==UserScript==
  2. // @name Github Word Wrapping for CODE blocks
  3. // @namespace gihubpre
  4. // @run-at document-start
  5. // @description Switches word wrapping for CODE blocks in comments on github.com
  6. // @author Mak Alexey (S-ed, Sedokun)
  7. // @match http://github.com/*
  8. // @match https://github.com/*
  9. // @version 1.220705.1
  10. // @grant none
  11. // @license MIT License
  12. // ==/UserScript==
  13.  
  14. // if Local Storage used, uncomment to reset default setting or type line in console
  15. // localStorage.removeItem("wrapDefault")
  16.  
  17. // wrapDefault = true; if no Local Storage available, will enable word wrapping by default
  18. // will reset on script update obviously
  19.  
  20. var wrapDefault = false;
  21.  
  22. var preCSS = '\
  23. .preButtonDiv {\
  24. cursor: pointer;\
  25. display: block;\
  26. left: 0px;\
  27. margin: 2px 0 0 2px;\
  28. position: absolute;\
  29. width: 16px;\
  30. height: 16px;\
  31. line-height: 16px;\
  32. border-radius: 8px;\
  33. text-align: center;\
  34. transition: .5s;\
  35. }\
  36. .comment-body .preButtonDiv{\
  37. margin-left: 5px\
  38. }\
  39. .preButtonDiv:hover {\
  40. transition: .3s;\
  41. background-color: #ccc;\
  42. }'
  43.  
  44. if(typeof(localStorage) !== "undefined") {
  45. wrapDefault = localStorage.getItem("wrapDefault");
  46. if( wrapDefault == null ){
  47. if(confirm("github-pre userscript:\nWould You like to set word wrapping to 'enabled' by default?")){
  48. wrapDefault = true;
  49. } else wrapDefault = false;
  50. localStorage.setItem("wrapDefault", wrapDefault);
  51. }
  52. } else { console.warn( "Sorry, no Local Storage Available\n\
  53. Hardcoded 'wrapDefault' variable will be used instead (edit script to set)" ); }
  54.  
  55.  
  56. //Intercepting fetch to trigger DOM parse on navigation events
  57. const { fetch: originalFetch } = window;
  58. window.fetch = async (...args) => {
  59. let [resource, config] = args;
  60.  
  61. let response = await originalFetch(resource, config);
  62.  
  63. initGithubPre();
  64.  
  65. return response;
  66. };
  67.  
  68.  
  69. var preStyleSheet = document.createElement("style");
  70. preStyleSheet.type = "text/css";
  71. preStyleSheet.appendChild(document.createTextNode(preCSS));
  72. document.head.appendChild(preStyleSheet);
  73.  
  74. //Trigger once on page load
  75. document.addEventListener("DOMContentLoaded", initGithubPreDOM());
  76.  
  77. function initGithubPreDOM(){
  78. document.removeEventListener("DOMContentLoaded", initGithubPreDOM);
  79. initGithubPre();
  80. console.warn( "waka");
  81. }
  82.  
  83. //Parse the page, find all code containers change the wrap, and add swith buttons
  84. function initGithubPre(){
  85. var preCollection = document.querySelectorAll(".markdown-body pre");
  86. for (var i = 0; i < preCollection.length; ++i) {
  87. if( !preCollection[i].parentNode.firstChild.classList.contains('preButtonDiv') ) addPreButton(preCollection[i]);
  88. if (wrapDefault) preCollection[i].firstChild.style.whiteSpace = "pre-wrap";
  89. }
  90. }
  91.  
  92.  
  93. //Function to embed button switches in each code container
  94. function addPreButton(element){
  95. var preButtonDiv = document.createElement("div");
  96. var preButtonText = document.createTextNode("▾");
  97. preButtonDiv.appendChild(preButtonText);
  98. preButtonDiv.className = "preButtonDiv";
  99. element.parentNode.insertBefore(preButtonDiv, element);
  100. preButtonDiv.addEventListener("click", switchPreStyle, false);
  101. }
  102.  
  103. //Function to handle Click events
  104. function switchPreStyle(){
  105. var pre = this.nextSibling.firstChild.style;
  106. pre.whiteSpace = (pre.whiteSpace != "pre-wrap")?"pre-wrap":"pre";
  107. this.style.transform = (this.style.transform != "rotate(-90deg)")?"rotate(-90deg)":"";
  108. }

QingJ © 2025

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