Skip to content

Commit

Permalink
formatHex8 (#103)
Browse files Browse the repository at this point in the history
* formatHex8

* adopt template literals
  • Loading branch information
mbostock committed Mar 28, 2022
1 parent ac660c6 commit e4bc34e
Show file tree
Hide file tree
Showing 2 changed files with 24 additions and 7 deletions.
24 changes: 17 additions & 7 deletions src/color.js
Expand Up @@ -9,12 +9,12 @@ var reI = "\\s*([+-]?\\d+)\\s*",
reN = "\\s*([+-]?(?:\\d*\\.)?\\d+(?:[eE][+-]?\\d+)?)\\s*",
reP = "\\s*([+-]?(?:\\d*\\.)?\\d+(?:[eE][+-]?\\d+)?)%\\s*",
reHex = /^#([0-9a-f]{3,8})$/,
reRgbInteger = new RegExp("^rgb\\(" + [reI, reI, reI] + "\\)$"),
reRgbPercent = new RegExp("^rgb\\(" + [reP, reP, reP] + "\\)$"),
reRgbaInteger = new RegExp("^rgba\\(" + [reI, reI, reI, reN] + "\\)$"),
reRgbaPercent = new RegExp("^rgba\\(" + [reP, reP, reP, reN] + "\\)$"),
reHslPercent = new RegExp("^hsl\\(" + [reN, reP, reP] + "\\)$"),
reHslaPercent = new RegExp("^hsla\\(" + [reN, reP, reP, reN] + "\\)$");
reRgbInteger = new RegExp(`^rgb\\(${reI},${reI},${reI}\\)$`),
reRgbPercent = new RegExp(`^rgb\\(${reP},${reP},${reP}\\)$`),
reRgbaInteger = new RegExp(`^rgba\\(${reI},${reI},${reI},${reN}\\)$`),
reRgbaPercent = new RegExp(`^rgba\\(${reP},${reP},${reP},${reN}\\)$`),
reHslPercent = new RegExp(`^hsl\\(${reN},${reP},${reP}\\)$`),
reHslaPercent = new RegExp(`^hsla\\(${reN},${reP},${reP},${reN}\\)$`);

var named = {
aliceblue: 0xf0f8ff,
Expand Down Expand Up @@ -176,6 +176,7 @@ define(Color, color, {
},
hex: color_formatHex, // Deprecated! Use color.formatHex.
formatHex: color_formatHex,
formatHex8: color_formatHex8,
formatHsl: color_formatHsl,
formatRgb: color_formatRgb,
toString: color_formatRgb
Expand All @@ -185,6 +186,10 @@ function color_formatHex() {
return this.rgb().formatHex();
}

function color_formatHex8() {
return this.rgb().formatHex8();
}

function color_formatHsl() {
return hslConvert(this).formatHsl();
}
Expand Down Expand Up @@ -262,12 +267,17 @@ define(Rgb, rgb, extend(Color, {
},
hex: rgb_formatHex, // Deprecated! Use color.formatHex.
formatHex: rgb_formatHex,
formatHex8: rgb_formatHex8,
formatRgb: rgb_formatRgb,
toString: rgb_formatRgb
}));

function rgb_formatHex() {
return "#" + hex(this.r) + hex(this.g) + hex(this.b);
return `#${hex(this.r)}${hex(this.g)}${hex(this.b)}`;
}

function rgb_formatHex8() {
return `#${hex(this.r)}${hex(this.g)}${hex(this.b)}${hex((isNaN(this.opacity) ? 1 : this.opacity) * 255)}`;
}

function rgb_formatRgb() {
Expand Down
7 changes: 7 additions & 0 deletions test/rgb-test.js
Expand Up @@ -46,6 +46,13 @@ it("rgb.formatHex() formats as #rrggbb", () => {
assert.strictEqual(rgb("hsla(60, 100%, 20%, 0.4)").formatHex(), "#666600");
});

it("rgb.formatHex8() formats as #rrggbbaa", () => {
assert.strictEqual(rgb("#abcdef").formatHex8(), "#abcdefff");
assert.strictEqual(rgb("hsl(60, 100%, 20%)").formatHex8(), "#666600ff");
assert.strictEqual(rgb("rgba(12%, 34%, 56%, 0.4)").formatHex8(), "#1f578f66");
assert.strictEqual(rgb("hsla(60, 100%, 20%, 0.4)").formatHex8(), "#66660066");
});

it("rgb.hex() is an alias for rgb.formatHex()", () => {
assert.strictEqual(color.prototype.hex, color.prototype.formatHex);
assert.strictEqual(rgb.prototype.hex, rgb.prototype.formatHex);
Expand Down

0 comments on commit e4bc34e

Please sign in to comment.