W3C home > Mailing lists > Public > www-style@w3.org > October 2011

Re: [css-shaders] CSS shaders for custom filters (ACTION-3072)

From: Alan Gresley <alan@css-class.com>
Date: Tue, 04 Oct 2011 17:20:20 +1100
Message-ID: <4E8AA5A4.9060404@css-class.com>
To: "Gregg Tavares (wrk)" <gman@google.com>
CC: Charles Pritchard <chuck@jumis.com>, "www-style@w3.org" <www-style@w3.org>
On 4/10/2011 8:33 AM, Gregg Tavares (wrk) wrote:
> On Mon, Oct 3, 2011 at 2:23 PM, Charles Pritchard<chuck@jumis.com>  wrote:
>> On Oct 3, 2011, at 1:16 PM, "Gregg Tavares (wrk)"<gman@google.com>  wrote:
>> What about mouse input?
>> It seems like for this proposal to actually work as other CSS works
>> you'd need to run mouse and touch events through the vertex shader so
>> that you get the mouse coordinates translated through the shader.
>> Yes? No?
>> CSSMatrix and transform3d are a good start. A method returning a CSSMatrix
>> object may be enough.
>> The following would help me to track elements and mouse clicks:
>> CSSMatrix getMatrixFromBounds(x,y,[optional] width, height)
>> 1. Use the canvas width and height as the limits, 2, return a css matrix.
>> The author is responsible for using the matrix to translate points.
> I think maybe I didn't make my point clear. As far as I know, CSS is live. I
> can take an iframe of an entire page, I can apply CSS to transform it (say
> 45 degrees into the screen), and that page is LIVE. There is no other author
> intervention needed beyond that. You can see an example here
> http://www.html5rocks.com/en/tutorials/3d/css/
> So, if understand the CSS shader proposal correctly, it's basically to make
> those transformations more under use control. Instead of just orienting a
> plane in 3d space I can now use a vertex shader to morph the HTML into any
> shape I can dream of (see the examples in the proposal of crumpled paper on
> this page http://www.adobe.com/devnet/html5/articles/css-shaders.html)

Currently transforms can not create curved or rounded surfaces of 
elements. This does not mean that what is painted can not shifted in 
location and color thus creating the appearance (perception) of 
curvature of 3D space.

> But, in order for that to work like all other CSS to date (that I know of).
> The browser needs to transform the mouse clicks to match the crumpled paper.
> Those clicks need to go through the same transformations as the vertices so
> find out where in the content on the crumpled paper they are hitting.

I would expect that the UAs would know what has been transformed and 
translated and know how deep something is within the z-axis. The clicks 
of a mouse is only as deep as the z-plane (display device surface) so 
what is really needed is how the translation of something on an X, Y, Z 
matrix with perspective in *3d virtual space* maps to the x and y axises 
of the canvas (extending to infinity within the viewport). The mouse 
click itself does not have to have the same transformations, just a 
mapping of a 2D canvas over 3D virtual space.

Alan Gresley
Received on Tuesday, 4 October 2011 06:21:03 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:05 UTC