Skip to content

Commit 627be73

Browse files
authored
Merge pull request #1 from sourcetoad/non-wrapped-badge
Non-wrapped badge style
2 parents 243a3d4 + 4c5856e commit 627be73

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

54 files changed

+1889
-539
lines changed

README.md

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
# Add Badge
22

3-
A set of node commands to add an overlay badge, inset to the non-transparent area. Meant for PNG app icons with equal
4-
insets.
3+
Node commands to add an overlay badge, inset to the non-transparent area.
54

65
| ![](https://github.com/sourcetoad/add-badge/raw/master/samples/output/ic_launcher-xxxhdpi.png) | ![](https://github.com/sourcetoad/add-badge/raw/master/samples/output/ic_launcher_round-xxxhdpi.png) |
76
|------------------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------|
@@ -38,12 +37,14 @@ See [fast-glob](https://github.com/mrmlnc/fast-glob) for glob details.
3837

3938
### Options
4039

41-
| Option | Description | Default |
42-
|----------------------|------------------------------------------------------------|------------------------|
43-
| `--font-file` | Text font file | Roboto Black (Bundled) |
44-
| `--font-size` | Text size (pt, scaled up for larger images) | 22 |
45-
| `--text-color` | Text color (`transparent` for transparent) | #666666 |
46-
| `--background-color` | Badge background color | #ffffff |
47-
| `--shadow-color` | Badge shadow color | rgba(0,0,0,0.5) |
48-
| `--gravity` | Badge gravity (northwest, northeast, southwest, southeast) | southeast |
49-
| `--dry-run`/`-d` | Does not perform actions | |
40+
See [samples](https://github.com/sourcetoad/add-badge/blob/master/SAMPLES.md) for some previews.
41+
42+
| Option | Description | Default |
43+
|----------------------|--------------------------------------------------------------------------|------------------------|
44+
| `--font-file` | Text font file | Roboto Black (Bundled) |
45+
| `--font-size` | Text size (pt, scaled for images not 192px) | 28 |
46+
| `--text-color` | Text color (`transparent` for transparent) | #666666 |
47+
| `--background-color` | Badge background color | #ffffff |
48+
| `--gravity` | Badge gravity (northwest, north, northeast, southwest, south, southeast) | southeast |
49+
| `--shadow-color` | Badge shadow color | rgba(0,0,0,0.6) |
50+
| `--dry-run`/`-d` | Does not perform actions | |

SAMPLES.md

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
## Samples
2+
3+
### Gravity
4+
5+
| `--gravity northwest` | `--gravity north` | `--gravity northeast` |
6+
|---------------------------------------------------------------|-----------------------------------------------------------|---------------------------------------------------------------|
7+
| ![](./samples/output/ic_launcher-xxxhdpi-northwest.png) | ![](./samples/output/ic_launcher-xxxhdpi-north.png) | ![](./samples/output/ic_launcher-xxxhdpi-northeast.png) |
8+
| ![](./samples/output/ic_launcher_round-xxxhdpi-northwest.png) | ![](./samples/output/ic_launcher_round-xxxhdpi-north.png) | ![](./samples/output/ic_launcher_round-xxxhdpi-northeast.png) |
9+
10+
| `--gravity southwest` | `--gravity south` | `--gravity southeast` |
11+
|---------------------------------------------------------------|-----------------------------------------------------------|-----------------------------------------------------|
12+
| ![](./samples/output/ic_launcher-xxxhdpi-southwest.png) | ![](./samples/output/ic_launcher-xxxhdpi-south.png) | ![](./samples/output/ic_launcher-xxxhdpi.png) |
13+
| ![](./samples/output/ic_launcher_round-xxxhdpi-southwest.png) | ![](./samples/output/ic_launcher_round-xxxhdpi-south.png) | ![](./samples/output/ic_launcher_round-xxxhdpi.png) |
14+
15+
### Size
16+
17+
| Adaptive | MDPI | MDPI Round |
18+
|---------------------------------------------------|--------------------------------------------|--------------------------------------------------|
19+
| ![](./samples/output/ic_launcher_foreground.webp) | ![](./samples/output/ic_launcher-mdpi.png) | ![](./samples/output/ic_launcher_round-mdpi.png) |
20+
21+
### Appearance
22+
23+
| `--background-color "rgba(0,0,0,0.75)"` `--text-color transparent` |
24+
|--------------------------------------------------------------------|
25+
| ![](./samples/output/ic_launcher-xxxhdpi-dark-transparent.png) |
26+
27+
| `--font-size 50` |
28+
|------------------------------------------------------------|
29+
| ![](./samples/output/ic_launcher_round-xxxhdpi-larger.png) |

__tests__/setup.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { initializeImageMagick } from '@imagemagick/magick-wasm';
2+
import { dirname } from 'path';
3+
import { fileURLToPath } from 'url';
4+
5+
global.__filename = fileURLToPath(import.meta.url);
6+
global.__dirname = dirname(__filename);
7+
8+
await initializeImageMagick();
Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
import { Gravity, ImageMagick } from '@imagemagick/magick-wasm';
2+
import * as fs from 'fs';
3+
import { describe, expect, it } from 'vitest';
4+
5+
import getInsetAtGravity from '../../src/utils/getInsetAtGravity';
6+
7+
describe('getInsetAtGravity', () => {
8+
it.each([
9+
// region ic_launcher-xxxhdpi.png
10+
[
11+
'ic_launcher-xxxhdpi.png North',
12+
'ic_launcher-xxxhdpi.png',
13+
Gravity.North,
14+
20,
15+
],
16+
[
17+
'ic_launcher-xxxhdpi.png West',
18+
'ic_launcher-xxxhdpi.png',
19+
Gravity.West,
20+
20,
21+
],
22+
[
23+
'ic_launcher-xxxhdpi.png East',
24+
'ic_launcher-xxxhdpi.png',
25+
Gravity.East,
26+
20,
27+
],
28+
[
29+
'ic_launcher-xxxhdpi.png South',
30+
'ic_launcher-xxxhdpi.png',
31+
Gravity.South,
32+
19,
33+
],
34+
// endregion
35+
// region ic_launcher_round-xxxhdpi.png
36+
[
37+
'ic_launcher_round-xxxhdpi.png North',
38+
'ic_launcher_round-xxxhdpi.png',
39+
Gravity.North,
40+
8,
41+
],
42+
[
43+
'ic_launcher_round-xxxhdpi.png West',
44+
'ic_launcher_round-xxxhdpi.png',
45+
Gravity.West,
46+
8,
47+
],
48+
[
49+
'ic_launcher_round-xxxhdpi.png East',
50+
'ic_launcher_round-xxxhdpi.png',
51+
Gravity.East,
52+
8,
53+
],
54+
[
55+
'ic_launcher_round-xxxhdpi.png South',
56+
'ic_launcher_round-xxxhdpi.png',
57+
Gravity.South,
58+
7,
59+
],
60+
// endregion
61+
])('works as expected with %s', async (_, file, gravity, expected) => {
62+
let result: number | undefined = undefined;
63+
64+
await ImageMagick.read(
65+
fs.readFileSync(`samples/input/${file}`),
66+
(image) => {
67+
result = getInsetAtGravity(image, gravity as number);
68+
},
69+
);
70+
71+
expect(result).toEqual(expected);
72+
});
73+
});
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { describe, expect, it } from 'vitest';
2+
3+
import roundToEven from '../../src/utils/roundToEven';
4+
5+
describe('roundToEven', () => {
6+
it.each([
7+
[0.9, 0],
8+
[1, 2],
9+
[2, 2],
10+
[2.8, 2],
11+
[3, 4],
12+
])('rounds as expected', (input, expected) => {
13+
const result = roundToEven(input);
14+
15+
expect(result).toEqual(expected);
16+
});
17+
});

build.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,3 +27,9 @@ build({
2727
entryPoints: ['src/commands/addBadges.ts'],
2828
outfile: 'bin/add-badges.js',
2929
}).catch(() => process.exit(1));
30+
31+
build({
32+
...config,
33+
entryPoints: ['src/commands/generateSamples.ts'],
34+
outfile: 'bin/generate-samples.js',
35+
}).catch(() => process.exit(1));

0 commit comments

Comments
 (0)