Changing the default code template.

[AaronLigthart]

After having worked with playcanvas for a couple of years I found another way to write my scripts so I won't need to extend every method from pc. Since I use this setup in all my scripts I currently use the magical plugin for chrome to insert my templates for example while using pc* with ExampleClass copied it auto fills it as:

var ExampleClass = pc.createScript('exampleClass');

pc.extend(ExampleClass.prototype, {
     initialize: function() {

     },

     update: function(dt){

     },
});

It would be great, with the new code editor update to Monaco, if we could define the default template script, so we can enforce the same script style across our projects and organization.

[yaustar]

I wonder if this is possible to do via the Editor API 🤔 https://github.com/playcanvas/editor-api/blob/master/docs/classes/Asset.md

ie Add a button to create a new Script asset with your template

[benunbnd]

+1 on this, I much prefer writing scripts in this format and having to manually update it on each script creation is a chore

class GameManager extends pc.ScriptType {
    initialize () {

    }

    update (dt) {

    }
}

pc.registerScript (GameManager, 'gameManager');

[vkalpias]

I wonder if this is possible to do via the Editor API 🤔 https://github.com/playcanvas/editor-api/blob/master/docs/classes/Asset.md

ie Add a button to create a new Script asset with your template

You can do this with the Editor API: https://github.com/playcanvas/editor-api/blob/master/docs/classes/Assets.md#createscript. Just pass in a custom text. A custom button could be created with an associated text field to create script assets using your custom code.

[yaustar]

+1. Been doing an FPS project and been wishing for this a lot!

[benunbnd]

I've been using a Violentmonkey script for this for some time now, it doesn't hook into script creation from the context menu or anything, just a button in the scene.

(function() {
    async function generateScript(name) {
      let uppercaseName = name.charAt(0).toUpperCase() + name.slice(1);
      uppercaseName = uppercaseName.replace('.js', '');
      name = name.replace('.js', '');

      const text = `class ${uppercaseName} extends pc.ScriptType {
  initialize () {

  }

  update (dt) {

  }
}

pc.registerScript (${uppercaseName}, '${name}');`;  

      editor.assets.createScript({
        filename: name,
        text: text
      });
    }

    function createUI() {

      // Create script name overlay
      const overlay = new pcui.Overlay ();
      overlay.hidden = true;
      editor.call('layout.root').append (overlay);

      const container = new pcui.Container ();     
      container.style.display = 'flex';
      container.style.flexDirection = 'column';
      container.style.padding = '0.8rem';
      overlay.append (container);

      const label = new pcui.Label({text: 'Enter a script filename:'});
      container.append(label);

      const input = new pcui.TextInput();
      input.width = 300;
      container.append(input);

      // Create new script button
      const btn = new pcui.Button({ text: 'New Script' });
      btn.style.position = 'absolute';
      btn.style.bottom = '10px';
      btn.style.right = '10px';
      editor.call('layout.viewport').append(btn);

      // Close overlay if clicking off container
      overlay.on ('click', () => {
        overlay.hidden = true;
      });

      // Don't close overlay if clicking on container
      container.on ('click', (event) => {
        event.stopPropagation();
      });

      // Adds ESC / Enter support for script name input
      input.on("keydown", event => {
        if (event.keyCode === 13) {
          createScript ();
        }

        if (event.keyCode === 27) {
          overlay.hidden = true;
        }
      });

      // Open overlay if new script button is clicked
      btn.on('click', () => {
        overlay.hidden = false;
        input.focus ();
      });

      const createScript = () => {
        generateScript (input.value);
        input.value = '';
        overlay.hidden = true;
      };
    }

    // Wait until the Editor is available before adding the button
    editor.once('load', () => createUI());
})();