Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Default color doesn't take into account transparency #29

Open
Azeirah opened this issue Apr 30, 2017 · 3 comments
Open

Default color doesn't take into account transparency #29

Azeirah opened this issue Apr 30, 2017 · 3 comments

Comments

@Azeirah
Copy link
Contributor

Azeirah commented Apr 30, 2017

var color = Spectra("rgba(255, 0, 0, 0.5)");

ctx.fillStyle = color;
console.log(Spectra(ctx.fillStyle).rgbaString()); // rgba(255,0,0,1)

I would expect the last statement to print "rgba(255,0,0,0.5)".

By far the easiest fix would be to let .toString() equal .rgbaString(). A slightly more sophisticated fix would be to let .toString equal the input type:

function l(c) {
    ctx.fillStyle = c;
    console.log(Spectra(ctx.fillStyle).rgbaString());
}

var c1 = Spectra("rgb(255, 0,  0)");
var c2 = Spectra("hsl(120, 100%, 50%)");
var c3 = Spectra("rgba(255, 0, 0, 0.5)");
l(c1); // "rgb(255, 0, 0)"
l(c2); // "hsl(120, 100%, 50%)");
l(c3); // "rgba(255, 0, 0, 0.5)");
@avp
Copy link
Owner

avp commented Apr 30, 2017

I can't reproduce this; when I try that first statement (with ctx set to {}), I get the correct output.

@Azeirah
Copy link
Contributor Author

Azeirah commented Apr 30, 2017

@AvG Oh it might actually be that I'm running an older version, I'll get back to you in a bit.

@Azeirah
Copy link
Contributor Author

Azeirah commented Apr 30, 2017

@avp The version was not the problem. It's important that you use an actual ctx, since assigning a Spectra color to the ctx calls .toString on that object because it expects a string, doing the same but with a plain object doesn't call toString, since nesting objects is perfectly valid.

See the following two examples, that illustrate the problem even on the currently most recent Spectra v0.2.4. The transparency of the color is definitely lost in interpretation, which is not nice :(

ctx

var canvas = document.createElement("canvas");
var ctx = canvas.getContext("2d");

var color = Spectra("rgba(255, 0, 0, 0.5)");

ctx.strokeStyle = color;
console.log(ctx.strokeStyle); // expect "rgba(255,0,0,0.5)"

toString

var color = Spectra("rgba(255, 0, 0, 0.5)");
console.log(color.toString()); // expect "rgba(255,0,0,0.5)"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants