User:Fumple/vector.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
• Opera: Press Ctrl-F5.

if(["Scribunto", "javascript", "css"].includes(mw.config.get("wgPageContentModel")) && mw.config.get("wgAction") == "edit"){
    //Load editor (https://github.com/microsoft/monaco-editor/tree/main)
    $("head").append(`<link
        rel="stylesheet"
        data-name="vs/editor/editor.main"
        href="https://microsoft.github.io/monaco-editor/node_modules/monaco-editor/min/vs/editor/editor.main.css"
    />`);
    $("body").append(`
        <script>
            var require = { paths: { vs: 'https://microsoft.github.io/monaco-editor/node_modules/monaco-editor/min/vs' } };
        </script>
        <script src="https://microsoft.github.io/monaco-editor/node_modules/monaco-editor/min/vs/loader.js"></script>
        <script src="https://microsoft.github.io/monaco-editor/node_modules/monaco-editor/min/vs/editor/editor.main.nls.js"></script>
        <script src="https://microsoft.github.io/monaco-editor/node_modules/monaco-editor/min/vs/editor/editor.main.js"></script>
    `)
    var fplEditorCheck = setInterval(async ()=>{
        if($("#wpTextbox1").length != 0){
            clearInterval(fplEditorCheck);
            $("#wpTextbox1").after('<div id="vscodeeditor"></div>');
            $("#wpTextbox1").css("display", "none");
            $("#wpTextbox1").attr("readonly",true);
            $("#vscodeeditor").css("height", "500px");
            window.fplEditor = monaco.editor.create(document.getElementById('vscodeeditor'), {
                value: $("#wpTextbox1").val(),
                language: {"Scribunto":"lua", "javascript":"javascript", "css":"css"}[mw.config.get("wgPageContentModel")],
                theme: await new mw.Api().get({
                    "action": "query",
                    "format": "json",
                    "list": "gadgets",
                    "gaprop": "id",
                    "gaenabledonly": 1
                }).query.gadgets.map(el=>el.id).includes("darkmode") ? "vs-dark" : "vs"
            });
        }
    }, 100)
}