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

Hi Alan,

From:  Alan Gresley <alan@css-class.com>
Date:  Thu, 6 Oct 2011 04:15:17 -0700
To:  "robert@ocallahan.org" <robert@ocallahan.org>
Cc:  Charles Pritchard <chuck@jumis.com>, Adobe Systems
<vhardy@adobe.com>, "www-style@w3.org CSS" <www-style@w3.org>,
"public-fx@w3.org" <public-fx@w3.org>, SVG WG <public-svg-wg@w3.org>
Subject:  Re: [css-shaders] CSS shaders for custom filters (ACTION-3072)


>On 6/10/2011 3:51 PM, Robert O'Callahan wrote:
>> On Thu, Oct 6, 2011 at 5:37 PM, Charles Pritchard<chuck@jumis.com>
>>wrote:
>>
>>> As an author, I will have to write additional code to manage extent
>>> information on a filter that is applying a user-controlled
>>>displacement map
>>> .
>>>
>>
>> That code can be extremely hard to write, and if written the obvious
>>way it
>> repeats the content of the vertex shader.
>>
>> I really want to find a way to automate this.
>>
>> Rob
>
>I envisioning issues when filter effects are applied after user events
>like :hover. Dean mentioned :hover in the companion thread [1] (somehow
>this thread got split).
>
>

>> What type of issues are you envisioning? In our prototype
>>implementations, we have shaders and filters working very well with
>>transitions and animations, and in particular on effects such as :hover.
>>For example:

#my_elem {
	filter: grayscale(1);
	transition-property: filter;
}

#my_elem:hover {
	filter: grayscale(0);
}

same thing with the custom() filter function that CSS shaders proposes.

>
>How does a coordinate transform API (if I using correct terminology)
>maps when a filter effect is applied with an event like :hover?
>
>
>
>Are filters transitional? If so, how is any mapping and the timing of a
>transition (or animation) sequenced?
>
>

I am not clear on the proposed transform API discussed here, so I will not
comment on that.
The filter property is animatable, just like other properties such as
'width' or 'transform'. It is one of the sophisticated properties, but as
in the example above, the propety is subject to the same controls as those
found on other properties.

For example:

#my_elem {
	filter: custom(url(wrap.vs), amount: 0, angle: 0);
	transition: filter;
}

#my_elem:hover {
	filter: custom(url(wrap.vs, amount: 1, angle: 90);
}


>
>I believe that before anything is developed fully, much testing with
>animation and transforms must be done. Dean mentioned testing with
>animation on webkit-dev [2].
>
>I can help with this (testing with animation and transforms) but I still
>trying to get one filter to work. The code in example 3 of 3.2.1 for CSS
>Shaders is foreign to me. For me I would expect to use something like
>this code.
>
>filter: url(distort.svg#distort);

This would work in the Filter Effects implementation when it becomes
available. The example 3 you reference is for the custom filters that CSS
shaders provide. This is the proposed addition to Filter Effects.

>
>Also, is a vendor prefix required like -webkit-filter?

Yes, the vendor prefix is used in the prototype implementation we have
done at Adobe and in the work Dean is doing. We will merge these efforts
(Dean's work on Filter Effects and our work on CSS shaders) if/when the
CSS shader proposal is integrated in the Filter Effects specification,
which is something the FX task force will talk about at the TPAC meeting
(or may be earlier if we have a conference call).

Kind regards,
Vincent

>
>Alan
>
>
>1. http://lists.w3.org/Archives/Public/www-style/2011Oct/0092.html
>2. 
>https://lists.webkit.org/pipermail/webkit-dev/2011-September/018034.html
>3. 
>https://dvcs.w3.org/hg/FXTF/raw-file/tip/custom/index.html#vertexMesh-attr
>ibute
>
>
>-- 
>Alan Gresley
>http://css-3d.org/
>http://css-class.com/
>
>
>

Received on Thursday, 6 October 2011 16:05:19 UTC