Added capability to select a row in TextTable

[Digicrat]

The ability to select rows in tables enables a lot of functionality for more complicated UIs. This could potentially be extended with equivalent functions for selecting columns, cells, or even ranges, but I've only implemented the basic row selection ability that meets my current needs.

Defined selectedRowTextAttr to define how to display the selected row, and the methods selectRow(idx), selectNextRow() and selectPrevRow(). I've also updated the text-table-test.js sample to reflect this new functionality.

[cronvel]

Hi @Digicrat,

What is exactly the purpose of selecting it? I failed to see the benefit of highlighting a row without being able to do anything with it.

By the way the current PR does not work, just tested it with the sample code and it breaks the table layout.

[Digicrat]

The usage is as a building block for larger applications, which can retrieve the currently selected row with textTable.selectedRow.

For my target application, I intend on splitting the screen with a table taking up half the screen, and the other half showing details related to the currently selected row. In my initial test, that is triggered with the keypress, potentially with different behavior when the 'enter' key is pressed vs just adjusting the selection.

I'll think about expanding the demo with a simple use case. Admittedly the API could probably be improved with a proper getter function and maybe emitting an event when the selection changes.

It was working for me .. though retrying it now I do see where it's breaking. It looks to be some sort of conflict with the delayed "setCellContent" call in the original example. If a row is selected before that call is triggered, it looks to get confused when redrawing the table, but works fine if you don't press an arrow key until after that event. I'll have to experiment some more to figure out where/why that's breaking.

[Digicrat]

For selecting a row, I simply called initChildren() to get it to redraw the borders, but that seems to be causing issues as it is actually creating new child objects, which is presumably the cause for the inconsistent output.

It looks like I'll need to define a new updateChildren() function (or similar) that updates the existing TextBox's with the new attr instead of erroneously re-creating them. Or I suppose I could explicitly destroy the existing objects before calling initChildren, but that just feels messy.

Is there a method to refresh the textAttr field on an already instantiated TextBox? The only obvious method I'm seeing would be to explicitly call setContent on each cell of the affected rows with the same content after updating textTable.textBoxes[y][x].textAttr.

[cronvel]

@Digicrat It's way better to update TextBuffer instances. If there isn't per-character styles on the content, simply use .setAttrRegion() to fill the attributes. If not, then it is possible to change the default attr, then set the content using the original string with its markup.

Anyway, it's probably better to inherit from TextTable, rather than modifying it, or maybe to make TextBox highlightable... I don't know... but the API needs to be great for this to land on master.

[cronvel]

@Digicrat As of v2.1.0, there are new methods for TextTable allowing one to change and reset attribute of cells, rows, columns or even whole table (see the doc).

There is not your previous/next row mechanism, but I think it's better to keep that part for userland code at the moment (not enough generic for the lib). Plus it's fairly easy to implement.

E.g.: to hilight the row 2: textTable.setRowAttr( 2 , { bgColor: 'cyan' } ), to unhilight it: textTable.resetRowAttr( 2 ). See the related sample code.