Skip to content

Commit

Permalink
cropify 1.0.0
Browse files Browse the repository at this point in the history
  • Loading branch information
flameface committed Jan 19, 2024
0 parents commit 6088412
Show file tree
Hide file tree
Showing 6 changed files with 308 additions and 0 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
node_modules
12 changes: 12 additions & 0 deletions index.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
interface cropOption {
imagePath: string,
x: number,
y: number,
width: number,
height: number,
borderRadius?: number
}

declare function cropImage(options: cropOption): Promise<Buffer>;

export { cropImage }
40 changes: 40 additions & 0 deletions index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
const { createCanvas, loadImage } = require('@napi-rs/canvas');

async function cropImage({
imagePath,
x,
y,
width,
height,
borderRadius = 0
}) {
try {
const image = await loadImage(imagePath);

const canvas = createCanvas(width, height);
const ctx = canvas.getContext('2d');

if (borderRadius > 0) {
ctx.beginPath();
ctx.moveTo(borderRadius, 0);
ctx.lineTo(width - borderRadius, 0);
ctx.quadraticCurveTo(width, 0, width, borderRadius);
ctx.lineTo(width, height - borderRadius);
ctx.quadraticCurveTo(width, height, width - borderRadius, height);
ctx.lineTo(borderRadius, height);
ctx.quadraticCurveTo(0, height, 0, height - borderRadius);
ctx.lineTo(0, borderRadius);
ctx.quadraticCurveTo(0, 0, borderRadius, 0);
ctx.closePath();
ctx.clip();
}

ctx.drawImage(image, x, y, width, height, 0, 0, width, height);

return canvas.toBuffer('image/png');
} catch (error) {
console.error('Error cropping image:', error.message);
}
}

module.exports = { cropImage };
174 changes: 174 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

32 changes: 32 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
{
"name": "cropify",
"types": "./index.d.ts",
"description": "Crop and round image corners seamlessly.",
"version": "1.0.0",
"main": "index.js",
"publishConfig": {
"access": "public",
"registry": "https://registry.npmjs.org"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "MIT",
"dependencies": {
"@napi-rs/canvas": "^0.1.44"
},
"devDependencies": {},
"repository": {
"type": "git",
"url": "https://github.com/unburn/cropify.git"
},
"bugs": {
"url": "https://github.com/unburn/cropify/issues"
},
"funding": {
"type": "githubsponser",
"url": "https://github.com/sponsors/flameface"
}
}
49 changes: 49 additions & 0 deletions readme.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
## About
**Cropify** helps to crop and round image corners seamlessly.

## Features
- Crop images with precision using the Canvas API.
- Optional support for rounding corners with a customizable border radius.
- Designed for simplicity and performance.

## Installation
```
npm install cropify
```

## Usage
```javascript
const { cropImage } = require("./index");
const fs = require("fs")

const imagePath = 'https://raw.githubusercontent.com/unburn/.github/main/assets/unburngithub.png';

const cropX = 600;
const cropY = 0;
const cropWidth = 722;
const cropHeight = 422;
const borderRadius = 20;

cropImage({
imagePath: imagePath,
x: cropX,
y: cropY,
width: cropWidth,
height: cropHeight,
borderRadius: borderRadius
}).then(x => {
fs.writeFileSync("cropped-image.png", x);
});
```

## Output
### Original

![original](https://raw.githubusercontent.com/unburn/.github/main/assets/unburngithub.png)

### Cropped

![crop](https://raw.githubusercontent.com/unburn/.github/main/assets/cropped-image.png)

---
If you need help or want some features to be added, join our official [discord](https://discord.com/invite/qDysF95NWh) community.

0 comments on commit 6088412

Please sign in to comment.