About

Fold Types is a VSCode extension that provides commands to fold enabled types (classes, functions, arrays, etc...) recursively from any point in the document rather than folding levels to provide a more intuitive method of folding. Types can be enabled or disabled in the extension settings based on syntax (php, js, etc..) to match your desired folding needs.

When calling a fold-type command, enabled types will fold recursively leaving all other disabled types un-collapsed providing faster navigation to code that you are looking for. You can fold recursively throughout the entire document (fold all) or from within a single parent (fold parent/fold children) that will only fold enabled types recursively inside the parent leaving everything out side of it untouched.

Supported Languages

There is no VSCode API to get fold points or types so syntax checking and pattern matching are all done manually. As a result, only certain languages (the ones I use) are currently supported.

• HTML
• CSS
• Javascript
• PHP
• PHP (Mixed HTML, JS, CSS)

While this has been heavily tested to catch all patterns, there may be some outliers that fell through the cracks. If you notice something fold that shouldn't or something not fold that should please submit a bug request and I will look into it as soon as possible. Also if there is a language not supported and I get enough requests that make it worth the time to add I will take the time to learn the syntax and patterns and add them.

Example

Example setting that demonstrates folding effect with "fold-types.php.class" set to false.

{
 "fold-types.php.class" : false
}

With "fold-types.php.class" set to false, when the "fold-types.fold-all" command is executed, only the functions are folded leaving the class un-collapsed allowing for a faster, intuitive navigation to the code you are trying to find.

Commands

Fold

fold-types.fold-all

Folds all enabled types recursively through out the entire document.

fold-types.fold-parent

Folds all enabled types recursively through out the parent block only as well as collapsing the parent its self.

fold-types.fold-children

Folds all enabled types recursively through out the parent block only but leaves the parent block un-collapsed.

fold-types.fold-children-all-types

Special command to ignore rules and fold all children recursively regardless of type leaving the parent block un-collapsed.

Unfold

fold-types.unfold-parent

Unfolds all types regardless of type inside the parent as well as unfolding the parent is self.

You can and should still use the existing editor.unfoldAll command to unfold the entire document.

How to use

Type "Fold Types" in the command palette to find the commands but its recommended you assign hot keys.

Configuration Settings

Fold Types comes configured with a few enabled types that I feel to be the most intuitive items to be folded but almost any type can configured to be folded or ignored based on your needs.

JS

• fold-types.js.class
• fold-types.js.method (default enabled)
• fold-types.js.interface
• fold-types.js.object (default enabled)
• fold-types.js.objectFunctionParam (Matches objects passed as parameters to functions)
• fold-types.js.objectObjectParam (default enabled) (Matches objects inside other objects)
• fold-types.js.array (default enabled)
• fold-types.js.arrayFunctionParam (Matches arrays passed as parameters to functions)
• fold-types.js.arrayObjectParam (default enabled) (Matches arrays inside other objects)
• fold-types.js.while
• fold-types.js.if
• fold-types.js.else
• fold-types.js.for
• fold-types.js.switch
• fold-types.js.switchCase (default enabled)
• fold-types.js.switchDefault
• fold-types.js.try
• fold-types.js.tryCatch
• fold-types.js.tryFinally
• fold-types.js.comment

PHP

• fold-types.php.class
• fold-types.php.method (default enabled)
• fold-types.php.interface
• fold-types.php.array (default enabled)
• fold-types.php.arrayFunctionParam (Matches arrays passed as parameters to functions)
• fold-types.php.arrayObjectParam (default enabled) (Matches arrays inside other arrays)
• fold-types.php.while
• fold-types.php.if
• fold-types.php.else
• fold-types.php.for (Includes foreach)
• fold-types.php.switch
• fold-types.php.switchCase (default enabled)
• fold-types.php.switchDefault
• fold-types.php.try
• fold-types.php.tryCatch
• fold-types.php.tryFinally
• fold-types.php.comment

HTML

Only the most common tags have been included but if there are some that the community wants they can be added later.

• fold-types.html.head
• fold-types.html.body
• fold-types.html.div
• fold-types.html.section
• fold-types.html.ul
• fold-types.html.a
• fold-types.html.select
• fold-types.html.button
• fold-types.html.script
• fold-types.html.style
• fold-types.html.table
• fold-types.html.tableTbody
• fold-types.html.tableThead
• fold-types.html.tableTfoot
• fold-types.html.tableTr (default enabled)
• fold-types.html.tableTd (default enabled) (Includes <th>)
• fold-types.html.comment
• fold-types.html.idAttribute (default enabled) (Special: Folds any tag that has an id="" attribute set)

CSS

• fold-types.css.block (default enabled)
• fold-types.css.comment

How to configure settings

The easiest way to configure enabled types is to right click on the extension in your extensions list and select "Extension Settings".