Stick first line of focused code block to top, for better orientation

[asafm7]

Description

When the cursor is in a code block, stick the first line of the block to the top when scrolling beyond it for easier orientation. If possible, do the same for nested blocks.

I've seen it in other IDEs. I thought I had also seen it in NetBeans, but I couldn't find anything like it in the settings.

Use case/motivation

I'm looking for an easier understanding of the context within long code blocks.

Related issues

No response

Are you willing to submit a pull request?

No

[Chris2011]

It is not quite the same in NetBeans, but sometimes, I think when you set the cursor to the last closing bracket. It is not the same, I know but to say we have a similar feature and we can improve this. I really like the idea of it and yes it is very handy. Like it in VS Code.

[mbien]

i think this is essentially covered by the classic "breadcrumbs" bar. Maybe an option to move it to the top of the editor would make it easier to use on larger screens.

[Chris2011]

This is more what was looking for, the breadcrumbs are different from this. It shows the whole path from the beginning to the end,

[mbien]

yes I do understand the suggestion. It is semantically equivalent of the breadcrumbs bar, just with reduced functionality.

The main difference is that the breadcrumbs bar is listening to the cursor position. This would render the first line of the clipped block which doesn't fit in the viewport. However, realistically this likely would have to be implemented using a delayed action just like the breadcrumbs bar. So I don't see why it couldn't be used right away for this.

[asafm7]

Thanks, @mbien, @Chris2011.

I wasn't aware of the breadcrumb. It is close to what I was looking for, but not quite. Its location isn't optimal. For example, the search bar might buffer between the breadcrumb and the document:

Having the option to move it to the top might bring it closer to what I had in mind.

Also, with native CSS nesting, the breadcrumb only shows the top level:

Is it by design or should I consider it a bug?

[Chris2011]

@asafm7 it is just not implemented. When it was implemented, there where no nesting in CSS. You can try scss also whether this is working or not. But it will be a new feautre request, instead of a bug.

[asafm7]

Thanks, @Chris2011.

What about the option to change the position of the breadcrumb?

[Chris2011]

Sure, but as I said this not fixes the FR request for me either. We have the calculation of when a block goes out of the viewport we just need to stick this to the top. Adding option to move Breadcrumb around is a different FR.

[asafm7]

@Chris2011 I agree.

It will be great to have it as a standalone feature. It will be more clear, useful and intuitive.

As you mentioned, when standing on a closing bracket of a top-level block it already happens (the line of the opening bracket sticks to the top) - so the feature is already there, just needs some tweaking.

A couple of notes though:

• The current implementation sticks the line of the opening bracket to the top. Depending on the formatting, this might be useless as this line may contain only the opening bracket.

For example, if CSS is formatted this way:

p 
{
  color: red;
  text-align: center;
}

The line that sticks to the top is:

{

• The current implementation only sticks top-level opening brackets to the top. It might be worth considering doing the same with nested blocks.

[Chris2011]

I tested your css case in vs code and it also shows just { when you have a new line after the selector. But we don't need to make the same error I justed wanted to have a look how vs code this does. Tomorrow I will also check IntelliJ.

[asafm7]

Thanks, @Chris2011.

I assume many platforms didn't consider the case of CSS for this feature, as traditional CSS usually have short blocks. It is relevant though, to SCSS, LESS etc, and it will become even more relevant with the new native CSS nesting.

Let me know if there is anything I can do to help.

[Chris2011]

@asafm7 honestly if you are familar with java just have a look into the code. I can try to help to identify the code part where it is. Also your first PR could be to add the option to move the breadcrumb around. What do you think?

[asafm7]

Thanks, @Chris2011. Unfortunately, I'm a web developer and not familiar with Java.

BTW, I just noticed that GitHub is doing it nicely, also for nested blocks:

[Chris2011]

@asafm7 Sure, but did you also check css and also when the bracket is on the new line? I would say let's convert this into a discussion so that we can discuss more, what is not related to this ticket here.

[asafm7]

👍 Sounds good