Add code region folding to CodeEdit

[jmb462]

Here is an implementation of my code region folding proposal.
Closes godotengine/godot-proposals#3366

Region code folding

While developping my game, I feel unconfortable navigating in scripts that may be quite long and contains many methods.
I miss a way to organize section of code and navigate throw it more easily.

As discuss in the proposal, I know that when misused, code folding can be consider as antipattern by some devs but I think it will help for those who need it and have a good use of it. User still have the choice to use it or not. Positive reactions under the proposal convince me to open this PR.

How does it works

Code region are defined by the use of two common region tag (can be used out of the box in VSCode).

Opening tag is #region name_of_the_region
Closing tag is #endregion
To be language agnostic, as CodeEdit can be used for any language, the first symbol depends of the comment delimiters of CodeEdit. So # will be used in Godot code editor while developping with GDScript language.

Region creation

Region can be created manualy by writing opening and closing tag around the code that we want to include in this region.

I've also added a context menu on text selection that do the stuff for us. We just need to modify the default name with this way.

Edit : Keyboard shorcut Alt + R has been added to create region.

Region highlighting

When a region is folded, its line is highlighted and a special gutter is shown.
While unfolded, there is no highlight and classic folding gutter is shown.

As a colorblind, the default color of line background and gutter icon is maybe not the best choice.

I choose the existing folder icon for region gutter. Of course a special icon could be designed. I don't really have Inkscape skill. I found that folder icon was not a bad temporay choice.

Clicking on the gutter icon (folder) will unfold the region.

Region color highlighting can be customized in editor settings under text_editor/theme/highlighting/folded_code_region_color.

Unit tests

I've added some unit tests in CodeEdit to check region detection, creation and folding.

Methods overview panel (EDIT : THIS PART IS DELAYED AND WILL BE ADDED IN ANOTHER PR)

The ItemList of method overview has been replaced by a Tree.

Nothing seems changed if not using regions :

When a region is defined in the script, it will appeared as a root element in the tree with (again) a folder icon :

I choose to not synchronize the folding of region in the script and in the method overview. Because i think we could want to fold script without folding the corresponding methods in the overview.

Clicking on the region name in the overview send you at the corresponding line in the script and unfold the region.
The region is also unfolded if we click on a method in that region.

Filtering works on methods and region names.

If alphabetical sort is toggled on, the root elements of the overview (region and methods that are not in a region) are sorted at first, then, inside each region, methods are also sorted.

Script order :

Alphabetical order :

Video preview

2023-03-12.22-42-12.mp4

[seppoday]

Is there a possibility to add shortcut?

[jmb462]

Edit :

Alt + F is the normal folding shortcut.
Alt + R was free and has been added to create region.

[seppoday]

Is there a possibility to add shortcut?

For creating a region ? I didn't think about it at first, but yes, as the other options in context menu, it should be possible to add a keyboard shortcut for that. I will look at it.

(It should also be possible to add shortcut to quickly go to the next / previous region.)

I mean, dunno if it will be usefull for anyone. We have shortcut for creating comments, so I figured that it might be usefull to add shortcut also here. Some people like to basically only use keyboard.

[xchrix]

It's great for someone like me who has to write long scripts.

[jmb462]

Updated to use CodeEdit theme cache as it was conflicting with master since YuriSizov PR merge.

[Paulb23]

Reviewed /scene changes.

Not sure on making the editor side quite so advanced yet as I would like to refactor that first, might be worth splitting those changes out into a separate PRs.

[jmb462]

@Paulb23 I've updated the PR thanks to your review.

1°) Methods overview has been reverted to ItemList instead of Tree. It will not show anymore the code region. I will propose a separate PR if this one is merged.

2°) Code region tag (start / end) are now property. They are only updated when comment delimiters are modified (added, removed or cleared)

3°) Code region methods have been grouped with code folding methods in the header files.

4°) opening / closing vocabulary has been replaced with start / end to match comment delimiters vocabulary.

5°) Each time comments delimiters are modified, the region tags are updated to select the first available delimiters that is line_only without end delimiter. For now, it doesn't support langage with no one line comment. As I said in an other comment, it's seems good enough because it seems that it's a common have of all languages.

6°) Disable create code region via shortcut if several carrets / selections are active to avoid unwanted behaviour. In master, right click on mouse while having multiple selection will unselected all, so we can already not create region by menu when multiple selections are actives.

7°) Now support nested regions. Now early returns false in fold_line() only if start region tag has no end tag with same level. Still want to early return in that case because we never want to fold a bad nested region.

8°) Updated unit tests with checks for good update of region tags when modifying comment delimiters and check correct behavior of nested region.

[MewPurPur]

My updated SVGs are no longer translucent, just purr #fff

[jmb462]

@Calinou Checking with a color picker, it's the same color as the line highlight. Seems to be an optical illusion.

Should we choose another color (or boost icon opacity to counteract this feeling ?

[Calinou]

Should we choose another color (or boost icon opacity to counteract this feeling ?

Yes, I think we can increase the icon opacity.

[jmb462]

Yes, I think we can increase the icon opacity.

Is it ok with a minimum alpha of 0.4 ?

[Calinou]

Is it ok with a minimum alpha of 0.4 ?

Looks good 🙂

[YuriSizov]

@Calinou Was the icon the only thing missing, or is there anything else you'd like to have addressed?

[Calinou]

@Calinou Was the icon the only thing missing, or is there anything else you'd like to have addressed?

Everything in the PR looks good on my end now.

[jmb462]

New git conflict fixed (EditorStringNames singleton)

[AThousandShips]

Suggested change

	String code_region_start_string = "";
	String code_region_end_string = "";
	String code_region_start_string;
	String code_region_end_string;

These already default to this.

[MewPurPur]

Is there harm in being explicit?

[AThousandShips]

I mean not as such, but it's unnecessary, and we usually suggest it elsewhere

[jmb462]

Nearly all Strings are explicitly set to "" in this file, that's why I chose to keep the same style.
But ok, I'm doing the modification for my new Strings.

Changes done.

[akien-mga]

Needs another rebase, and handling the minor style comment from @AThousandShips. Then this should be ready to merge :)

[jmb462]

Needs another rebase, and handling the minor style comment from @AThousandShips. Then this should be ready to merge :)

Done.

[akien-mga]

Thanks!

[markofjohnson]

Great, thank you! Looking forward to the methods overview panel part down the road.