GreasyFork Code: Syntax Highlight by CodeMirror

To syntax hightlight GreasyFork Code by CodeMirror

Verze ze dne 30. 07. 2023. Zobrazit nejnovější verzi.

  1. // ==UserScript==
  2. // @name GreasyFork Code: Syntax Highlight by CodeMirror
  3. // @namespace Violentmonkey Scripts
  4. // @match https://greatest.deepsurf.us/*
  5. // @grant none
  6. // @version 0.1.5
  7. // @author CY Fung
  8. // @description To syntax hightlight GreasyFork Code by CodeMirror
  9. // @run-at document-start
  10. // @inject-into page
  11. // @unwrap
  12. // @license MIT
  13. // ==/UserScript==
  14.  
  15.  
  16.  
  17. (() => {
  18. let byPass = true;
  19.  
  20. let documentReady = new Promise(resolve => {
  21. Promise.resolve().then(() => {
  22. if (document.readyState !== 'loading') {
  23. resolve();
  24. } else {
  25. window.addEventListener("DOMContentLoaded", resolve, false);
  26. }
  27. });
  28. });
  29.  
  30. // Function to load CodeMirror library
  31. function loadCodeMirror(arr) {
  32.  
  33.  
  34. const promises = arr.map((href) => {
  35. return new Promise(resolve => {
  36.  
  37.  
  38. const script = document.createElement('script');
  39. script.src = href;
  40. script.onload = () => {
  41. resolve(script);
  42. };
  43. document.head.appendChild(script);
  44.  
  45. });
  46.  
  47.  
  48. });
  49.  
  50. return Promise.all(promises);
  51. }
  52.  
  53. // Function to load CodeMirror CSS
  54. function loadCodeMirrorCSS(href) {
  55. const link = document.createElement('link');
  56. link.rel = 'stylesheet';
  57. link.href = href;
  58. document.head.appendChild(link);
  59. }
  60.  
  61. async function runBlock(codeBlock) {
  62.  
  63. let textarea = document.createElement('textarea');
  64. textarea.value = `${codeBlock.textContent}`;
  65. textarea.readOnly = true;
  66. textarea.id = 'editor651';
  67.  
  68. textarea.style.width = '100%';
  69. textarea.style.height = '400px';
  70.  
  71. codeBlock.replaceWith(textarea);
  72. codeBlock.remove();
  73.  
  74. await new Promise(r => setTimeout(r, 40));
  75.  
  76.  
  77.  
  78.  
  79. let editor651 = CodeMirror.fromTextArea(document.querySelector('#editor651'), {
  80.  
  81. mode: "javascript",
  82.  
  83. readOnly: true,
  84. styleActiveLine: true,
  85. lineNumbers: true,
  86. });
  87. editor651.save();
  88.  
  89.  
  90.  
  91.  
  92.  
  93.  
  94.  
  95. }
  96.  
  97. // Main function to apply CodeMirror syntax highlighting to pre elements
  98. function applyCodeMirrorSyntaxHighlighting() {
  99. const codeBlocks = document.querySelectorAll('pre.prettyprint.linenums.lang-js');
  100.  
  101.  
  102. // Check if CodeMirror is loaded
  103. if (typeof CodeMirror !== 'undefined') {
  104.  
  105. codeBlocks.forEach(runBlock);
  106. } else {
  107. console.error('CodeMirror library is not loaded. Syntax highlighting cannot be applied.');
  108. }
  109. }
  110.  
  111. async function doAction() {
  112.  
  113.  
  114. await new Promise(r => setTimeout(r, 20));
  115.  
  116.  
  117. document.head.appendChild(document.createElement('style')).textContent = `
  118.  
  119. body {
  120.  
  121. display: flex;
  122. flex-direction: column;
  123. height: 100vh;
  124. }
  125.  
  126. body > div:last-child{
  127. height:0;
  128. flex-grow:1;
  129. display: flex;
  130. flex-direction:column;
  131. }
  132.  
  133. body > div:last-child > #script-info:last-child{
  134.  
  135. height:0;
  136. flex-grow:1;
  137. display: flex;
  138. flex-direction:column;
  139.  
  140. }
  141.  
  142. body > div:last-child > #script-info:last-child > #script-content:last-child{
  143.  
  144.  
  145. height:0;
  146. flex-grow:1;
  147. display: flex;
  148. flex-direction:column;
  149. }
  150.  
  151. body > div:last-child > #script-info:last-child > #script-content:last-child > .code-container:last-child{
  152.  
  153.  
  154. height:0;
  155. flex-grow:1;
  156. display: flex;
  157. flex-direction:column;
  158.  
  159. }
  160.  
  161. body > div:last-child > #script-info:last-child > #script-content:last-child > .code-container:last-child > textarea:last-child{
  162.  
  163.  
  164. height:0;
  165. flex-grow:1;
  166. display: flex;
  167. flex-direction:column;
  168.  
  169. }
  170.  
  171. body > div:last-child > #script-info:last-child > #script-content:last-child > .code-container:last-child > .CodeMirror:last-child{
  172.  
  173.  
  174. height:0;
  175. flex-grow:1;
  176. display: flex;
  177. flex-direction:column;
  178.  
  179. }
  180.  
  181. `;
  182.  
  183. await loadCodeMirror(['https://cdn.jsdelivr.net/npm/codemirror@5.65.14/lib/codemirror.min.js']);
  184.  
  185. await loadCodeMirror([
  186. 'https://cdn.jsdelivr.net/npm/codemirror@5.65.14/mode/javascript/javascript.min.js',
  187. 'https://cdn.jsdelivr.net/npm/codemirror@5.65.14/addon/selection/active-line.min.js']);
  188.  
  189. loadCodeMirrorCSS('https://cdn.jsdelivr.net/npm/codemirror@5.65.14/lib/codemirror.min.css');
  190.  
  191. await new Promise(r => setTimeout(r, 20));
  192.  
  193.  
  194.  
  195. byPass = false;
  196.  
  197. applyCodeMirrorSyntaxHighlighting();
  198.  
  199.  
  200.  
  201.  
  202.  
  203. }
  204.  
  205.  
  206. let mgg = 0;
  207. async function mTz() {
  208. if (mgg) return;
  209. mgg = 1;
  210. documentReady.then(doAction);
  211. }
  212.  
  213.  
  214.  
  215. function getElementsByTagName(tag) {
  216.  
  217. if (byPass) {
  218. if (tag === 'pre' || tag === 'code' || tag === 'xmp') {
  219. setTimeout(mTz, 10)
  220. return [];
  221. }
  222. }
  223. return this.getElementsByTagName331(tag);
  224. }
  225.  
  226.  
  227.  
  228. HTMLElement.prototype.getElementsByTagName331 = HTMLElement.prototype.getElementsByTagName
  229. Document.prototype.getElementsByTagName331 = Document.prototype.getElementsByTagName
  230.  
  231. HTMLElement.prototype.getElementsByTagName = getElementsByTagName
  232. Document.prototype.getElementsByTagName = getElementsByTagName
  233.  
  234. /*
  235. let mz= function(evt){
  236.  
  237. if(evt && evt.type ==='readystatechange') return;
  238. return EventTarget.prototype.addEventListener.apply(this,arguments)
  239.  
  240. };
  241. window.addEventListener = mz
  242. document.addEventListener = mz;
  243. */
  244.  
  245.  
  246. documentReady.then(async () => {
  247.  
  248. if(location.pathname.endsWith('/code')) return;
  249.  
  250. byPass = false;
  251.  
  252. });
  253.  
  254. })();
  255.  
  256.  
  257.  
  258.  
  259.