Gradient direction specification

Submitted by tigress298 on Mon, 02/08/2010 - 21:12

Can one specify the direction of the gradient in liquid canvas? If so, how? If not, are there plans to incorporate that?

Trackback URL for this post:

http://www.ruzee.com/trackback/281
‹ Is a background image possible Ie6 canvas moved to the right ›

I figured it out.

Submitted by tigress298 on Tue, 02/09/2010 - 19:12.

$.registerLiquidCanvasPlugin({
name: "gradient",
defaultOpts: { from: "#fff", to:"#666", direction:"v" },
paint: function(area) {
var grad;
if (this.opts.direction == "h") {
grad = area.ctx.createLinearGradient(0, 0, area.width, 0);
}
else if (this.opts.direction == "d") {
grad = area.ctx.createLinearGradient(0, 0, area.width, area.height);
}
else {
grad = area.ctx.createLinearGradient(0, 0, 0, area.height);
}
grad.addColorStop(0, this.opts.from);
grad.addColorStop(1, this.opts.to);
area.ctx.fillStyle = grad;
this.action.paint(area);
area.ctx.fill();
}
});