123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146 |
- class RGB {
- #r = 0
- #g = 0
- #b = 0
- constructor(){
- console.log(this.#r, this.#g, this.#b)
- }
- checkRange(value){
- return value >= 0 && value <= 255
- }
- get r(){
- return this.#r
- }
- set r(newR){
- this.#r = this.checkRange(newR) ? newR : this.#r
- }
- get g(){
- return this.#g
- }
- set g(newG){
- this.#g = this.checkRange(newG) ? newG : this.#g
- }
- get b(){
- return this.#b
- }
- set b(newB){
- this.#b = this.checkRange(newB) ? newB : this.#b
- }
- get hex(){
- const t = a => (a < 16 ? '0' : '') + a.toString(16).toUpperCase()
- return `#${t(this.#r)}${t(this.#g)}${t(this.#b)}`
- }
- set hex(newHex){
- const hexRegexp = /^#([0-9A-Fa-f]{2})([0-9A-Fa-f]{2})([0-9A-Fa-f]{2})$/
- let parsed;
- if (parsed = newHex.match(hexRegexp)){
- //console.log(parsed)
- const [,r,g,b] = parsed
- this.r = parseInt(r, 16)
- this.g = parseInt(g, 16)
- this.b = parseInt(b, 16)
- }
- else {
- throw SyntaxError('wrong hex color')
- }
- }
- get rgb(){
- const {r,g,b} = this
- return `rgb(${r},${g},${b})`
- }
- set rgb(newRGB) {
- const rgbRegexp = /^\s*rgb\s*\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)\s*$/
- let parsed;
- if (parsed = newRGB.match(rgbRegexp)){
- const [,r,g,b] = parsed
- this.#r = +r;
- this.#g = +g;
- this.#b = +b;
- }
- else {
- throw SyntaxError('wrong rgb color')
- }
- }
- }
- class RGBA extends RGB {
- #a = 0;
- constructor() {
- super();
- console.log(this.r, this.g, this.b, this.#a)
- }
- checkAlphaRange(value){
- return value >= 0 && value <= 1
- }
- get a(){
- return this.#a
- }
- set a(newA){
- this.#a = this.checkAlphaRange(newA) ? newA : this.#a
- }
- get rgba(){
- const {r,g,b,a} = this
- return `rgba(${r},${g},${b},${a})`
- }
- set rgba(newRGBA) {
- const rgbRegexp = /^\s*rgba\s*\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*((0\.\d+)|1|0)\s*\)\s*$/
- let parsed;
- if (parsed = newRGBA.match(rgbRegexp)){
- const [,r,g,b,a] = parsed
- this.r = +r
- this.g = +g
- this.b = +b
- this.a = +a
- }
- else {
- throw SyntaxError('wrong rgba color')
- }
- }
- set color(color) {
- if(color.includes('#')) {
- this.hex = color;
- } else if(color.includes('rgba')) {
- this.rgba = color;
- } else if(color.includes('rgb')) {
- this.rgb = color;
- }
- }
- }
- let rgb = new RGB;
- let rgb2 = new RGB;
- let rgba = new RGBA;
- let rgba2 = new RGBA;
- let rgba3 = new RGBA;
- let rgba4 = new RGBA;
- rgb.hex = '#eeccee';
- console.log('rgb', rgb);
- rgb2.rgb = 'rgb(238, 204, 238)';
- console.log('rgb2', rgb2);
- console.log('get rgba', rgba.rgba)
- rgba2.color = 'rgb(200, 45, 255)';
- rgba3.color = '#eeeccc';
- rgba4.color = 'rgba(102, 45, 255, 0.7)';
- console.log(rgba2)
- console.log(rgba3)
- console.log(rgba4)
|