The nature of a textarea is simple. It's all about how to render the screen with a proper driver. However the number of variables needed for this operation was too many for my little brain to comprehend. So I am using this article to aid my thinking.

To begin, I need to figured out what variables may affect the position of the highlighted area:

vPos refers to visual position, which is our screen. This is equal to the value of the textarea.
aPos refers to the actual position, which is the editing document.
Current Position is the current cursor position.
Start Position is the position of cursor when entering VISUAL mode.
Blue highlights refers to scenario 1
Purple highlights refers to scenario 2

Concept

The internal working of the text uses aPos, but the highlighted area is based on vPos. A *selection* is the highlight of the selected area. The entire play is to translate the aPos to vPos using available contents.

LineBuffers

Instead of a fixed line length in terminal does, the length of each LineBuffer¹ are different. The reason a LineBuffer cannot give padding spaces is because we cannot have multiple highlight in a textarea. Thus makes each line does not start with a pretty number. So calculating position with number of columes * line number  would not work.

Scenario 1

The starting position of the cursor is outside of the screen. But to determine whether the starting aPos is really outside of screen. I need to know what is the aPos of vPos at 0 ( lower limit ). Note that the current aPos is always in the screen. So the calculate this I need to know the absolute distance between lower limit and the vPos at current aPos:

The current line can be retrieved via the cursor. But because of word wrapping, the line retrieved is always the start buffer of a given line. The cursor X is the position of residing line start. But again because of word wrapping, X is not an absolute offset².

The absolute offset of lower limit could be retrieved fairly quickly by iterating through the actual lines with indexOf method.

Scenario 2

This is basically the same as scenario 1 with the offset sum to bottom of visible lines then add the line offset aX³ to get the upper limit.

If the current position is lager the upper limit, highlight from the end.
If the current position it is lower then the lower limit, highlight from the start.

Scenario 3

This is not illustrated but it could be easily determine that this remaining scenario is the start position is within bounds. Which is just summing the line offset to the starting line.

VISUAL LINE

The visual line is just an extension of visual which includes the line start and line end motion before the start position and after the current position depends on the relative position between start and end.

The next is to implement the auto indentation feature.