1. Its not a basic opacity, if you notice the finishy attribute. This is to
replicate a reflection
To clarify the MooFlow code works perfect in 1.2 on all browsers. When
moving to 1.2.1 it breaks only on FF.
I haven't dug into the exact cause yet as I don't have time. I will
investigate later. I was posting to see if anyone has come across any
similar issues.
If I find more, will post.
On Sun, Nov 2, 2008 at 9:04 AM, Steve Onnis <[EMAIL PROTECTED]> wrote:
> why are you using the Microsoft filter? just call i.setOpacity(.2), or
> even better..
>
> i.setStyles( {opacity:0.2, width:"100%", height:"100%"})
>
> ------------------------------
> *From:* [email protected] [mailto:
> [EMAIL PROTECTED] *On Behalf Of *nwhite
> *Sent:* Sunday, 2 November 2008 9:25 AM
> *To:* [email protected]
> *Subject:* 1.2.1 canvas issue?
>
> I've been playing around with MooFlow (
> http://www.outcut.de/MooFlow/MooFlow.html ).
>
> The demo works great. I can port it over exactly and it works fine. If I
> use 1.2.1 build it works fine in Safari, IE but explodes in FF/Mac.
>
> Here is the message I get.
>
> uncaught exception: [Exception... "Component returned failure code:
> 0x80040111 (NS_ERROR_NOT_AVAILABLE)
> [nsIDOMCanvasRenderingContext2D.drawImage]" nsresult: "0x80040111
> (NS_ERROR_NOT_AVAILABLE)" location: "JS frame ::
> http://nathan.propertymaps.com/idx_mapplet/js/MooFlow.js?id=1225575733 ::
> anonymous :: line 410" data: no]
>
> It appears to be breaking here, anyone have any insight?
>
> Element.implement({
> reflect: function(arg){
> i = arg.img.clone();
> if(Browser.Engine.trident){
> i.style.filter = 'flipv
> progid:DXImageTransform.Microsoft.Alpha(opacity=20, style=1,
> finishOpacity=0, startx=0, starty=0, finishx=0, finishy='+100*arg.ref+')';
> i.setStyles({'width':'100%', 'height':'100%'});
> return new Element('div').adopt(i);
> } else {
> var can = new
> Element('canvas').setProperties({'width':arg.width, 'height':arg.height});
> if(can.getContext){
> var ctx = can.getContext("2d");
> ctx.save();
> ctx.translate(0,arg.height-1);
> ctx.scale(1,-1);
> ctx.drawImage(i, 0, 0, arg.width, arg.height);
> ctx.restore();
> ctx.globalCompositeOperation = "destination-out";
> ctx.fillStyle = arg.color;
> ctx.fillRect(0, arg.height*0.5, arg.width, arg.height);
> var gra = ctx.createLinearGradient(0, 0, 0,
> arg.height*arg.ref);
> gra.addColorStop(1, "rgba(255, 255, 255, 1.0)");
> gra.addColorStop(0, "rgba(255, 255, 255,
> "+(1-arg.ref)+")");
> ctx.fillStyle = gra;
> ctx.rect(0, 0, arg.width, arg.height);
> ctx.fill();
> delete ctx, gra;
> }
> return can;
> }
> }
> });
>
