Support text background (for text selection)

[felixmariotto]

Planes should be added to all instances of Text, so that it's possible to control the text background with an attribute. It would also help with raycasting on the text.

I'm not really sure how it can be integrated in the code and the API though.

related : #1

[swingingtom]

During the implementation of white-space #120 , I built an advanced demo that required that the lines property of InlineManager was published.

If this lines property stays published, this could be the entry point of textselection and textbackground without the need to overhead any text component with additional planes.

This was done within onAfterUpdate

text.onAfterUpdate = function () {

            if( text.children.length == 0 ) return;

            // retrieve all lines sent by InlineManager for the textBlock
            for (let i = 0; i < text.parent.lines.length; i++) {
                  const line = text.parent.lines[i]
                  // add a background here  with line.x, line.y, line.width, line.height
                  // choose to place it before or behind the text component
                 // its color, its blendmode, etc...
            }
}

If we can get multiple onAfterUpdate on the same component, we could externalize behaviour to components

const textBlock = new ThreeMeshUI.Block({});
ThreeMeshUI.SelecteableBehaviour( textBlock , options );

Then a raycast on the textBlock could compare its interesected position to any inline positions contained in textBlock.lines[i]

[EDIT] : Without the need to push Selecteable logic into three-mesh-ui core components. They will be open to.

[felixmariotto]

Well yes this may be a good way of accessing the objects from an API point of view.

I suggested that we would need a second set of planes because currently all the planes have different shapes and sizes depending on the character they map.

When you select text in your browser for instance, the text background highlighting the selection has constant height, wether you select a "o" or a "P". So we can't just color the background in the text shader...

Unless we update MSDFGlyph to output quads of constant height, and update the text shader to discard the parts of the quads that would overlap other characters of the MSDF texture (in order to not see a bit of "p" above the "o" for instance)

[swingingtom]

@felixmariotto indeed. I didn't correctly understand it at first.

This idea was to put fresh feedback on this previous issue.