[whatwg] [canvas] inner shadows

[Ian Hickson]

On Fri, 23 Nov 2012, Rik Cabanier wrote:
> >
> > Turns out it's relatively easy to do today in canvas; after you've 
> > drawn your shape and filled it, just add the following code:
> >
> >   c.save();
> >   c.clip();
> >   c.moveTo(0,0);
> >   c.lineTo(0,height);
> >   c.lineTo(width,height);
> >   c.lineTo(width,0);
> >   c.closePath();
> >   c.shadowColor = 'black';
> >   c.shadowBlur = 30;
> >   c.fill();
> >   c.restore();
> 
> I don't think that will work. Shadows are calculated before clipping so 
> they don't follow the clipping path.

What matters is how they're painted, and that does follow the clipping 
path, as far as I can tell (step 4 of the drawing model).


> Even if it was right, it would only apply to shapes and only if those 
> shapes didn't have strokes and were completely opaque.

That's easy enough, though, you only need to make a shape that is what you 
want the inner shadow to go over, and then set the fill to black (or 
anything completely opaque). It's even easier with the new Path primitives 
since you can construct a combined path by stroking them all into one.

-- 
Ian Hickson               U+1047E                )\._.,--....,'``.    fL
http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'