|
@@ -0,0 +1,97 @@
|
|
|
|
|
+<header></header>
|
|
|
|
|
+
|
|
|
|
|
+<body>
|
|
|
|
|
+ <script>
|
|
|
|
|
+ class RGB {
|
|
|
|
|
+ #r = 0
|
|
|
|
|
+ #g = 0
|
|
|
|
|
+ #b = 0
|
|
|
|
|
+ checkChannelValue(val) {
|
|
|
|
|
+ val = +val
|
|
|
|
|
+ if (typeof val !== "number" || val < 0 || val > 255) {
|
|
|
|
|
+ throw new Error(`invalid channel value: ${val}`)
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ get r() {
|
|
|
|
|
+ return this.#r;
|
|
|
|
|
+ }
|
|
|
|
|
+ set r(val) {
|
|
|
|
|
+ this.checkChannelValue(val);
|
|
|
|
|
+ this.#r = +val;
|
|
|
|
|
+ }
|
|
|
|
|
+ get g() {
|
|
|
|
|
+ return this.#g;
|
|
|
|
|
+ }
|
|
|
|
|
+ set g(val) {
|
|
|
|
|
+ this.checkChannelValue(val);
|
|
|
|
|
+ this.#g = +val;
|
|
|
|
|
+ }
|
|
|
|
|
+ get b() {
|
|
|
|
|
+ return this.#b;
|
|
|
|
|
+ }
|
|
|
|
|
+ set b(val) {
|
|
|
|
|
+ this.checkChannelValue(val);
|
|
|
|
|
+ this.#b = +val;
|
|
|
|
|
+ }
|
|
|
|
|
+ set hex(val) {
|
|
|
|
|
+ let matchColors = /^#([0-9A-Fa-f]{2})([0-9A-Fa-f]{2})([0-9A-Fa-f]{2})$/;
|
|
|
|
|
+ let match = matchColors.exec(val);
|
|
|
|
|
+ if (match !== null && match.length == 4) {
|
|
|
|
|
+ this.r = parseInt(`${match[1]}`, 16);
|
|
|
|
|
+ this.g = parseInt(`${match[2]}`, 16);
|
|
|
|
|
+ this.b = parseInt(`${match[3]}`, 16);
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+ throw new Error(`incorrect hex color parameter: ${val}`);
|
|
|
|
|
+ }
|
|
|
|
|
+ get hex() {
|
|
|
|
|
+ return `#${this.r.toString(16).toUpperCase()}${this.g.toString(16).toUpperCase()}${this.b.toString(16).toUpperCase()}`;
|
|
|
|
|
+ }
|
|
|
|
|
+ set rgb(val) {
|
|
|
|
|
+ let matchColors = /^rgb\((\d{1,3}), (\d{1,3}), (\d{1,3})\)$/;
|
|
|
|
|
+ let match = matchColors.exec(val);
|
|
|
|
|
+ if (match !== null && match.length == 3) {
|
|
|
|
|
+ this.r = match[1];
|
|
|
|
|
+ this.g = match[2];
|
|
|
|
|
+ this.b = match[3];
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+ throw new Error(`incorrect rgb color parameter: ${val}`);
|
|
|
|
|
+ }
|
|
|
|
|
+ get rgb() {
|
|
|
|
|
+ return `rgb(${this.r}, ${this.g}, ${this.b})`;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ /* constructor(r, g, b) {
|
|
|
|
|
+ this.r = r;
|
|
|
|
|
+ this.g = g;
|
|
|
|
|
+ this.b = b;
|
|
|
|
|
+ }*/
|
|
|
|
|
+ constructor(colorString) {
|
|
|
|
|
+ if (colorString.startsWith("#"))
|
|
|
|
|
+ this.hex = colorString;
|
|
|
|
|
+ else
|
|
|
|
|
+ this.rgb = colorString;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ }
|
|
|
|
|
+ function assertAreEqual(actual, expected) {
|
|
|
|
|
+ if (actual != expected)
|
|
|
|
|
+ throw new Error(`not expected value. actual: ${actual}, expected: ${expected}`);
|
|
|
|
|
+ }
|
|
|
|
|
+ //let color = new RGB('#AABBFF');
|
|
|
|
|
+ //assertAreEqual(color.hex, '#AABBFF');
|
|
|
|
|
+ let color = new RGB ('rgb(55, 49, 121)');
|
|
|
|
|
+ assertAreEqual(color.rgb, ('55, 49, 121'));
|
|
|
|
|
+ assertAreEqual(color.hex, `#373179`);
|
|
|
|
|
+ //*color.rgb = `rgb(55, 49, 121)`;
|
|
|
|
|
+ //assertAreEqual(color.r, 55);
|
|
|
|
|
+ //assertAreEqual(color.g, 49);
|
|
|
|
|
+ // assertAreEqual(color.b, 121);
|
|
|
|
|
+ //assertAreEqual(color.rgb, `rgb(55, 49, 121)`);
|
|
|
|
|
+ //assertAreEqual(color.hex, `#373179`);
|
|
|
|
|
+ </script>
|
|
|
|
|
+</body>
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
