User:Fumple/vector.js: Difference between revisions

From Inkipedia, the Splatoon wiki
(Testing)
(Update darkmode gadget name)
 
(9 intermediate revisions by the same user not shown)
Line 1: Line 1:
if(["Scribunto", "javascript", "css"].includes(mw.config.get("wgPageContentModel")) && mw.config.get("wgAction") == "edit"){
if(["Scribunto", "javascript", "css"].includes(mw.config.get("wgPageContentModel")) && ["view", "edit", "submit"].includes(mw.config.get("wgAction"))){
     //Load editor (https://github.com/microsoft/monaco-editor/tree/main)
     //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" />');
     $("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" />');
Line 11: Line 11:
     ].join("\n"));
     ].join("\n"));
     var fplEditorCheck = setInterval(function (){
     var fplEditorCheck = setInterval(function (){
         if($("#wpTextbox1").length != 0 && typeof monaco != "undefined"){
         if(($("#wpTextbox1").length != 0 || $("pre.mw-code").length != 0) && typeof monaco != "undefined"){
             clearInterval(fplEditorCheck);
             clearInterval(fplEditorCheck);
             $("#wpTextbox1").after('<div id="vscodeeditor"></div>');
             var editable = $("#wpTextbox1").length != 0;
             $("#wpTextbox1").css("display", "none");
            if(!editable){
            $("#wpTextbox1").attr("readonly",true);
                $("pre.mw-code").after('<div id="vscodeeditor"></div>');
            $("#vscodeeditor").css("height", "500px");
                $("pre.mw-code").css("display", "none");
                $("#vscodeeditor").css("height", "700px");
             } else {
                $("#wpTextbox1").after('<div id="vscodeeditor"></div>');
                $("#wpTextbox1").css("display", "none");
                $("#wpTextbox1").attr("readonly",true);
                $("#vscodeeditor").css("height", "700px");
            }
             new mw.Api().get({
             new mw.Api().get({
                 "action": "query",
                 "action": "query",
Line 25: Line 32:
             }).then(function(data){
             }).then(function(data){
                 window.fplEditor = monaco.editor.create(document.getElementById('vscodeeditor'), {
                 window.fplEditor = monaco.editor.create(document.getElementById('vscodeeditor'), {
                     value: $("#wpTextbox1").val(),
                     value: editable ? $("#wpTextbox1").val() : $("pre.mw-code").text(),
                     language: {"Scribunto":"lua", "javascript":"javascript", "css":"css"}[mw.config.get("wgPageContentModel")],
                     language: {"Scribunto":"lua", "javascript":"javascript", "css":"css"}[mw.config.get("wgPageContentModel")],
                     theme: data.query.gadgets.map(function(el){return el.id}).includes("darkmode") ? "vs-dark" : "vs"
                     theme: data.query.gadgets.map(function(el){return el.id}).includes("dark-vector") ? "vs-dark" : "vs",
                    automaticLayout: true,
                    readOnly: !editable
                });
                window.fplEditor.onDidChangeModelContent(function (e) {
                    $("#wpTextbox1").val(window.fplEditor.getValue())
                 });
                 });
             }).catch(function(ex){
             }).catch(function(ex){
Line 34: Line 46:
                 $("#wpTextbox1").css("display", "");
                 $("#wpTextbox1").css("display", "");
                 $("#wpTextbox1").attr("readonly",null);
                 $("#wpTextbox1").attr("readonly",null);
                $("pre.mw-code").css("display", "");
                 $("#vscodeeditor").remove();
                 $("#vscodeeditor").remove();
             })
             })

Latest revision as of 19:21, 10 October 2023

if(["Scribunto", "javascript", "css"].includes(mw.config.get("wgPageContentModel")) && ["view", "edit", "submit"].includes(mw.config.get("wgAction"))){
    //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>'
    ].join("\n"));
    var fplEditorCheck = setInterval(function (){
        if(($("#wpTextbox1").length != 0 || $("pre.mw-code").length != 0) && typeof monaco != "undefined"){
            clearInterval(fplEditorCheck);
            var editable = $("#wpTextbox1").length != 0;
            if(!editable){
                $("pre.mw-code").after('<div id="vscodeeditor"></div>');
                $("pre.mw-code").css("display", "none");
                $("#vscodeeditor").css("height", "700px");
            } else {
                $("#wpTextbox1").after('<div id="vscodeeditor"></div>');
                $("#wpTextbox1").css("display", "none");
                $("#wpTextbox1").attr("readonly",true);
                $("#vscodeeditor").css("height", "700px");
            }
            new mw.Api().get({
                "action": "query",
                "format": "json",
                "list": "gadgets",
                "gaprop": "id",
                "gaenabledonly": 1
            }).then(function(data){
                window.fplEditor = monaco.editor.create(document.getElementById('vscodeeditor'), {
                    value: editable ? $("#wpTextbox1").val() : $("pre.mw-code").text(),
                    language: {"Scribunto":"lua", "javascript":"javascript", "css":"css"}[mw.config.get("wgPageContentModel")],
                    theme: data.query.gadgets.map(function(el){return el.id}).includes("dark-vector") ? "vs-dark" : "vs",
                    automaticLayout: true,
                    readOnly: !editable
                });
                window.fplEditor.onDidChangeModelContent(function (e) {
                    $("#wpTextbox1").val(window.fplEditor.getValue())
                });
            }).catch(function(ex){
                alert("An error occurred, check the console for more details");
                console.error(ex);
                $("#wpTextbox1").css("display", "");
                $("#wpTextbox1").attr("readonly",null);
                $("pre.mw-code").css("display", "");
                $("#vscodeeditor").remove();
            })
        }
    }, 100)
}