Indentation-based Folding for TextMate

Question

SASS and HAML have indentation-based syntax, much like Python. Blocks of related code have the same number of spaces at the start of a line.

Here's some example code:

#drawer
  height: 100%
  color: #c2c7c4
  font:
    size: 10px
  .slider
    overflow: hidden
    height: 100%
    .edge
      background: url('/images/foo') repeat-y
      .tab
        margin-top = !drawer_top
        width: 56px
        height: 161px
        display: block

I'm using phuibonhoa's SASS bundle, and I'd like to enhance it so that the various sections can fold. For instance, I'd like to fold everything under #drawer, everything under .slider, everything under .edge, etc.

The bundle currently includes the following folding code:

foldingStartMarker = '/\*|^#|^\*|^\b|^\.';
foldingStopMarker = '\*/|^\s*$';

How can I enhance this to fold similarly-indented blocks?

Answer 1

Try changing:

foldingStartMarker = '/\*|^#|^\*|^\b|^\.';

To:

foldingStartMarker = '/\*|^#|^\*|^\b|^\s*\.';

That allows for an arbitrary number of spaces between the start of the line and the first . for the folding start point.

The end point is trickier. I'm afraid I don't have a good end point expression for you. This looks like it's similar to python, where blocks are grouped by indentation level. I wonder if the Python bundle could help here? They start and end fold expressions for Python are:

foldingStartMarker = '(/\*|\{|\()';
foldingStopMarker = '(\*/|\}|\))';

Not sure if those would work for you or not.