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

Can now create a new jimp with the CSS hex color format #549

Merged
merged 6 commits into from
Aug 14, 2018

Conversation

CodySchrank
Copy link
Contributor

@CodySchrank CodySchrank commented Aug 14, 2018

What's Changing and Why

Adds the popular css hex color format for creating a new jimp.

new Jimp(512, 512, '#D95353', (image) => {});

What else might be affected

Added a conversion function from css hex color to hex

Also added tests for creating image with hex color and css color.

Copy link
Collaborator

@hipstersmoothie hipstersmoothie left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is awesome! Just a few changed

src/index.js Outdated

if (typeof cssColor === 'number') return Number(cssColor);

const color = new tinyColor(cssColor);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think the new is required here.

README.md Outdated
@@ -504,6 +504,12 @@ Jimp.rgbaToInt(r, g, b, a); // e.g. converts 255, 255, 255, 255 to 0xFFFFFFFF
Jimp.intToRGBA(hex); // e.g. converts 0xFFFFFFFF to {r: 255, g: 255, b: 255, a:255}
```

You can convert a css hex color to its true rgba hexadecimal equivalent:
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It seems like tinycolor2 can take more than just a hex value.

https://www.npmjs.com/package/tinycolor2

Can you update this to reflect that you can also pass in RGB, RGBA, HSL, HSLA, HSV, HSVA, and named values also?

done();
})
.on('error', done);
});
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

And add a test or two for the above mentioned extra color formats

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Also can you switch these tests to async await?

it('initializes with a color', async () => {
	const image = await Jimp.create(2, 2, 0xffffffff)
	image.getPixelColor(1, 1).should.be.equal(0xffffffff);
});

@CodySchrank
Copy link
Contributor Author

Sure. Also I don't know why the pr diff is so much in jimp.d.ts I only added 5 lines.

@hipstersmoothie
Copy link
Collaborator

@CodySchrank the type file looks fine! it's done that on other PRs also, weird for sure.

@CodySchrank
Copy link
Contributor Author

I'll let you deal with the docs because now there's a bunch of ways to add a color and I don't know how you want to show that in the readme.

@hipstersmoothie hipstersmoothie merged commit a740955 into jimp-dev:master Aug 14, 2018
@hipstersmoothie
Copy link
Collaborator

@CodySchrank thanks for your work!

@CodySchrank
Copy link
Contributor Author

@hipstersmoothie Thanks for maintaining this I've been using it heavily.

@hipstersmoothie hipstersmoothie added the enhancement a request for a new feature or change in behavior label Aug 14, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement a request for a new feature or change in behavior
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants