Editor API Scripting

I was keen to start some editor scripting this morning and took the first step of trying to install ‘ViolentMonkey’ but I got this message:

What’s going on? Is there another recommended package or do I need to switch browsers (hopefully not). Thanks

See https://www.reddit.com/r/chrome/comments/1hw19og/violentmonkey_no_longer_supported_why/ for issues on Violent Monkey

Try https://chromewebstore.google.com/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo in the meantime

1 Like

Thanks.

Okay. So I got TamperMonkey installed and I cut/paste the example script found at Editor API | PlayCanvas Developer Site but I just get a bunch of errors regarding: editor is not defined, pc is not defined etc

Any idea how Im supposed to format the example script correctly to work with TamperMonkey?
Thanks

Haven’t touched PlayCanvas for a few years now so chances are something has changed with the Editor in how it loads (perhaps editor and pc aren’t available yet when the user script loads) and/or Chrome is limiting access in some way in the last few updates to the user manifest

Had a quick look at this

Those errors are expected in the editor because they are global variables added by the PlayCanvas Editor. I would ignore them unless they are really undefined when you run the script

It also looks like Tampermonkey has the same issue as Violent Monkey with Chrome blocking user scripts FAQ | Tampermonkey

Actually, all you may need to do is enable Developer mode in the top right in chrome://extensions/

image

1 Like

Try this code:

// ==UserScript==
// @name         New Userscript
// @namespace    http://tampermonkey.net/
// @version      2025-05-16
// @description  try to take over the world!
// @author       You
// @match        https://playcanvas.com/editor/scene/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=playcanvas.com
// @grant        none
// ==/UserScript==

/* global editor, pc, pcui */
(function() {
    function waitForEditor() {
        if (typeof editor !== 'undefined' && typeof pc !== 'undefined' && typeof pcui !== 'undefined') {
            console.log('Editor, pc, and pcui are available now.');
            createButton();
        } else {
            console.log('Waiting for editor...');
            setTimeout(waitForEditor, 100);
        }
    }

    function createButton() {
        const entityBtn = new pcui.Button({ text: 'Button_01' });
        const assetBtn = new pcui.Button({ text: 'Button_02' });

        entityBtn.style.position = 'absolute';
        entityBtn.style.bottom = '0px';
        entityBtn.style.right = '0px';

        assetBtn.style.position = 'absolute';
        assetBtn.style.bottom = '32px';
        assetBtn.style.right = '0px';

        editor.call('layout.viewport').append(entityBtn);
        editor.call('layout.viewport').append(assetBtn);

        entityBtn.on('click', () => {
			//Button_01 Function
        });

        assetBtn.on('click', () => {
			//Button_02 Function
        });
    }

    editor.once('load', () => createButton());

    waitForEditor();
})();

1 Like

Thank You. That seems to open the gates!

1 Like