- From: fantasai <fantasai.lists@inkedblade.net>
- Date: Tue, 17 Nov 2009 15:47:58 -0800
- To: www-style@w3.org
Drop Shadows and Filter Effects
-------------------------------
- Discussed drop shadows and what an inner shadow is
Tab: the shadow is cast by a negative of the alpha channel, then clipped
to the actual alpha channel
- Discussed applying effects like drop shadows and opacity to different parts.
http://lists.w3.org/Archives/Public/www-style/2009Oct/0071.html
fantasai: The pieces we'd need to address, in various combinations:
background layers, border (one piece), content (one piece)
Only adjacent layers would need to be composited together. Drop shadows
would then paint immediately below the composited layer.
- It seems likely the SVG filters spec and the 'filter' property
http://dev.w3.org/SVG/modules/filters/publish/SVGFilter.html
would be able to address these use cases particularly if parametrized
canned filters were added for commonly desired effects and CSS targets
were added e.g. as described by roc in
http://lists.w3.org/Archives/Public/www-style/2009Oct/0072.html
- This topic will be further discussed with the SVGWG possibly on
http://lists.w3.org/Archives/Public/public-fx/
====== Full minutes below ======
Gradients and Image Sprites
---------------------------
Arron: recall this had to but not sure what it is
dbaron: Who added it
Tab: Not sure what it means either
(we are all confused)
Tab: Asked Shepazu to help with SVG equivalents of the gradient examples
... for sprites, its choosing between options
fantasai: I just linked to the various proposals
dbaron: We implemented -moz-image-rect
fantasai: the URI based syntax has no fallback. Could add fallback behavior
by putting in the image() notation and requiring that impls that
support image() notation support the url notation
fantasai: no need for a separate functional notation.
fantasai: waiting for media fragments wg to publish a spec
fantasai: Image sprites would make it more efficient that specifying
explicit coords everywhere in the stylesheet
fantasai: not so much to discuss right now therefore
Simon: I have some feedback, will send on list
ACTION: Simon to send gradients feedback to www-style
Drop shadows and Filter Effects
-------------------------------
<bradk> http://www.bradclicks.com/cssplay/drop-shadow/Drop-Shadow.html
(Brad demonstrates)
Brad: we want something that casts a shadow under the element, casts
from background and border
Brad: transparency affects the color of the shadow where it overlaps. based
on alpha channel
(Brad fiddles with the drop shadow dialog in photoshop)
Brad: shadow has translucency
... inner version of a shadow
Chris: Please define how you are using the term inner
Brad: the shape is cut out of the background and the shadow is on that
Chris: the shadow is in fact still on top
Brad: yes
(we discover the projector really needs color management)
Brad: so this is easy with sharp edges. with soft edges people seemed
to be confused
Chris: its the same copy, remove color, add color, blur, opacity operation
Chris: notice you are using blending modes - svg has those
(discussion on what exactly is happening in photoshop as people get their
heads around it)
Simon: Easier to look at the actual proposal
Tab: the shadow is cast by a negative of the alpha channel, then clipped
to the actual alphs channel
John: what is the use case for this?
... the photoshop is not convincing me of the utility
fantasai: We have box shadows already
dbaron: And we implement that, but lets decide if this part is useful
before deciding exactly how it works
(brad demonstrates inner shadow on text)
Simon: With box and text shadow, the shadow does not depend on the
transparency of the element
Simon: fully transparent text still casts a shadow, with text-shadow
Brad: suppose you want just the border, or the background, or *one*
of the backgrounds shaddowed
Simon: That seems more useful in the filters discussion
<bradk> apply-to(border + foreground, background-image + background-color)
<bradk> apply-to(border + foreground, background-image + background-color)
<bradk> apply-to(border + foreground, background-image + background-color)
Brad: pluses mean the shapes composite before shadow calculation,
commas mean they each have their own shadow
dbaron: apply-to gives the z-order?
dbaron: what if you apply to things that are not z-ordered together?
fantasai: you can't composite the text and the background and paint
onto the border
Simon: this is trying to get photoshop into css, i don't see the use
case. Separate elements can be used to do this
John: This sort of effect is better done in SVG, we don't need another
language to do this. its a complex mechanism that duplicates
something which already exists
fantasai: So SVG filters can be used but we lack the ability to select
parts of the element
John: If the goal is to do something this complex, is CSS the right
language?
Chris: We are headed for a fairly complex selector model if we do
this, to get at parts of the border
fantasai: getting the whole border would be sufficient, but we need to
address the different background layers
<bradk> ::apply-to(border + foreground, background-image + background-color)
Chris: could imageine pseudo elements to address the border, the
background(s) and the content
<fantasai> Then how do you turn it off?
<fantasai> How many pseudo-elements do you need to write to turn it off?
dbaron: I don't think this is the right way to do it...
Brad: just targetting the whole border would satisfy my needs
fantasai: The pieces we'd need to address, in various combinations:
background layers, border (one piece), content (one piece)
Brad: we don't want to implement all of svg in css, sure. We want to
be able to use parts of them
dbaron: we already do SVG filters on any element
Brad: but only the whole element at once
dbaron: add to source-graphic source-alpha etc to add source-border,
source-background ......
dbaron attempts to summarize how svg filters work
<smfr> http://www.w3.org/TR/SVG/filters.html#FilterPrimitivesOverview
<smfr> (scroll down)
Simon: fill-apint and stroke-paint
dbaron: things to address the border, background or contents
Tab: Could we use parameters with that
Chris: Sure
<fantasai> http://lists.w3.org/Archives/Public/www-style/2009Oct/0072.html
fantasai: need a way to parameterise that so we have a library of effects
and apply them, without writing new filters
Simon: background image in SVG is what has already been painted by
other elements
fantasai: roc has some name suggestions
Chris: please pass those on to the SVG WG. The editor is Erik Dahlstrom
from Opera. We can add them
David: Put them in the order you want and thats how they end up
<shepazu> [I'd be happy to talk to the CSS about my SVG parameters
specification, which could pass parameters through a CSS property]
<jdaggett> shepazu: cmon down dear
fantasai: does not make sense for a border to cast a shadow *under*
the background
<fantasai> border casts a shadow immediately under the border, i.e.
over the background
Brad: we should retain the natural stacking order
<fantasai> if border and background are composited, then their shadow
casts underneath the composited layer
<fantasai> i.e. directly underneath the background
(discussion on how to pass opacity to a filter)
Simon: how to get the output of the filter in the right place
Shepazu: we are adding more canned filter effects, we could add more
if you identify the cases. Adds a merge for the border etc
fantasai: a filter to make the border and background partly transparent
Shepazu: filters can be computationally intensive. Though canned
filters can be optimised. need to warn authors
Tab: Yes
... but won't trigger unexpectedly. Its clearly an opt-in
Shepazu: Need to make a tradeoff between power, speed and authoring ease
Simon: want to see blur and colour manip filters
Shepazu: sepia, b&w
Brad: so value in having a simple drop shadow?
http://www.bradclicks.com/cssplay/drop-shadow/Drop-Shadow.html
Shepazu: need review from Erik and Anthony
Brad: syntax there is more similar to the existing box-shadow property.
Illustrations were done in photoshop
Shepazu: Need to discuss, only now introducing canned filter effects
so open to syntax that makes sense for CSS authors
(we look at inner shadow on text again)
Simon: for canned filters we would likely go to core graphics
fantasai: happy to join any SVG telcons about this
<ChrisL> filters spec is here http://dev.w3.org/SVG/modules/filters/publish/SVGFilter.html
<dbaron> http://lists.w3.org/Archives/Public/public-fx/
Shepazu: there is a public-fx@w3.org list for SVG+CSS cross-WG discussions
http://lists.w3.org/Archives/Public/public-fx/
Chris: canned effects are great, though people should be able to use
arbitrary filters as well
F2f dates, the re-re-run
------------------------
SteveZ: the proposed dates clash with the AB meeting. next week would be fine
Now moved to Cupertino, 29-31 March 2010
SVG Params
----------
(Doug walks through http://dev.w3.org/SVG/modules/param/master/SVGParamPrimer.html )
David, PLH: using ? in the URI mesans its server side, not client side
foo.svg#param(name, value; name,value)
<dbaron> might you want to svg:use foo.svg#element with parameters?
john: is there an expression language?
shepazu: not yet
<Bert_lap> (Use an SVG file that consists of "param(x)" and nothing more,
than pass <param name=x value="A bit of SVG..."> :-) )
Peter: would be great to pass in the currently cascaded color for example
* dbaron wonders if we're taking a break now?
adjourned!
<ChrisL> rrsagent, make minutes
<RRSAgent> I have made the request to generate http://www.w3.org/2009/11/03-CSS-minutes.html ChrisL
[after-hours]
<dbaron> ok, I updated the issues list and http://wiki.csswg.org/spec/css3-color
should now be current
<dbaron> I think it has almost exactly the same number of issues as the
last draft
<dbaron> although a decent number of them are repeats
<fantasai> Bert: http://dev.w3.org/csswg/selectors3/issues-lc-2009
<fantasai> Bert: http://www.w3.org/Style/CSS/Test/CSS3/Selectors/20091025/reports/
Received on Tuesday, 17 November 2009 23:48:41 UTC