Re: [CSSOM] Revisiting transforms and getBoundingClientRect()

On Sep 8, 2011, at 10:29 PM, Robert O'Callahan wrote:

> On Fri, Sep 9, 2011 at 7:01 AM, Simon Fraser <smfr@me.com> wrote:
> Sure. With all these new point/quad methods, maybe we should bite the bullet and have a WebPoint class with x, y members. Then WebQuad can have 4 WebPoints.
> 
> The poorly-named ClientRect should become WebRect.
> 
> I don't think we should have "Web" prefixes on Web APIs. If we need a prefix, maybe CSSRect.

Even when the same APIs should work for SVG elements, which have a non pixel-based coordinate system?

In SVG, we'd also have to think about mapping between the SVG coordinate space and that of the enclosing HTML (if any), and vice-versa with <foreignobject>.

> 
> > Having a variety of functions for the content, padding and margin rects seems like overkill; I would prefer one or two "bottleneck" quad mapping functions with helper methods to get the various boxes for a given element.
> >
> > I'm not quite sure what you mean. Can you suggest something?
> 
> The basic pieces seem to be:
> 
> 1. Get an element's padding, content, border and margin boxes relative to its own border-box, as rects.
> 2. Convert a rect to a quad.
> 3. Map arbitrary point from one element to another.
> 4. Map arbitrary quad from one element to another (mapping 4 points)
> 
> We should make sure each of these steps is available to web developers, possibly with the addition of convenience wrappers.
> 
> That suggests:
> 
>  const CONTENT_BOX;
>  const PADDING_BOX;
>  const BORDER_BOX;
>  const MARGIN_BOX;
>  WebRectList element.localBoxes(boxType); // relative to border-box of first box.
> 
> Quad to rect conversions:
>  WebQuad rect.toQuad();
>  WebRect quad.boundingRect();
> 
> Would be nice to have a way to convert a WebRectList to a WebQuadList.
> 
>  WebPoint element.mapPoint(WebPoint, [relativeTo])  // point is border-box relative on both ends.
>  WebQuad element.mapQuad(WebQuad, [relativeTo]) // quads are border-box relative on both eneds
>  WebQuadList element.mapQuads(WebQuadList, [relativeTo]) // ditto
> 
> That breakdown makes a lot of sense. I'd bikeshed a little over the syntax for localBoxes() and boundingRect(). We should definitely use multiple methods instead of a boxType parameter IMHO.

I'm OK with multiple methods to just get the local foo box for an element; they could actually just be properties.

Simon