GreasyFork Code: Syntax Highlight by CodeMirror

To syntax hightlight GreasyFork Code by CodeMirror

اعتبارا من 30-07-2023. شاهد أحدث إصدار.

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

ستحتاج إلى تثبيت إضافة مثل Stylus لتثبيت هذا النمط.

ستحتاج إلى تثبيت إضافة لإدارة أنماط المستخدم لتتمكن من تثبيت هذا النمط.

ستحتاج إلى تثبيت إضافة لإدارة أنماط المستخدم لتثبيت هذا النمط.

ستحتاج إلى تثبيت إضافة لإدارة أنماط المستخدم لتثبيت هذا النمط.

(لدي بالفعل مثبت أنماط للمستخدم، دعني أقم بتثبيته!)

// ==UserScript==
// @name        GreasyFork Code: Syntax Highlight by CodeMirror
// @namespace   Violentmonkey Scripts
// @match       https://greasyfork.org/*
// @grant       none
// @version     0.1.5
// @author      CY Fung
// @description To syntax hightlight GreasyFork Code by CodeMirror
// @run-at      document-start
// @inject-into page
// @unwrap
// @license     MIT
// ==/UserScript==



(() => {
  let byPass = true;

  let documentReady = new Promise(resolve => {
    Promise.resolve().then(() => {
      if (document.readyState !== 'loading') {
        resolve();
      } else {
        window.addEventListener("DOMContentLoaded", resolve, false);
      }
    });
  });

  // Function to load CodeMirror library
  function loadCodeMirror(arr) {


    const promises = arr.map((href) => {
      return new Promise(resolve => {


        const script = document.createElement('script');
        script.src = href;
        script.onload = () => {
          resolve(script);
        };
        document.head.appendChild(script);

      });


    });

    return Promise.all(promises);
  }

  // Function to load CodeMirror CSS
  function loadCodeMirrorCSS(href) {
    const link = document.createElement('link');
    link.rel = 'stylesheet';
    link.href = href;
    document.head.appendChild(link);
  }

  async function runBlock(codeBlock) {

    let textarea = document.createElement('textarea');
    textarea.value = `${codeBlock.textContent}`;
    textarea.readOnly = true;
    textarea.id = 'editor651';

    textarea.style.width = '100%';
    textarea.style.height = '400px';

    codeBlock.replaceWith(textarea);
    codeBlock.remove();

    await new Promise(r => setTimeout(r, 40));




    let editor651 = CodeMirror.fromTextArea(document.querySelector('#editor651'), {

      mode: "javascript",

      readOnly: true,
      styleActiveLine: true,
      lineNumbers: true,
    });
    editor651.save();







  }

  // Main function to apply CodeMirror syntax highlighting to pre elements
  function applyCodeMirrorSyntaxHighlighting() {
    const codeBlocks = document.querySelectorAll('pre.prettyprint.linenums.lang-js');


    // Check if CodeMirror is loaded
    if (typeof CodeMirror !== 'undefined') {

      codeBlocks.forEach(runBlock);
    } else {
      console.error('CodeMirror library is not loaded. Syntax highlighting cannot be applied.');
    }
  }

  async function doAction() {


    await new Promise(r => setTimeout(r, 20));
 


      document.head.appendChild(document.createElement('style')).textContent = `

          body {

              display: flex;
              flex-direction: column;
              height: 100vh;
          }

          body  > div:last-child{
              height:0;
              flex-grow:1;
              display: flex;
              flex-direction:column;
          }

          body  > div:last-child >  #script-info:last-child{

              height:0;
              flex-grow:1;
              display: flex;
              flex-direction:column;

          }

          body  > div:last-child >  #script-info:last-child > #script-content:last-child{


              height:0;
              flex-grow:1;
              display: flex;
              flex-direction:column;
          }

          body  > div:last-child >  #script-info:last-child > #script-content:last-child > .code-container:last-child{


              height:0;
              flex-grow:1;
              display: flex;
              flex-direction:column;

          }

          body  > div:last-child >  #script-info:last-child > #script-content:last-child > .code-container:last-child > textarea:last-child{


              height:0;
              flex-grow:1;
              display: flex;
              flex-direction:column;

          }

          body  > div:last-child >  #script-info:last-child > #script-content:last-child > .code-container:last-child > .CodeMirror:last-child{


              height:0;
              flex-grow:1;
              display: flex;
              flex-direction:column;

          }

              `;

      await loadCodeMirror(['https://cdn.jsdelivr.net/npm/[email protected]/lib/codemirror.min.js']);

      await loadCodeMirror([
        'https://cdn.jsdelivr.net/npm/[email protected]/mode/javascript/javascript.min.js',
        'https://cdn.jsdelivr.net/npm/[email protected]/addon/selection/active-line.min.js']);

      loadCodeMirrorCSS('https://cdn.jsdelivr.net/npm/[email protected]/lib/codemirror.min.css');

      await new Promise(r => setTimeout(r, 20));



      byPass = false;

      applyCodeMirrorSyntaxHighlighting();



 


  }


  let mgg = 0;
  async function mTz() {
    if (mgg) return;
    mgg = 1;
    documentReady.then(doAction);
  }



  function getElementsByTagName(tag) {

    if (byPass) {
      if (tag === 'pre' || tag === 'code' || tag === 'xmp') {
        setTimeout(mTz, 10)
        return [];
      }
    }
    return this.getElementsByTagName331(tag);
  }



  HTMLElement.prototype.getElementsByTagName331 = HTMLElement.prototype.getElementsByTagName
  Document.prototype.getElementsByTagName331 = Document.prototype.getElementsByTagName

  HTMLElement.prototype.getElementsByTagName = getElementsByTagName
  Document.prototype.getElementsByTagName = getElementsByTagName

  /*
  let mz= function(evt){

    if(evt && evt.type ==='readystatechange') return;
    return EventTarget.prototype.addEventListener.apply(this,arguments)

  };
  window.addEventListener = mz
  document.addEventListener = mz;
  */


  documentReady.then(async () => {

    if(location.pathname.endsWith('/code')) return;

    byPass = false;

  });

})();