Add code formatting shortcut in the code editor

Suggestions & Feedback
1

There are times when i edit a segment of code too much and everything looks kind of messy and out of place, is there any shortcut that formats the code? like in VSCode its Shift+ctrl+f to format the code back to looking good, can playcanvas have something similar?

2

Check the menu options in the toolbar at at the top. There should be one for formatting code/auto indent. (CTRL/CMD + I)

2 Likes
3

@sir_akc Hi,you can also extend the code editor to use Shift+ctrl+f to format all the code at once.
type F12 to open the console of the code editor and input:

!function() {
	setTimeout(function() {
		function _insertCodeEditor() {
			function addShortCut() {
				CodeMirror.defineExtension("autoIndentRange", function(from, to) {
					var cmInstance = this;
					this.operation(function() {
						for (var i = from.line; i <= to.line; i++) {
							cmInstance.indentLine(i, "smart");
						}
					});
				});
				editor.method("autoindentAll", function() {
					var cmInstance = editor.call("editor:codemirror");
					var totalLines = cmInstance.lineCount();
					cmInstance.autoIndentRange({
						line: 0,
						ch: 0
					}, {
						line: totalLines
					});
				});
				editor.call('hotkey:register', 'autoindentAll', {
					key: 'f',
					alt: true,
					shift: true,
					callback: function() {
						editor.call("autoindentAll");
					}
				});
			}

			addShortCut();
		}

		let script = document.createElement('script');
		script.innerHTML = _insertCodeEditor.toString() + "_insertCodeEditor();";
		document.body.appendChild(script);
	}, 200)
}()

type enter to run the code.
you can also write a plugin to inject this code every time you open the code editor.

4

did you write this?