GreasyFork Code: Monaco Editor

12/17/2023, 2:31:22 PM
当前为 2023-12-17 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name        GreasyFork Code: Monaco Editor
// @namespace   Violentmonkey Scripts
// @match       https://greasyfork.org/*
// @grant       none
// @version     0.1.0
// @author      -
// @description 12/17/2023, 2:31:22 PM
// @run-at document-start
// @unwrap
// @license MIT
// ==/UserScript==
 
// localStorage.darkMode = 'true'
 
(() => {
 
  const cssText01 = `
  .monaco-editor-container{
      height: 20em;
  }
  `;
 
  let elmSet = {};
 
  HTMLInputElement.prototype.addEventListener177 = HTMLInputElement.prototype.addEventListener;
  HTMLInputElement.prototype.addEventListener = function () {
    if (arguments.length === 2 && arguments[0] === 'change' && (arguments[1] || 0).name === 'handleChange') {
      // if(this ===  ) return;
      // console.log(this)
      if (this.id === 'enable-source-editor-code') return;
      // return;
    }
    return this.addEventListener177.apply(this, arguments);
 
  }
 
 
  function loadResource(type, url) {
    if (type === 'css') {
      return new Promise(resolve => {
        var link = document.createElement('link');
        var onload = function () {
          link.removeEventListener('load', onload, false);
          resolve();
        }
        link.addEventListener('load', onload, false);
        link.rel = 'stylesheet';
        link.href = url;
        document.head.appendChild(link);
      });
    } else if (type === 'js') {
      return new Promise(resolve => {
        var script = document.createElement('script');
        var onload = function () {
          script.removeEventListener('load', onload, false);
          resolve();
        }
        script.addEventListener('load', onload, false);
        script.src = url;
        document.head.appendChild(script);
      })
    }
  }
 
  function onChange817(e) {
 
 
 
    // console.log(123213)
 
    const target = (e || 0).target || null;
 
    if (!target) return;
 
    let monacoStatus = target.getAttribute('monaco-status')
    if (monacoStatus) {
 
 
      // console.log(monacoStatus)
      if (monacoStatus === '1') {
        elmSet.container.replaceWith(elmSet.textArea);
 
 
        target.setAttribute('monaco-status', monacoStatus = '2')
        return;
 
      } else if (monacoStatus === '2') {
 
        elmSet.textArea.replaceWith(elmSet.container);
 
        target.setAttribute('monaco-status', monacoStatus = '1')
        return;
      } else {
        return;
      }
 
    }
 
    const codeId = target.getAttribute('data-related-editor') || '';
    if (!codeId) return;
 
    const textArea = document.getElementById(codeId);
 
    if (!textArea) return;
 
    const codeLang = target.getAttribute('data-editor-language'); // 'javascript', 'css'
 
    if (!codeLang) return;
 
 
    target.setAttribute('monaco-status', '1');
 
 
    e.stopImmediatePropagation();
    e.stopPropagation();
    e.preventDefault();
 
 
    const vsPath = "https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.45.0/min/vs"
    // Setting up Monaco Editor requirements
    var require = {
      paths: {
        vs: vsPath,
      },
    };
    window.require = require;
 
 
    const addCssText = (id, text) => {
      if (document.getElementById(id)) return;
      const style = document.createElement('style');
      style.id = id;
      style.textContent = text;
      document.head.appendChild(style);
 
    }
 
 
    (async function () {
 
      // Dynamically load CSS and JS
      await loadResource('css', `${vsPath}/editor/editor.main.css`);
      await loadResource('js', `${vsPath}/loader.js`);
      await loadResource('js', `${vsPath}/editor/editor.main.nls.js`);
      await loadResource('js', `${vsPath}/editor/editor.main.js`);
 
      addCssText('rmbnctzOOksi', cssText01);
 
      monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
        allowNonTsExtensions: true,
        checkJs: true,
      });
 
      const container = document.createElement('div');
      container.className = 'monaco-editor-container';
      textArea.replaceWith(container);
 
      elmSet.textArea = textArea;
      elmSet.container = container;
 
      const monacoLangs = {
        'javascript': 'javascript',
        'css': 'css',
      }
 
      const monacoLang = monacoLangs[codeLang];
 
      var editor = monaco.editor.create(container, {
        value: textArea.value,
        language: monacoLang,
        automaticLayout: true,
        foldingStrategy: 'indentation',
        lineNumbers: 'on',
        readOnly: false,
        minimap: {
          enabled: false,
        },
        cursorStyle: 'line',
      });
 
      if (document.documentElement.hasAttribute('dark')) monaco.editor.setTheme("vs-dark");
 
      editor.onDidChangeModelContent(e => {
        elmSet.textArea.value = editor.getValue()
      });
 
 
 
      // console.log(monaco, monaco.onDidChangeModelContent)
 
      //   window.editor.getModel().onDidChangeContent((event) => {
      //   render();
      // });
 
      //   editor.setTheme
 
      //   onDidChangeContent is attached to a model, and will only apply to that model
      // onDidChangeModelContent
 
 
 
    })();
 
 
  }
 
  function onReady() {
    window.removeEventListener("DOMContentLoaded", onReady, false);
 
    if (localStorage.darkMode === 'true') document.documentElement.setAttribute('dark', '')
 
 
    document.querySelector('input#enable-source-editor-code[name="enable-source-editor-code"]').addEventListener('change', onChange817, { once: false, capture: true, passive: false });
 
  }
 
 
  Promise.resolve().then(() => {
 
    if (document.readyState !== 'loading') {
      onReady();
    } else {
      window.addEventListener("DOMContentLoaded", onReady, false);
    }
 
  });
 
})();